Question

I am working on this test page: http://problemio.com/test.php

What I am trying to do is: when the person types, I want to go to the database and search available options for them. The part with fetching the items is working.

What isn’t working is displaying the items. I played around with jQuery autocomplete here: http://docs.jquery.com/UI/Autocomplete but it just gives this:

$("input#autocomplete").autocomplete({
    source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"]
});

And I am not sure how to populate that list after my ajax call returns the available options. Any ideas on what is the right way to go here?

Answer 1

You can pass the path to your server-side script to the source property. It should return a json object

// from http://jqueryui.com/demos/autocomplete/#remote
$( "#birds" ).autocomplete({
    source: "search.php",
    minLength: 2,
    select: function( event, ui ) {
        log( ui.item ?
            "Selected: " + ui.item.value + " aka " + ui.item.id :
                "Nothing selected, input was " + this.value );
    }
});