首页 > 解决方案 > 使用 Ajax 选择不加载选项

问题描述

我正在使用 ExpressJS 为我所在的社区构建一个管理仪表板。我目前有一个显示向数据库添加新游戏的模式。数据是远程获取的,但我无法让数据显示以选择它。

我可以使用 console.log 来显示正在检索的数据,但我不确定我的不足之处。

代码

$(document).ready(function () {
            $('#ttitle').selectize({
                create: false,
                valueField: 'appid',
                labelField: 'name',
                searchField: 'name',
                closeAfterSelect: true,
                options: [],
                load: function (query, callback) {
                    if (!query.length) return callback();
                    $.ajax({
                        url: `/games/all?search=${encodeURIComponent(query)}`,
                        type: 'GET',
                        error: function () {
                            callback();
                        },
                        success: function (res) {
                            console.log(res.value)
                            callback(res.value);
                        }
                    });
                }
            });
        });

在搜索框中键入时,控制台显示以下内容 在此处输入图像描述

HTML - 如果重要的话

<div class="form-group">
   <label for="ttitle">Game Title</label>
   <select name="ttitle" id="ttitle">
      <option></option>
   </select>
</div>

在此处输入图像描述

标签: javascriptjqueryhtmlexpressselectize.js

解决方案


searchField设置采用数组值(不是字符串),因此您需要将其更改为:

searchField: ['name']

否则,您的设置看起来不错。


推荐阅读