Jquery ui autocomplete: counting results

Question

I would like to know if there is a way to count the number of results that appear when you type something in the text box. Count the work of lithium cells, but I put them in a more reasonable way. Thanks

Answer 1

I think this is not possible directly with JQueryUI events. I am looking for a way without success.

All related events are associated only with the returned item (after the list is displayed) or event information (not about the list).

You can see it here: http://jqueryui.com/demos/autocomplete/#event-focus

What you said is the most accurate solution:

$( "#tags" ).autocomplete({ source: availableTags, open: function(event,ui){ var len = $('.ui-autocomplete > li').length; $('#count').html('Founded '+len+' results'); } }); 

Answer 2

The solution above does not work for me when I print something that does not return any results. It shows the number of results from the last line of matching. Here is a solution that really worked.

 source: function (request, response) { $.getJSON( "/Ajax/GetSomeJson.ashx", { q: request.term }, function (data) { console.log(data.length); $('#count').html('Found '+ data.length +' results'); response($.map(data, function (item) { return item; })); } ); } 

Answer 3

I found a way to count the matches found based on Frank's answer, but I think it is not 100% reliable. However, this works for me.

 $('#autocompleteinput').autocomplete({ source: datasource, search: function() { $(this).data('count',0); }, open: function() { $(this).data('count',$('.ui-autocomplete > li').length); }, delay: 0 }).keyup(function(){ $('#count').html('Found '+$(this).data('count')+' items'); }); 

The delay should be 0, or often it will launch the keyboard before searching, and it will not count well.

Answer 4

This works for me. My requirement is to automatically highlight the blur event if there is only one corresponding result. I used to try var len= $('.ui-autocomplete > li').length; but I did not work in all scenarios. Sometimes it adds previous results to count / length.

Below code worked for me:

 .on('autocompletechange', function() { if ($(this).data('ui-autocomplete').selectedItem === null && ($(this).autocomplete("widget").find( "li" ).length == 1) ) { //this will trigger your select automatically so it will handle other custom override you did for select $(this).data('ui-autocomplete').menu.element.children('li:first').children('a').trigger('click'); } })