使用JQuery自动完成时如何在没有匹配时显示错误?

时间:2012-09-05 11:09:04

标签: jquery autocomplete

JQuery有一个很酷的autocomplete function。我想要的是,如果自动完成中没有匹配的条目(例如zadasdasda中的用户类型)将此标记给用户,因为用户只能在此特定字段中输入与数据库中的一组值中的值匹配的内容。在某种程度上说只使用选项列表之前,有太多可能的条目(> 1,000)。我只想检查在JQuery中没有什么东西可以在我写回调之前自己做。我找不到任何想要仔细检查的东西。

由于

2 个答案:

答案 0 :(得分:3)

也许这会有所帮助。如果我理解你的需要,这是一种方法。

在我的情况下,自动完成通过Ajax从服务器获取数据。

$("#myselect").autocomplete({
  source: function(request, response) {
    $.ajax({
      url: searchUrl,
      dataType: "json",
      data: request,                    
      success: function (data) {
        // No matching result
        if (data.length == 0) {
          alert('No entries found!');
          $("#myselect").autocomplete("close");
        }
        else {
          response(data);
        }
      }});
    },
  dataType: "json",
  autoFill: false,      
  scroll: false,
  minLength: 2,
  cache: false,
  width: 100,
  delay: 500,           
  select: function(event, ui) { 
    //eventuallydosomething(ui.item.value);
    $("#myselect").autocomplete("close");
  } 
});

您感兴趣的部分是从服务器返回数据时:

  success: function (data) {
      // If we get no matching result
      if (data.length == 0) {
        alert('No entries found!');
        $("#myselect").autocomplete("close");
      }

答案 1 :(得分:0)

您可以将autocomplete._response函数替换为您自己的函数,然后调用默认的jQueryUI函数

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

然后将事件处理程序绑定到autocompletesearchcomplete事件(内容是搜索的结果,数组):

$("input").bind("autocompletesearchcomplete", function(event, contents) {
    if(contents.length<1){
     $("#results").html("No Entries Found");
    }
   else{
      $("#results").html("");
   }
});

DEMO

Source示例