删除自动完成错误的微调器/加载图像

Question

如果自动完成出现错误/失败情况，您能否帮助我了解如何删除旋转器/加载图像？

如果我收到错误“由于意外错误，我们无法加载数据”，我会看到正在加载的图像，并且我想删除该图像。

下面是片段

  $("Autotxt").autocomplete({
    source: function (request, response) {
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "Webservice.asmx/GetNames",
            data: "{'prefixText':'" + request.term + "'}",
            dataType: "json",  
            success: function (data) {
                response($.map(data.d, function (item) {

                    return {
                        label: item.split('|')[0],
                        val: item.split('|')[1]
                    }
                }))
            },

            error: function (result) {

                alert("Due to unexpected errors we were unable to load data");
                ServiceFailed(result);
            },
            failure: function (response) {
                alert("Due to unexpected errors we were unable to load data");

            }
        });
    },
    select: function (event, ui) {
        txtSoID(ui.item.val);
    },
    minLength: 4
});


function txtID(val)
{
alert(val)
}

Answer 1

如果您指的是通过 ui 提供的加载类，您应该能够执行以下操作：

 error: function (result) {
     $('.ui-autocomplete-loading').removeClass("ui-autocomplete-loading");
     // or .hide()
     alert("Due to unexpected errors we were unable to load data");
     ServiceFailed(result);
 },

我在 jqueryUI 开发站点位于页面底部，他们在那里讨论 css 和主题。

Answer 2

我在您的代码中没有看到任何加载屏幕。但是您可以简单地添加该函数

var removeSpinner = function() {
    $("yourloader").hide();
}

并在失败或错误回调中调用它，例如

   error: function (result) {
        removeSpinner();
        alert("Due to unexpected errors we were unable to load data");
        ServiceFailed(result);
    }

Answer 3

对这些图像执行检查元素，检查它们的类（例如“loader”），然后将其放入错误和失败回调 $(".loader").hide() 中。

Answer 4

改编自我在这里的答案，添加以下代码以在搜索完成后执行（即使有 0 个结果）：

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

该代码将触发一个事件 (autocompletesearchcomplete)，然后您可以绑定到：

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

希望这有帮助...