Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

collinsjd's avatar

Typeahead.js and Bloodhound

I'm trying to use a vue-typeahead js library ( https://mrabbani.github.io/examples/vue_typeahead/ )

And prefetch works fine (to the same endpoint as Remote), but Remote isn't working. For that matter, Remote on the official twitter typeahead.js isn't working for me either.

The plugin is making the AJAX calls, and returning the results, but they aren't showing up as dropdown elements below the input. Any ideas?

0 likes
2 replies
collinsjd's avatar

This works fine:

<vue-typeahead
      prefetch="/api/customers/firstname"
      v-on:selected="done"
      :default-suggestion="false"
      display-key='first_name'
      :suggestion-template="myTemplate"
      placeholder="By First name...">
</vue-typeahead>

This doesn't return anything in the actual search:

<vue-typeahead
      remote="/api/customers/firstname"
      v-on:selected="done"
      :default-suggestion="false"
      display-key='first_name'
      :suggestion-template="myTemplate"
      placeholder="By First name...">
</vue-typeahead>

or this:

<vue-typeahead
      remote="/api/customers/firstname/%QUERY"
      v-on:selected="done"
      :default-suggestion="false"
      display-key='first_name'
      :suggestion-template="myTemplate"
      placeholder="By First name...">
</vue-typeahead>

My controller simply returns a JSON block of users. Routes work fine. AJAX calls are being made to the server, but the results aren't parsed into the dropdown. I see similar here:

https://twitter.github.io/typeahead.js/examples/

Take a look at the remote example....it doesn't work. Just a bunch of 404s to the AJAX calls it makes.

Please or to participate in this conversation.