Question

I have this code working, from this example:

var url = function(req, res){
    $.ajax({
        url: "getdata",
        dataType: "json",
        data: {
            term: req.term,
        },
        success: function(data){
            res($.map(data.students, function(item){
            return{
                label: item.cardId + "|" + item.firstName + " " + item.lastName,
                value: item.cardId
            }}))
        }
    });
};


$("#autocomplete").autocomplete({
    source: url
});
$("#autocomplete2").autocomplete({
    source: url
});

And input elements:

<input path="students" id="autocomplete" style="z-index: 100; position: relative" title="type &quot;a&quot;" autofocus="autofocus" />
<input path="items" id="autocomplete2" style="z-index: 100; position: relative" title="type &quot;a&quot;" />

Both inputs have now the same dropdown list.

Question:
How to change url function to fit students and items? Or should just copy function for each type of input?

Answer 1

Inside your url function, this.element will give you the element which fired autocomplete. You can use this.element.attr("id") or some other method to modify the JSONP url.

Demo here and code here