使用复杂数组时Jquery自动完成功能不起作用

Jquery autocomplete not working when using a complex array

本文关键字:成功 功能 不起作用 Jquery 复杂 数组      更新时间:2023-09-26

我用这个问题作为基础,它是有效的。

我创建了一个JsFiddle,试图找出为什么这不起作用,而就我的一生而言,我无法解决它。即使say"H"的结果作为lastName的第一个字母输入,它也找不到任何结果。

有人能看看为什么这不是一场比赛吗?

     $(document).ready(function asdf() {

var users = [
{
  id: "5",
  userName: "Tclyde",
  firstName: "Terry",
  lasttName: "Adams",
},
{
  id: "6",
  userName: "LH",
  firstName: "Leonie",
  lasttName: "Henderson",
},
{
  id: "7",
  userName: "CharlesO",
  firstName: "Charles",
  lasttName: "O'Dwyer",
},
{
  id: "2",
  userName: "si2030",
  firstName: "Simon",
  lasttName: "O'Farrell",
},
{
  id: "4",
  userName: "blade44",
  firstName: "Clyde",
  lasttName: "Palmer",
},
{
  id: "3",
  userName: "tt2030",
  firstName: "David",
  lasttName: "Remmy",
}];
$("#search").autocomplete({
               source: function (req, responseFn) {
                   var re = $.ui.autocomplete.escapeRegex(req.term);
                   var matcher = new RegExp("^" + re, "i");
                   var a = $.grep(users, function (item, index) {
                       return matcher.test(item.lastName);
                   });
                   a = $.map(a, function (x) {
                       return {
                           label: x.lastName + ", " + x.firstName,
                           value: x.id,
                           users: x
                       };
                   });
                   responseFn(a);
               },
               select: function (event, ui) {
                   location.href = "/UserAdmin/Edit/" + ui.item.id;
               },
               change: function (event, ui) {
                   if (!ui.item) {
                       $("#search").val("");
                   }
               }
           });
});

很少有打字错误。有一个密钥lasttName,但您正在用作lastName

$(document).ready(function() {
      var users = [{
        id: "5",
        userName: "Tclyde",
        firstName: "Terry",
        lasttName: "Adams",
      }, {
        id: "6",
        userName: "LH",
        firstName: "Leonie",
        lasttName: "Henderson",
      }, {
        id: "7",
        userName: "CharlesO",
        firstName: "Charles",
        lasttName: "O'Dwyer",
      }, {
        id: "2",
        userName: "si2030",
        firstName: "Simon",
        lasttName: "O'Farrell",
      }, {
        id: "4",
        userName: "blade44",
        firstName: "Clyde",
        lasttName: "Palmer",
      }, {
        id: "3",
        userName: "tt2030",
        firstName: "David",
        lasttName: "Remmy",
      }];
      $("#search").autocomplete({
        source: function(req, responseFn) {
          addMessage("search on: '" + req.term + "'<br/>");
          var re = $.ui.autocomplete.escapeRegex(req.term);
          var matcher = new RegExp("^" + re, "i");
          var a = $.grep(users, function(item, index) {
            return matcher.test(item.lasttName); //Changed here
          });
          a = $.map(a, function(x) {
            return {
              label: x.lasttName + ", " + x.firstName, //Changed here
              value: x.id,
              users: x
            };
          });
          addMessage("Result: " + a.length + " items<br/>");
          responseFn(a);
        },
        select: function(event, ui) {
          location.href = "/UserAdmin/Edit/" + ui.item.id;
        },
        change: function(event, ui) {
          if (!ui.item) {
            $("#search").val("");
          }
        }
      });
      function addMessage(msg) {
        $('#msgs').append(msg);
      };
});

检查此jsFiddle