jQuery AutoComplete Seleccione disparar después del cambio?

Estoy usando el jQuery UI AutoComplete control (recién actualizado a jQuery UI 1.8.1). Cada vez que el usuario abandona el cuadro de texto, quiero establecer el contenido del cuadro de texto en un valor conocido y establecer un campo ID oculto para el valor que se seleccionó. Además, quiero que la página vuelva a publicar cuando se modifique el contenido del cuadro de texto.jQuery AutoComplete Seleccione disparar después del cambio?

Actualmente, estoy implementando esto haciendo que el evento de selección autocompletar establezca la identificación oculta y luego un evento de cambio en el cuadro de texto que establece el valor de la caja de texto y, si es necesario, provoca una publicación.

Si el usuario solo usa el teclado, esto funciona perfectamente. Puede escribir, use las flechas arriba y abajo para seleccionar un valor y luego tab para salir. El evento de selección se activa, la identificación se establece y luego el evento de cambio se activa y la página publica de nuevo.

Si el usuario comienza a escribir y luego usa el mouse para elegir las opciones de autocompletar, el evento de cambio se dispara (mientras el foco cambia al menú de autocompletar?) Y la página publica antes de que el evento seleccionado tenga la oportunidad de establecer La identificación.

¿Hay alguna manera de que el evento de cambio no se active hasta después del evento seleccionado, incluso cuando se usa un mouse?

$(function() { 
    var txtAutoComp_cache = {}; 
    var txtAutoComp_current = { label: $('#txtAutoComp').val(), id: $('#hiddenAutoComp_ID').val() }; 
    $('#txtAutoComp').change(function() { 
     if (this.value == '') { txtAutoComp_current = null; } 
     if (txtAutoComp_current) { 
      this.value = txtAutoComp_current.label ? txtAutoComp_current.label : txtAutoComp_current; 
      $('#hiddenAutoComp_ID').val(txtAutoComp_current.id ? txtAutoComp_current.id : txtAutoComp_current); 
     } else { 
      this.value = ''; 
      $('#hiddenAutoComp_ID').val(''); 
     } 
     // Postback goes here 
    }); 
    $('#txtAutoComp').autocomplete({ 
     source: function(request, response) { 
      var jsonReq = '{ "prefixText": "' + request.term.replace('\\', '\\\\').replace('"', '\\"') + '", "count": 0 }'; 
      if (txtAutoComp_cache.req == jsonReq && txtAutoComp_cache.content) { 
       response(txtAutoComp_cache.content); 
       return; 
      } 
      $.ajax({ 
       url: 'ajaxLookup.asmx/CatLookup', 
       contentType: 'application/json; charset=utf-8', 
       dataType: 'json', 
       data: jsonReq, 
       type: 'POST', 
       success: function(data) { 
        txtAutoComp_cache.req = jsonReq; 
        txtAutoComp_cache.content = data.d; 
        response(data.d); 
        if (data.d && data.d[0]) { txtAutoComp_current = data.d[0]; } 
       } 
      }); 
     }, 
     select: function(event, ui) { 
      if (ui.item) { txtAutoComp_current = ui.item; } 
      $('#hiddenAutoComp_ID').val(ui.item ? ui.item.id : ''); 
     } 
    }); 
});

Fuente

2010-05-19 Zarigani

no saber cómo prevenir el evento de cambio de disparar, pero aquí se puede arrojar algo de condicionales en el evento de cambio que hace que el campo oculto se ha establecido y que el cuadro de texto actualmente tiene un valor .

Fuente

2010-05-19 23:24:17

El cuadro de texto y los valores ocultos de ID se conservan en las publicaciones anteriores, por lo que no veo una forma fácil de determinar que he detectado el cambio actual en lugar de ver cambios pasados que ya se han manejado. Supongo que el problema es que salir del cuadro de texto sin seleccionar un elemento es válido y debe manejarse por separado de salir del cuadro de texto mientras selecciono un elemento y no puedo encontrar la forma de determinar qué ocurre si la selección se activa después del cambio. – Zarigani

Puede resolver esto implementando su evento de cambio como una opción de autocompletar, al igual que select, en lugar de usar la función de cambio de jQuery().

Puede ver la lista de eventos en the autocomplete demo & documentation page. Establece que el evento de cambio siempre se activa después del evento de cierre, que supongo que se dispara después del evento de selección. Eche un vistazo a la fuente de 'combobox' para ver un ejemplo de evento de cambio de enlace.

Fuente

2011-01-18 05:22:29 ndbroadbent

Esta es la mejor respuesta, para implementar este cambio de estrategia es necesario. –

que trabajó para mí en el ratón seleccione cuando hice esto:

focus: function (event, ui) { 
         $j(".tb").val(ui.item.value); 
         return true; 
        }

Esto hace que el cuadro de texto para cambiar el texto en eventos de foco del ratón, al igual que la forma en que sucede en los eventos del teclado. Y cuando seleccionamos un elemento, se activa la selección cambiada.

Fuente

2011-07-26 14:50:33 Poornima

excepto que no usa el evento de enfoque automático completo, está usando el evento de cambio jquery. –

jQuery AutoComplete Seleccione disparar después del cambio?

Respuesta

Cuestiones relacionadas