语义用户界面下拉列表显示“未定义”

Question

我很难让语义UI (v2.4.2) dropdown像预期的那样工作。

如果我单击向下箭头，dropdown将显示未定义项的列表：

​

​

如果我键入标记的名称，dropdown将显示正确的标记列表：

​

​

HTML：

<div id="myList" class="ui multiple search selection dropdown">
  <input type="hidden" name="tags">
  <i class="dropdown icon"></i>
  <div class="default text">Tags</div>
</div>

<script type="text/javascript">
  $("#myList").dropdown({
    minCharacters : 3,
    allowAdditons : true,
    apiSettings   : {
        url       : '//localhost:9393/tags/search?q={query}',
        onResponse: function(tags) {

          console.debug('onResponse');

          var response = {
              success: true,
              results: []
          };
          $.each(tags, function(index, item) {
            response.results.push({
              name: item.name,
              value: item.id
            });
          });
          return response;
        }
    }
  });
</script>

JSON API以数组的形式返回标记列表：

[
  {
    "id": 5,
    "name": "mssql",
    "description": "Microsoft SQL Server is a relational, database-management system developed by [Microsoft](https://www.microsoft.com/)."
  },
  {
    "id": 6,
    "name": "oracle",
    "description": "Oracle's DBMS"
  },
  {
    "id": 8,
    "name": "plsql",
    "description": "[PL/SQL](https://en.wikipedia.org/wiki/PL/SQL) is Oracle Corporation's procedural extension for SQL and the Oracle relational database."
  }
]

奇怪的是，只有在搜索框中输入值时，才会触发onResponse回调。

我遗漏了什么？

Answer 1

您已在此处将发起搜索的最小字符数设置为3：

$("#myList").dropdown({
   minCharacters : 3,
   allowAdditons : true

只需添加：

showOnFocus:true

添加到您的配置对象。它应该可以解决这个问题。