CODEWITHSUNDEEP
jqueryjquery-uiautocomplete
croar
croar

Reputation: 33

jQuery Autocomplete remote source not working

I have a autocomplete in jQuery UI 1.9.2 that loads data from a remote source. It works when the data is within the same file in a tag but as soon as I move it to a remote datasource I get no suggestions in the box. I am sure that the json is valid; I have checked its validity many times. I've also tried many of the solutions present here on this site and no luck so far.

the jQuery code (already connected to jquery-ui-1.9.2.custom.min.js):

$(document).ready(function() {
    $('#q').autocomplete({
        source:'/json.php',
        minLength: 1,
        dataType: 'json',
        focus: function( event, ui ) {
            $('#q').val( ui.item.label );
            return false;
        },
        select: function( event, ui ) {
            $('#q').val( ui.item.label );
            return false;
        }
    })
    .data('ui-autocomplete')._renderItem = function( ul, item ) {
        return $('<li>')
        .append('<a><span class="flabel">'+item.label+'</span><br /><span class="fvalue">'+item.value+'</span></a>').appendTo(ul);
    };
});

I hope somebody can help me out here. This has caused hours of frustration.

Upvotes: 0

Views: 1349

Answers (1)

Miro
Miro

Reputation: 8650

You have 2 or 3 empty characters between your "value:" and the value. Only on the third entry. That messes up the rest of the json.

So you have "value":___"Nicrophorus orbicollis"
when it should be "value":"Nicrophorus orbicollis"

It's hard to see because they are non-visible but if you paste one line in a text editor and start deleting the characters you'll see that there are some empty characters there.In the text editor, you can also change the encoding to ANSI and you'll see the characters as question marks ("value":??"Nicrophorus orbicollis").

Check what your php code spits out.

Upvotes: 1

Related Questions