将 selectize.js 与远程源一起使用答案

【问题标题】：Use selectize.js with remote source将 selectize.js 与远程源一起使用
【发布时间】：2016-01-30 11:24:58
【问题描述】：

如何将 selectize.js 与远程源一起使用？我遵循了这个例子：

$('#select-repo').selectize({
    valueField: 'url',
    labelField: 'name',
    searchField: 'name',
    create: false,
    render: {
        option: function(item, escape) {
            return '<div>' +
                '<span class="title">' +
                    '<span class="name"><i class="icon ' + (item.fork ? 'fork' : 'source') + '"></i>' + escape(item.name) + '</span>' +
                    '<span class="by">' + escape(item.username) + '</span>' +
                '</span>' +
                '<span class="description">' + escape(item.description) + '</span>' +
                '<ul class="meta">' +
                    (item.language ? '<li class="language">' + escape(item.language) + '</li>' : '') +
                    '<li class="watchers"><span>' + escape(item.watchers) + '</span> watchers</li>' +
                    '<li class="forks"><span>' + escape(item.forks) + '</span> forks</li>' +
                '</ul>' +
            '</div>';
        }
    },
    score: function(search) {
        var score = this.getScoreFunction(search);
        return function(item) {
            return score(item) * (1 + Math.min(item.watchers / 100, 1));
        };
    },
    load: function(query, callback) {
        if (!query.length) return callback();
        $.ajax({
            url: 'https://api.github.com/legacy/repos/search/' + encodeURIComponent(query),
            type: 'GET',
            error: function() {
                callback();
            },
            success: function(res) {
                callback(res.repositories.slice(0, 10));
            }
        });
    }
});

而且工作正常。如果我用我的网址更改网址，它将停止工作。

来自远程远程 url 的示例响应：

[
  {
    "id":2,
    "title":"Facere sequi dolore dignissimos eum aut et."
  },
  {
    "id":3,
    "title":"Perspiciatis laudantium aut eos autem dolor quisquam."
  },
  {
    "id":10,
    "title":"Enim provident vel rerum laborum quis nobis."
  },
  {
    "id":25,
    "title":"Porro earum nihil recusandae rerum ratione sunt."
  }
]

我在加载函数中使用了console.log，响应很好。即使选择框中没有下拉菜单。我一直试图让它工作超过 3 个小时，但没有成功。

【问题讨论】：

将您的 URL 返回的特定数据添加到问题中。如果您的问题，我猜这是：stackoverflow.com/a/31881542/1160796
我更新了我的问题并添加了一个示例响应。希望对您有所帮助。

标签： javascript jquery selectize.js

【解决方案1】：

这与我的其他答案完全相同。您正在使用 Id/Title，但您的渲染函数使用大量其他字段（描述、用户名、分叉）。将您的渲染更改为：

render: {
     option: function (item, escape) {
         return '<div>' + escape(item.title) + '</div>';
     }
}

您还需要更改成功函数，因为它没有获取存储库列表：

success: function(res) {
        callback(res);
    }

【讨论】：

渲染似乎永远不会运行