Search code examples
ajaxjsonjquery-uiautocomplete

Autocomplete shows only message N results are available, use up and down arrow keys to navigate. instead show list


my problem is clear.

I'm using jquery autocomplete and i don't know why it shows me only the message:

9 results are available, use up and down arrow keys to navigate.

Without showing me the list of result.

This is my code:

<p class="select-c">
     <label for="fcb">Location</label>
     <input id="fcb" name="fcb" type="text">                        
</p>


$("#fcb").autocomplete({
        source: function (request, response) {
            $.ajax({
                type: "GET",
                dataType: 'json',
                url: "../ws/city/" + request.term,
                async: true,
                success: function( data ) {
                    response( $.map( data, function( item,key ) {
                        return {
                            label: key,
                            value: item.id_town+"#"+item.id_province
                        }
                    }));
                },
                error: function (result) {
                    alert("Due to unexpected errors we were unable to load data");
                }
            });
        },
        minLength: 2
    });

with results like:

enter image description here

What could be the problem??


Solution

  • Check your CSS, maybe you are hiding the menu element. Try with:

    .ui-autocomplete {
      z-index: 10000000;
    }