开发者

remove spinner from jquery ui autocomplete if nothing found

开发者 https://www.devze.com 2023-01-27 10:07 出处:网络
I want to remove the spinner (picture which shows that it is loading) from the textfield which supports jquery ui autocomplete.

I want to remove the spinner (picture which shows that it is loading) from the textfield which supports jquery ui autocomplete. As there is no event 开发者_运维知识库for "no results returned by source" a can not trigger this.

$( "#q" ).autocomplete({
   source: "${createLink(mapping:'qsearch')}",
   minLength: 2,
   select: function( event, ui ) {
      foo( ui.item.id );
   },
   search: function( event, ui ) {
      bla();
   }
});


If you're stuck on an older version of jQuery ui, the right answer is to use the class ui-autocomplete-loading, which gets added and removed while the request/response is in flight.


Adapted from my answer here, add the following code to execute after a search is complete (even with 0 results):

var __response = $.ui.autocomplete.prototype._response;
$.ui.autocomplete.prototype._response = function(content) {
    __response.apply(this, [content]);
    this.element.trigger("autocompletesearchcomplete", [content]);
};

That code will trigger an event (autocompletesearchcomplete) that you can then bind to:

$("#q").bind("autocompletesearchcomplete", function(event, contents) {
    /* Remove spinner here */
});

Hope that helps.


You can edit the CSS and remove the spinner.

$("object_that_has_the_spinner").removeClass( "ui-autocomplete-loading" );


As of jQuery UI v1.9 you can do something like the following:

$( "#q" ).autocomplete({
  source: "${createLink(mapping:'qsearch')}",
  select: function( event, ui ) {
    foo( ui.item.id );
  },
  search: function( event, ui ) {
    $( "#spinner" ).show();
  },
  response: function( event, ui ) {
    $( "#spinner" ).hide();
  }
});


This is a known open enhancement for future versions of jQuery UI...

http://bugs.jqueryui.com/ticket/6777

Will have to wait and/or use a workaround (like sending a special response from the server and handle this case in the open event).

0

精彩评论

暂无评论...
验证码 换一张
取 消