Limitar los resultados en jQuery UI Autocomplete

Estoy usando el autocompletado de jQuery UI.

$("#task").autocomplete({ max:10, minLength:3, source: myarray }); 

El parámetro máximo no funciona y todavía obtengo más de 10 resultados. ¿Me estoy perdiendo de algo?

Aquí está la documentación adecuada para el widget jQueryUI . No hay un parámetro incorporado para limitar los resultados máximos, pero puede lograrlo fácilmente:

 $("#auto").autocomplete({ source: function(request, response) { var results = $.ui.autocomplete.filter(myarray, request.term); response(results.slice(0, 10)); } }); 

Puede suministrar una función al parámetro source y luego llamar a slice en la matriz filtrada.

Aquí hay un ejemplo de trabajo: http://jsfiddle.net/andrewwhitaker/vqwBP/

Puede establecer la opción minlength a algún valor grande o puede hacerlo por css como este,

 .ui-autocomplete { height: 200px; overflow-y: scroll; overflow-x: hidden;} 

Lo mismo que “Jayantha” dijo que usar css sería el enfoque más fácil, pero podría ser mejor,

 .ui-autocomplete { max-height: 200px; overflow-y: scroll; overflow-x: hidden;} 

Tenga en cuenta que la única diferencia es “altura máxima”. esto permitirá que el widget cambie su tamaño a una altura menor, pero no más de 200 px

Añadiendo a la respuesta de Andrew , incluso puede introducir una propiedad maxResults y usarla de esta manera:

 $("#auto").autocomplete({ maxResults: 10, source: function(request, response) { var results = $.ui.autocomplete.filter(src, request.term); response(results.slice(0, this.options.maxResults)); } }); 

jsFiddle: http://jsfiddle.net/vqwBP/877/

¡Esto debería ayudar a la legibilidad y mantenimiento del código!

aquí es lo que usé

 .ui-autocomplete { max-height: 200px; overflow-y: auto; overflow-x: hidden;} 

El desbordamiento automático por lo que la barra de desplazamiento no se mostrará cuando no se supone que lo haga.

Si los resultados provienen de una consulta de mysql, es más eficiente limitar directamente el resultado de mysql:

 select [...] from [...] order by [...] limit 0,10 

donde 10 es el número máximo de filas que desea

Complemento: jquery-ui-autocomplete-scroll con scroller y los resultados límite son hermosos

 $('#task').autocomplete({ maxShowItems: 5, source: myarray }); 

Podría resolver este problema agregando el siguiente contenido a mi archivo CSS:

 .ui-autocomplete { max-height: 200px; overflow-y: auto; overflow-x: hidden; } 

Lo hice de la siguiente manera:

 success: function (result) { response($.map(result.d.slice(0,10), function (item) { return { // Mapping to Required columns (Employee Name and Employee No) label: item.EmployeeName, value: item.EmployeeNo } } )); 

jQuery le permite cambiar la configuración predeterminada cuando está adjuntando autocompletar a una entrada:

 $('#autocomplete-form').autocomplete({ maxHeight: 200, //you could easily change this maxHeight value lookup: array, //the array that has all of the autocomplete items onSelect: function(clicked_item){ //whatever that has to be done when clicked on the item } }); 

No hay un parámetro max.

http://docs.jquery.com/UI/Autocomplete

He intentado todas las soluciones anteriores, pero el mío solo funcionó de esta manera:

 success: function (data) { response($.map(data.slice (0,10), function(item) { return { value: item.nome }; })); }, 

En mi caso, esto funciona bien:

 source:function(request, response){ var numSumResult = 0; response( $.map(tblData, function(rowData) { if (numSumResult < 10) { numSumResult ++; return { label: rowData.label, value: rowData.value, } } }) ); },