Question

I want to use the jquery ui autocomplete plugin with 2 controls, so I have this:

    $("#From, #To").autocomplete({
        source: function (request, response) {
            $.ajax({
                url: "http://example.com/search/" + $(this).val(),
                dataType: "jsonp",
                data: {
                    featureClass: "P"
                },
                success: function (data) {
                    response($.map(data.autocomplete, function (item) {
                        return {
                            label: item.name + " (" + item.id + ")",
                            value: item.id
                        }
                    }));
                }
            });
        }
    });

The problem is that the url param where I use $(this).val() to get the text in the current textbox doesn’t work, how can I do this in a way that I won’t need to duplicate the autocomplete code for each control?

thanks!

Answer 1

You can use this.term to get the search term that is to be used. You might also want to wrap this in encodeURIComponent() i.e.

url: "http://example.com/search/" + encodeURIComponent(this.term),
... // etc.