Menu
I have several input fields that are enhanced with jQuery auto-complete functionality. How to get the corresponding input field when a select event is triggered?
<input name="1" value=""> <input name="2" value=""> <input name="3" value=""> $('input[type=text]').autocomplete({ source: 'suggestions.php', select: function(event, ui) { // here I need the input element that have triggered the event } }); 
647
In the process of searching a specific value, the jQuery UI autocomplete selection feature provides the user with some string suggestions for the input area which effectively saves time. The autocomplete select action is triggered when the user selects one of the options from the pre-populated list.
By default its value is null. This option is used append an element to the menu. 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.
Syntax: $("TagId"). autocomplete({ source : itemList // List of Words. })
Autocomplete mechanism is frequently used in modern websites to provide the users a list of suggestion while typing the beginning word in the text box. It facilitates the user to select an item from the list, which will be displayed in the input field.
I was using an anonymous function for the source param, and $(this) inside it referenced the funcion, not the element that was triggering it. I had to use $(this.element).
The final code ended similar to this (I simplified it for demo purposes):
$( ".regionsAutocomplete" ).autocomplete({ source: function(request, response){ //The next line is the important one for this example var input = this.element; $(input).css('color','red'); var data = {'foo':'bar'}; $.ajax({ 'url': ajaxurl, 'data': data, 'method': "POST", 'dataType': "json", 'success': function(data) { response(data); } }); } }); If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
