使用JQuery Autocomplete

Question

这是我目前的代码

    $( "#part_numbers<?php echo $i ?>" )
        // don't navigate away from the field on tab when selecting an item
        .on( "keydown", function( event ) {
            if ( event.keyCode === $.ui.keyCode.TAB &&
                    $( this ).autocomplete( "instance" ).menu.active ) {
                event.preventDefault();
            }
        })
        .autocomplete({
            minLength: 1,
            source: function( request, response ) {
                // delegate back to autocomplete, but extract the last term
                response( $.ui.autocomplete.filter(
                    availableTags, extractLast( request.term ) ) );
            },
            focus: function() {
                // prevent value inserted on focus
                return false;
            },
            select: function( event, ui ) {
                var terms = split( this.value );
                // remove the current input
                terms.pop();
                // add the selected item
                terms.push( ui.item.value );
                // add placeholder to get the comma-and-space at the end
                terms.push( "" );
                this.value = terms.join( "; " );
                return false;
            }


        }).data("ui-autocomplete")._renderItem = function (ul, item) {
            return $("<li>")
              .append("<a>" + item.label + " - (" + item.desc + ") <img alt='no image' style='height: 50px;' src='./images/" + item.file + "' /></a>")
              .appendTo(ul);
        };

我希望能够搜索描述并能够找到这个例子

source: function (request, response) {
var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
response($.grep(schools, function(value) {
    return matcher.test(value.value)
        || matcher.test(value.nickname);
}));
}

我现在已经和它搏斗了一段时间并且只是随机测试了不同的东西但是却无法搜索标签和描述。有人可以帮助我吗？

Answer 1

根据我的评论，基本上您必须应用2个过滤器，捕获所有数据，然后将其发送回1个阵列中的response()。

如果您的数据如下：

var availableTags = [{
  value: "", 
  label: "", 
  desc: "", 
  file: "", 
  vendor: "" 
},{ 
  value: "00-1156-02", 
  label: "00-1156-02", 
  desc: "", 
  file: "", 
  vendor: "" 
}];

您可以设置以下来源：

source: function( request, response ) {
  // extract the last term
  var lastTerm = extractLast(request.term);
  var results = [];
  // loop over data, seeking labels & desc
  $.each(availableTags, function(k, v){
    if(v.label.indexOf(lastTerm) => 0){
      results.push(v);
    }
    if(v.desc.indexOf(lastTerm) => 0){
      results.push(v);
    }
  });
  response(results);
}

就个人而言，由于您已经在使用PHP，我会将您的源代码设置为在SQL数据库中执行此查询的PHP页面。

希望有所帮助。