预输入未显示所有匹配项

Typeahead not showing all matches

提问人:dabadaba 提问时间:11/8/2022 最后编辑:dabadaba 更新时间:11/8/2022 访问量:33

问:

我正在使用预输入从下拉列表中选择一个特定帐户,其中包含共享电子邮件的所有帐户(家庭成员)的列表。您输入完整的电子邮件,该电子邮件会在后端搜索所有匹配项,并且提前输入应显示所有匹配项供您选择。

但是,它正在过滤掉一些匹配项,我不知道为什么。

这是代码:

$input.typeahead({
    minLength: 5,
    limit: 30,
}, {
    name: 'accounts',
    displayKey: 'fullName',
    source: function (query, sync, async) {
        if (isEmail(query)) {
            $.getJSON('{% url 'account_finder_json' %}?email=' + query, function (data) {
                data.accounts.map(function (account) {
                    account.fullName = `${account.first_name} ${account.last_name}`;
                });
                // data.accounts hold all expected results
                async(data.accounts);
            });
        }
    }
}).on('typeahead:selected', function (e, item) {
    $input.typeahead('val', '');
    confirmAccountSelection(item);
});

我已经测试了这两个数据集(由后端端点作为 JSON 响应给出):

数据集 1:

"[
  {
    \"first_name\": \"Bero\",
    \"last_name\": \"Underfoot\",
    \"email\": \"[email protected]\",
    \"fullName\": \"Bero Underfoot\"
  },
  {
    \"first_name\": \"Falco\",
    \"last_name\": \"Underfoot\",
    \"email\": \"[email protected]\",
    \"fullName\": \"Falco Underfoot\"
  },
  {
    \"first_name\": \"Magnachar\",
    \"last_name\": \"Underfoot\",
    \"email\": \"[email protected]\",
    \"fullName\": \"Magnachar Underfoot\"
  }
]" 

数据集 2:

"[
  {
    \"first_name\": \"Bilbo\",
    \"last_name\": \"Brandagamba\",
    \"email\": \"[email protected]\",
    \"fullName\": \"Bilbo Brandagamba\"
  },
  {
    \"first_name\": \"Frodo\",
    \"last_name\": \"Brandagamba\",
    \"email\": \"[email protected]\",
    \"fullName\": \"Frodo Brandagamba\"
  },
  {
    \"first_name\": \"Merry\",
    \"last_name\": \"Brandagamba\",
    \"email\": \"[email protected]\",
    \"fullName\": \"Merry Brandagamba\"
  },
  {
    \"first_name\": \"Pippin\",
    \"last_name\": \"Brandagamba\",
    \"email\": \"[email protected]\",
    \"fullName\": \"Pippin Brandagamba\"
  }
]" 

但是,当搜索时,只有“Bero”和“Falco”出现在建议框中(不包括另一个),而搜索时,只有“Bilbo”出现在框中(不包括所有其他)。[email protected][email protected]

我错过了什么?

编辑:如果我编辑数据集并添加“Abel Underfoot”,它将作为搜索的唯一匹配项。[email protected]

JavaScript 提前输入

评论


答:

0赞 Rais Helmy 11/8/2022 #1

你检查过你的格式吗?确保逗号适用于所有人。

对于第二个,您需要回溯代码,并确保系统在检索所有值之前不会返回值。

评论

0赞 dabadaba 11/8/2022
逗号没有问题。我只是从控制台复制了它。
0赞 Rais Helmy 11/8/2022
如果您使用的是 Twitter 库,您可以更改为 bootstrap typeahead。这比旧的推特库容易得多