Jquery UI autocompletar; minLength: 0 número

Question

Estoy usando una UQ de JQuery autocompletada. Estoy especificando la longitud mínima. Si especifico minLength:2, necesito escribir 2 caracteres antes de que el servicio se dispare. Si especifico minLength:1, entonces solo necesito ingresar un carácter antes de que se active el servicio de origen.

Sin embargo, cuando especifico minLength:0, todavía necesito escribir un caracter. Entonces, cuál es el punto de 0? ¿Cómo es diferente de 1? El comportamiento esperado y deseado sería disparar tan pronto como la entrada tenga enfoque ...?

Ideas?

Actualización: Para la solución de la mayor parte de Karim a continuación las obras, sin embargo, al hacer clic en la entrada de las opciones vienen y cuando uno se hace clic en la fuente se vuelve a enviar el cadena vacía en lugar de la nueva opción que era solo se ha seleccionado, por lo que las opciones de autocompletar que aparecen después de seleccionar una opción son más que igual que si la casilla hubiera estado vacía.

Answer 1

Mira la documentación search método:

activa un evento de búsqueda, que, cuando de datos está disponible, entonces se mostrará las sugerencias; puede ser utilizado por un botón de tipo de cuadro de selección para abrir las sugerencias al hacer clic. Si no se especifica ningún argumento de valor , se utiliza el valor actual de la entrada . Puede llamarse con una cadena vacía y minLength: 0 para mostrar todos los elementos.

var source = ['One', 'Two', 'Three', 'Four']; 
 

 
var firstVal = source[0]; 
 

 
$("input#autocomplete").autocomplete({ 
 
    minLength: 0, 
 
    source: source, 
 
}).focus(function() { 
 
    $(this).autocomplete("search", $(this).val()); 
 
});

.ui-menu-item{ 
 
    background : rgb(215, 215, 215);; 
 
    border : 1px solid white; 
 
    list-style-type: none; 
 
    cursor : pointer; 
 
} 
 

 
.ui-menu-item:hover{ 
 
    background : rgb(200, 200, 200); 
 
} 
 

 

 
.ui-autocomplete{ 
 
    padding-left:0; 
 
    margin-top : 5px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.js"></script> 
 
<input id="autocomplete"/>&nbsp;<input id="submit" type="submit"/>

Answer 2

el menú sugerencia aparece por segunda vez porque al hacer clic en un elemento de menú sugerencia provoca cuadro de texto para recuperar el foco, sin embargo, el valor de texto no se actualiza cuando el foco se dispara nuevamente. Después de que el cuadro de texto recupera el foco, se activa el menú de sugerencias.

no sé cómo podríamos solucionar este problema, pero hazme saber si alguno de ustedes se enfrentan a la problema similar

Answer 3

que tenía el mismo problema y lo resolvió de esta manera. Creo que el código a continuación deja mucho más claro cuál es el texto que se envía al servicio de autocompletado cuando el campo obtiene el foco. En particular, está claro por qué funciona cuando el campo ya contiene algo.

$(function() { 
$("input#autocomplete").autocomplete({ 
     source: "completion.html", 
     minLength: 0, 
     select: function(event, ui) {} 
    }); 
}); 
$("input#autocomplete").focus(function() { 
    $(this).autocomplete("search", $(this).val()); 
}); 

Answer 4

¡Esto realmente funciona! Probado en IE, Firefox

$("input#autocomplete").autocomplete({ 
minLength: 0, 
source: source, 
}).focus(function() { 
     setTimeout("if ($('#input#autocomplete').val().length == 0) $('#input#autocomplete').autocomplete(\"search\", \"\"); ",1); 
    }); 

Answer 5

entiendo por qué a través del experimento la respuesta aceptada (I arriba-voté) se puede considerar poco incompleta. He añadido un poco de la intención de hacer que el combo-UX más similar a una caja:

$('#Carrier').autocomplete(
{ 
    source: '@Url.Action("AutocompleteCarrier", "Client")', 
    minLength: 0, 
    select: function (event, data) { 
     $(this).autocomplete('disable'); 
    } 
}) 
.blur(function(){ 
    $(this).autocomplete('enable'); 
}) 
.focus(function() { 
    $(this).autocomplete('search', ''); 
}); 

Answer 6

que tenían el mismo problema y me dieron la forma de solucionar este problema.

El problema es que cuando una opción se ha seleccionado la entrada se centrará, esto ejecutará search sin ningún tipo de filtro y mostrará el autocomplete nuevo.

Este problema no ocurre cuando selecciona por teclado porque el input ya está enfocado, por lo que el código que está dentro de focus no se ejecutará nuevamente.

Por lo tanto, para solucionar este problema debemos saber cuándo se desencadena el enfoque por cualquier evento de mouse/keyboar.

jQuery("input#autocomplete").focus(function(e) { 
    if(!e.isTrigger) { 
     jQuery(this).autocomplete("search", ""); 
    } 
    e.stopPropagation(); 
}); 

e.isTrigger es utilizado por jQuery de identificar cuando event se ha disparado de forma automática o por el usuario.

working demo