Instantsearch.js: Unable to find #search-input using instantsearch.js and Meteor

Created on 4 Jul 2016 · 8Comments · Source: algolia/instantsearch.js

I am trying to use the instantsearch.js tutorial with Meteor but I have this error:

utils.js:79Uncaught Error: Container must be string or HTMLElement. Unable to find #search-box

Here is my code:

screenshot 2016-07-04 12 50 54
screenshot 2016-07-04 12 51 18

Source

yonidejene

Most helpful comment

Is your main.js script inserted before the HTML DOM?

If so, you might want to use the https://developer.mozilla.org/en/docs/Web/Events/DOMContentLoaded

Let me know how it goes.

vvo on 4 Jul 2016

👍3

All 8 comments

Hi @yonidej you might have a caching issue or something because "Unable to find #search-box" means that you sent "#search-box" as a container for the searchBox, while it's "search-input"

vvo on 4 Jul 2016

Sorry, I meant search-input

yonidejene on 4 Jul 2016

I get this error every time I try to connect a widget with it's corresponding id/html element. Maybe it has something to do with Meteor?

yonidejene on 4 Jul 2016

Is your main.js script inserted before the HTML DOM?

If so, you might want to use the https://developer.mozilla.org/en/docs/Web/Events/DOMContentLoaded

Let me know how it goes.

vvo on 4 Jul 2016

👍3

It works. Thank you!

yonidejene on 4 Jul 2016

❤1

@vvo I made a repo for Meteor + Instantsearch.js compatibility. In addition to using the DOMContentLoaded event, I had to remove the getTemplate function and use a Mustache String template instead of wrapping it in a script like the tutorial. It probably has something to do with Blaze templating...Anyways, hope this helps!

yonidejene on 4 Jul 2016

Am having the same problem implementing in a Jekyll site.