cómo evitar el evento de selección predeterminado en autocompletar jquery

Question

Se activa cuando se selecciona un elemento del menú; ui.item se refiere al elemento seleccionado. La acción predeterminada de select es reemplazar el valor del campo de texto con el valor del elemento seleccionado. La cancelación de este evento evita que el valor se actualice, pero no impide que se cierre el menú.

$("#txt1").autocomplete({ 
    minLength: 1, 
    source: "abc.php", 
    select: function(event, ui) 
    { 
     event.preventDefault(); 
     //alert("Select"); 
     var label= ui.item.label; 
     var value= ui.item.value; 
     $('#txt1').val(ui.item.label); 
    } 
}); 

Answer 1

utilizando este parámetro selectFirst: falsa

Answer 2

Sé que esto es una pregunta muy antigua, pero me encontré con el problema mismo. La respuesta para mí es poner event.preventDefault(); al final del método de selección de la siguiente manera:

$("#txt1").autocomplete({ 
    minLength: 1, 
    source: "abc.php", 
    select: function(event, ui) 
    { 
     //alert("Select"); 
     var label= ui.item.label; 
     var value= ui.item.value; 
     $('#txt1').val(ui.item.label); 
     event.preventDefault(); // <---- I moved! 
    } 
}); 

Para mí, si event.preventDefault(); se pone en el inicio de la función, entonces el evento predeterminado no se dispara y el resto de la función no se ejecuta. Si se mueve hasta el final, funciona como se esperaba. Espero que esto ayude a alguien más.

Answer 3

Así que esto es un poco un truco que funcionó para mí: en mi caso seleccionando una entrada en el menú desplegable (ya sea con el mouse o usando las teclas de flecha para resaltar y presionar ENTER), estaba usando value para construir un URL y luego enviar el navegador a él, pero todavía se copió en el cuadro de búsqueda. Ninguna de las respuestas que probé funcionó para evitar eso. Así que para detener value que se muestra en el cuadro de búsqueda, hice la value lo mismo que label en mi JSON y añadí un campo adicional code que mi select controlador de eventos utiliza para construir la URL que necesito:

$("#autocomplete").autocomplete({ 
    source: "http://www.example.com/search", 
    minlength: 2, 
    select: function(event, ui) { 
    // go to page on ENTER 
    window.location.href = "/page/" + ui.item.code; 
    } 
});