Question

我已经窃取/找到/使用/编写并编辑了以下jQuery小部件，以便自动完成下拉列表。

(function($) {
    $.widget("ui.comboboxGemeenten", {
        _create: function() {
            var focushelper = false;
            var lastTerm;
            var self = this;
            var select = this.element.hide();
            var input = $("<input>")
                    .insertAfter(select)
                    .width(300)
                    .autocomplete({
                        source: function(request, response) {

                            var jsonbox = { gem_query: request.term };
                            lastTerm = request.term;

                            $.post("/" + $.trim(window.location.pathname.substr(1, 9)) + "/Gemeenten/FilterInstGem/", jsonbox, function donedit(data) {
                                //alert("iets");
                                if (data.succes == true && data.lastTerm == lastTerm) {
                                //alert(textlength);
                                    //alert(data.lesplaatsen);
                                    response($.map(data.gemeenten, function(item) {

                                        return {
                                            id: item,
                                            //   label: (item.Lpl_Gemeente == null ? "" : item.Lpl_Gemeente) + " - " + item.Lpl_Instelling,
                                            value: item
                                        }
                                    }));
                                } else {
                                    // alert("slecht");
                                }
                            }, "json");
                        },
                        delay: 0,
                        change: function(event, ui) {
                            if (!ui.item) {
                                // remove invalid value, as it didn't match anything
                                $(this).val("");
                                return false;
                            }
                            //alert(ui.item.id);
                            select.val(ui.item.id);
                            self._trigger("selected", event, {
                                item: select.find("[value='" + ui.item.id + "']")
                            });
                        },
                        focus: function() {
                            focushelper = true;
                        },
                        minLength: 2
                    })
                    .addClass("ui-widget ui-widget-content ui-corner-left")
                    .focus(function() {             //if it is default value, remove it.
                        if (select.val() == "" && !focushelper) {
                            //alert(select.val());
                            $(input).val("");
                        }
                    })
                    .val(select.find("option:selected").text()); //return selected value for editing

        }
    });

})(jQuery);

问题是我返回了一长串项目，当我在输入字段内写入要过滤时，比如

“gen”它会为“ge”和“gen”发布“g”的帖子，因为它会在每次更改时发布。问题是列表的最后一次返回并不总是用于“gen”，但有时候用于“ge”，所以我的结果不正确。

使用delay并未改变任何内容。

使用minlength并不重要，一旦超过minlength问题再次发生。

所以我做了什么？我使用var lastTerm检查接收我的列表，如果这个结果是针对最后一个写的，而不是中间的那个。

这确实解决了我的问题，但这不是最好的事情。

有没有办法暂停帖子，所以我不会浪费大量的服务器资源，因为最后一个学期的结果无论如何都会被丢弃。

MVC部分：

    [HttpPost]
    public ActionResult FilterInstGem(string gem_query) {
        List<string> lpls = _db.InstellingAdressens.Where(l => l.GEMEENTE.Contains(gem_query)).Select(q => q.GEMEENTE).Distinct().OrderBy(q => q).ToList();
        return Json(new { succes = true, lastTerm = gem_query, gemeenten = lpls });
    }

总的看起来像是：http://jqueryui.com/demos/autocomplete/#combobox

Answer 1

由于$.post()返回XmlHttpRequest，您可以保存对它的引用并将其中止，如下所示：

if(this.xhr) this.xhr.abort();
this.xhr = $.post("/" + $.trim(window.location.pathname.substr(1, 9)) + "/Gemeenten/FilterInstGem/", jsonbox, function donedit(data) {
  this.xhr = null;
  //rest of your current post success code....
});

将这些放在您目前只有

的位置

$.post("/" + $.trim(window.location.pathname.substr(1, 9)) + "/Gemeenten/FilterInstGem/", jsonbox, function donedit(data) {

您正在存储对请求的引用...如果请求成功进入（在另一个请求被触发之前），它将中止最后一个请求，如果它不中断并完成，它' ll执行您已经拥有的success回调，设置this.xhr = null;，以便我们知道下次没有任何内容可以中止。

停止$ .post

1 个答案: