jQuery Autocomplete using extraParams to pass additional GET variables

Question

I am referring specifically to the jQuery Autocomplete v1.1 plugin by Jörn Zaefferer [source: http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/] as there seems to be quite a few variations of this plugin.

I'm trying to pass additional parameters to the server when the user starts typing because I have multiple fields that I want autocomplete to provide suggestions for.

In addition to the query, I want to send the input name attribute to the server but I can't seem to use $(this).attr('name') within the extraParams.

My jQuery:

   $('.ajax-auto input').autocomplete('search.php', {      extraParams: {       search_type: function(){        return $(this).attr('name');       }      }    }) 

This is my HTML.

 <form method="post" action="#" id="update-form" autocomplete="off">   <ol>          <li class="ajax-auto">              <label for="form-initials">Initials</label>                 <input type="text" id="form-initials" name="initials" />             </li>          <li class="ajax-auto">              <label for="form-company">Company</label>                 <input type="text" id="form-company" name="company" />             </li>   </ol>  </form> 

Any suggestions?

Answer 1

I am using the autocomplete function that is now part of jquery ui. Passing an 'extraParams' field does not work but you can just append the values in the request query string.

$(document).ready(function() {     src = 'http://domain.com/index.php';      // Load the cities straight from the server, passing the country as an extra param     $("#city_id").autocomplete({         source: function(request, response) {             $.ajax({                 url: src,                 dataType: "json",                 data: {                     term : request.term,                     country_id : $("#country_id").val()                 },                 success: function(data) {                     response(data);                 }             });         },         min_length: 3,         delay: 300     }); }); 

Answer 2

Try this:

$('.ajax-auto input').setOptions({   extraParams: {     search_type: function(){       return $(this).attr('name');     }   } }) 

See also here