如何实现的jQuery UI自动完成在过滤结果我自己的规则

Question

这是我的代码：

var projects = [{label:"PH2938", value: "1", fk: "3", desc: "hello"}, 
        {label:"JUH28", value: "2", fk: "0", desc: "world"},]; 
        {label:"HK383", value: "3", fk: "3", desc: "!"},]; 
    $("#serial_no").autocomplete({ 
     minLength: 0, 
     source: function(request, response) { 
       var results = $.ui.autocomplete.filter(projects, request.term); 
       response(results); 
      }, 
     focus: function(event, ui) { 
      $("#serial_no").val(ui.item.label); 
       return false; 
      }, 
     select: function(event, ui) { 
      $("#serial_no").val(ui.item.label); 
      $("#device_id").val(ui.item.value); 
      $("#device_model").text(ui.item.desc); 
      return false; 
     } 
    }) 
    .data("ui-autocomplete")._renderItem = function(ul, item) { 
     return $("<li>") 
     .append("<a>" + item.label + "</a>") 
     .appendTo(ul); 
    }; 

所以现在，例如，如果我在字段中键入“H”，所有3个结果（即PH2938 ，JUH28，HK383）将会显示。我的问题是：有可能使它只显示fk = 3的结果（即PH2938，HK383）。也就是说，我可以实施自己的规则来显示哪些结果。

Answer 1

如果我理解正确，您需要按照某些标准过滤0​​。在这种情况下，fk等于'3'。

由于您已经在使用jQuery，因此$.grep是过滤任务的理想选择。

$.grep(projects, function (project) { 
    return project.fk === '3'; 
}); 

现在我们必须决定在哪里执行此过滤。

如果你想摆脱那些符合fk标准，无论在自动完成输入使用的术语的项目，我会做原来projects数组：

var projects = [{label:"PH2938", value: "1", fk: "3", desc: "hello"}, 
       {label:"JUH28", value: "2", fk: "0", desc: "world"},]; 
       {label:"HK383", value: "3", fk: "3", desc: "!"},];  
projects = $.grep(projects, function (project) { 
    return project.fk === '3'; 
}); 

如果你想要的是一些更灵活，使您可以提供根据其他标准，不仅是标签的文本匹配不同的数据源，那么你就可以在source财产执行这种滤波：

source: function(request, response) { 
    var results = $.ui.autocomplete.filter(projects, request.term); 
    // Filter the matched results by project fk 3. 
    results = $.grep(results, function (project) { 
    return project.fk === '3'; 
    }); 
    response(results); 
}, 

的过滤可以在匹配太之前执行：

source: function(request, response) { 
    // Filter the matched projects by project fk 3. 
    var filteredProjects = $.grep(projects, function (project) { 
    return project.fk === '3'; 
    }); 
    var results = $.ui.autocomplete.filter(filteredProjects, request.term); 
    response(results); 
}, 

后者见一个demo。