bootstrap - jquery ui autocomplete ajax

¿Cómo obtener el elemento de entrada que activa el widget de autocompletado jQuery?

Question

Tengo varios campos de entrada mejorados con la funcionalidad de autocompletado de jQuery. ¿Cómo obtener el campo de entrada correspondiente cuando se activa un evento de selección?

<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
    }
});

Answer 1

Estaba usando una función anónima para el parámetro source , y $(this) dentro de ella hacía referencia a la función, no al elemento que la estaba activando. Tuve que usar $(this.element) .

El código final terminó de manera similar a esto (lo simplifiqué para propósitos de demostración) :

$( ".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);
            }
        });
    }
});

Answer 2

Intenta usar $(this)

$(''input[type=text]'').autocomplete({
    source: ''suggestions.php'',
    select: function(event, ui) {
        // here I need the input element that have triggered the event
        alert($(this).attr(''name''));
    }
});

Answer 3

Por lo que puedo decir de este ejemplo, no necesitarías el $() . this funcionaría bien ya que nombre es un atributo definido.

this.name

Answer 4

Puedes usar $(this) o event.target .

Luego puede obtener el nombre usando $(this).prop(''name'') o event.target.name .

demo

Answer 5

Usa $(this)

 select: function(event, ui) {
        $(this).attr(''name'');
    }