Instantsearch.js results are not linking to url

Hello!

I have just made an index with 14 entries and I gave each entry a unique URL that links to a specific pages on my website. I got the search box all set up and everything, and even the results are showing up. But, when I click on a name, I am not being redirected to the URL that I linked to that player name in my index. What is the issue? I would love to start using it on my website but I can’t do it without having the players’ names actually redirect to certain pages on my website.

Here’s my JS Fiddle of the code. Please ignore the search icon in the bottom/mid right, it works just fine on my website.

https://jsfiddle.net/Amtennisfed/7cwa1z29/

1 Like

Hi again @americantennisfedera,

Thanks for providing the fiddle, that helps a lot :wink:

By default autocomplete doesn’t make any assumption on what to do when an item is selected.
This makes it easier to use the autocomplete.js library in different contexts.

You have to actually tell it what to do by reacting to the “selected” event and redirect the user according to the suggestion being selected.

I forked your code and patched it according to your datastructure: https://jsfiddle.net/rayrutjes/7cwa1z29/1/

I just added:

autocomplete(/*your existing code*/)
.on('autocomplete:selected', function(event, suggestion, dataset) {
    location.href = suggestion.url;
  });

I hope that helps!

PS: quick tip regarding JSFiddle, you can add external resources so that the code can run. That way we can directly play with it :wink:

WOW! Perfect!! Thank you so much! And thanks for the JSFiddle tip!

1 Like

My pleasure, feel free to open new topics if you have new questions later on!

Okay, I changed my code and added what you added (so now they are identical), but the one on your JSFiddle is working and the one on my JSFiddle is not working, nor is it working on my website. What am I doing wrong?

That’s unfortunate :confused:

Could you tell us which build of the autocomplete.js library you are using?
Also, do you have any errors logged in the console?

Could it be that the url attribute is not present on certain records?

Okay i figured it out, I had to add the external sources that you had. I added them to my website as well and it is working!

1 Like

:tada: Happy coding! :tada:

Don’t know if you can still help me, but I have another question. I am trying to add this to my whole site, not just a single page anymore. I have all the same info entered in for putting site wide as I did for the search box on the one single page, but it is not showing any results like the one on the single page is. Anybody have any suggestions as to what I am doing wrong and what I need to change?

The JS Fiddle above is the current one I am using for my website.