Question

I have this type of json input.
[ { “id1” : “val1”, “id2” : “val2” }, { “id1” : “val3”, “id2” : “val4” }, …]

How do I parse this inside autocomplete plugin available in jquery-ui? Basically I want the val1, val3, etc. corresponding to id1 to be the part of my autocomplete text. Any suggestions on how can I proceed with this?

Answer 1

The autocomplete widget expects an array of simple string values or objects with properties label, value or both.

You can take your data and transform it into the proper format using the $.map utility function. This assumes you are making your AJAX request successfully and data is coming back:

$.getJSON("/url", function(data) {
    var src = $.map(function (el) {
        return el.id1;
        // or:
        // return { label: el.id1, value el.id2 };
    });

    $("#id").autocomplete({ 
        source: src
    });
});

Example: http://jsfiddle.net/df6wB/