Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can the default "Term" name passed in the "jquery UI autocomplete" feature be changed?

I am trying to change the "term" field that is set to that by default with the jquery ui autocomplete feature. Is it possibly to easily change it to "q" (query) without going and changing it in the "core" file?

JavaScript:

<script>
    $(function() {
        $( "#spotify_song_search" ).autocomplete({
            source: "http://ws.spotify.com/search/1/track.json",
            data: { 
                q: request.term 
            },
            dataType: "getjson",
            minLength: 3,
            select: function( event, ui ) { 
                alert('select'); 
            }
        });
    });
</script> 
like image 704
John Doe Avatar asked May 29 '12 01:05

John Doe


People also ask

What is the default value of appendTo option of autocomplete () method?

Option - appendTo By default its value is null. When the value is null, the parents of the input field will be checked for a class of ui-front.

How to call Autocomplete in jQuery?

var textbox = $('input#mainSearchBox'); var autocompleteBox = textbox. autocomplete('widget'); // toggle the autocomplete widget autocompleteBox.is(':hidden') ? textbox.

How can create autocomplete search box in jQuery?

Syntax: $("TagId"). autocomplete({ source : itemList // List of Words. })


1 Answers

Yes, it's possible by making your own AJAX request.

Assume you have the following setup:

$("#myfield").autocomplete({
    source: '/my_url/myservice.xyz'
});

Autocomplete by default (as you noticed) sends requests that look like:

myservice.xyz?term=abc"

You can supply a function reference to the source option of autocomplete. Inside that function you can make your own AJAX request, which would look like this:

$("#myfield").autocomplete({
     source: function (request, response) {
         // request.term is the term searched for.
         // response is the callback function you must call to update the autocomplete's 
         // suggestion list.
         $.ajax({
             url: "/my_url/myservice.xyz",
             data: { q: request.term },
             dataType: "json",
             success: response,
             error: function () {
                 response([]);
             }
         });
     });
});

This should generate a request looking more like:

myservice.xyz?q=abc

like image 80
Andrew Whitaker Avatar answered Oct 15 '22 06:10

Andrew Whitaker