0

Have been trying for some time, and cannot find an answer to this. Typeahead works with local data, but not with remote data. Although I see the request in the console, but it does not return any data into typeahead.

In the console as I am Typing I get:

XHR finished loading: GET "http://mypath/msqCity.php?City=ne"
XHR finished loading: GET "http://mypath/msqCity.php?City=new"

And So on as I type. But nothing in the typeahead field.

I have a PHP Page with a Query on it. The query page works fine and returns the data. The thing I noticed is the key value of the array shows with double quotes instead of single.

I am using json_encode on the results and it outputs

[{"City":"New York","StateProvince":"NY","Country":"US"},
 {"City":"Newton","StateProvince":"MA","Country":"US"},
 {"City":"New Orleans","StateProvince":"LA","Country":"US"}...]

I have tried stopping the double quotes and get:

[{City:"New York",StateProvince:"NY",Country:"US"},
 {City:"Newton",StateProvince:"MA",Country:"US"},
 {City:"New Orleans",StateProvince:"LA",Country:"US"}...]

Neither of these work remotely.

If I put the data to local on typeahead and paste a few records in, it works.

<body>
    <div id="remote">
        <input class="typeahead" type="text" placeholder="Enter City">
    </div>
    <script type="text/javascript">

        var cities = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('City'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            /* local:    [{
                           City: 'Hartford',
                           StateProvince: 'CT',
                           Country : 'US'
                       },
                       {
                           City: 'Trumbull',
                           StateProvince: 'CT',
                           Country: 'US'
                       },
                       {
                           City: 'New York',
                           StateProvince: 'NY',
                           Country: 'US'
                       },
                        {
                           City: 'New Britain',
                           StateProvince: 'CT',
                           Country: 'US'
                       }
                   ]});   */
        prefetch: 'ScriptLibrary/msqCity.php',
        remote: {
            url: 'ScriptLibrary/msqCity.php?City=%QUERY',
            wildcard: '%QUERY'
            }
        });

        $('#remote .typeahead').typeahead(null, {
            name: 'City',
            display: 'City',
            source: cities
        });
    </script>
</body>

Any direction would be appreciated.

mikhail
  • 5,019
  • 2
  • 34
  • 47
pcm70
  • 63
  • 6

1 Answers1

0

The issue was the query was in a php page with html. I stripped out all the html and just left the query, and it is fine now.

pcm70
  • 63
  • 6