Typeahead.js trouble - Suggestions not appear

2
votes

Here is my js code to execute typeahead:

jQuery.noConflict();
jQuery(document).ready(function(){
    jQuery('.search-field.input').typeahead({
        name: 'group-static',
        prefetch: 'http://ws.luyencong.net/data/search/query.php?do=advanced',
        header: '<span class="group-title">General Content</span>',
        template: [
        '<img class="icon" src="{{icon}}" style="width: 38px; height: 38px" />',
        '<div class="icon-desc"><span xmlns="http://www.w3.org/1999/xhtml" class="title">{{name}}</span>',
        '<span xmlns="http://www.w3.org/1999/xhtml" class="desc">{{description}}</span></div>',
        '<span class="clear"></span>'
        ].join(''),
        engine: Hogan
    });
});

Typeahead is executed (Because I can see tt-hint input, and the wrapper of suggestion div) But there is a trouble, when I type a character, the suggestion is not display as it must to be.

My JSON is located at : http://ws.luyencong.net/data/search/query.php?do=advanced

Please give me some helps. Thanks.

1
javascripttypeahead.js
Do you see any errors in the JavaScript console? - jharding
No, the JSON file is GET normally (but idk why it was red but it is not an error when i filter by) You can check luyencong.net - LCTG
What do you mean when you "filter by"? Looks like the issue is due to you making a cross-domain request. If at all possible, serve the JSON from luyencong.net, not ws.luyencong.net. - jharding
Is this correct if I change prefect url to /ws/data/search/query.php?do=advanced I mean filter Error in Console (Firebug) - LCTG

1 Answers

1
votes

This isn't really a typeahead.js issue. The issue is that you are making a cross-domain request from luyencong.net to ws.luyencong.net. If you can, host the prefetch JSON file on luyencong.net – that's probably the easiest solution.

jQuery('.search-field.input').typeahead({
  // ...
  prefetch: 'http://luyencong.net/data/search/query.php?do=advanced'
  // ...
});

If you can't do that, there are some other options: