将selectize.js与远程源代码一起使用
Use selectize.js with remote source
如何将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更改url,它就会停止工作。
来自远程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."
}
]
我在load函数中使用了console.log,响应很好。即使选择框中没有下拉列表。我已经试着让它工作了3个多小时,但没有成功。
这和我的另一个答案完全一样。您使用的是Id/Title,但您的渲染函数使用了一吨其他字段(描述、用户名、fork)。将渲染更改为:
render: {
option: function (item, escape) {
return '<div>' + escape(item.title) + '</div>';
}
}
您还需要更改成功函数,因为它没有存储库列表:
success: function(res) {
callback(res);
}
相关文章:
- 转义符不能与innerHTML一起使用
- 活动选项卡's源代码-获取变量s值
- 高亮显示与数组字符串一起使用时文本插件中断
- setTimeout可以与闭包内的函数一起使用吗
- 将依赖外部库的UMD模块与browserfy捆绑在一起
- Highcharts colorsByPoint与系列中的线性渐变一起使用时不起作用
- 如何将js库与typescript一起使用
- 将webpack和babel与父项目目录中的文件一起使用
- 将 Drag&Drop 与 jsTree 和 DataTables 一起使用
- Javascript-如何让脚本与Ajax请求的数据一起运行
- 将两个ext.TabPanels滚动到一起
- 将jQuery UI Timepicker Addon与React一起使用
- 什么是curl以及如何将其与nodejs一起使用
- Javascript”;onmousemove”;事件无法与类一起使用
- 将require('..')与变量一起使用与在webpack中使用字符串相比
- 如何将HTML源代码与jQuery Autocomplete一起使用
- 如何让jQuery UI自动完成与json源代码一起工作
- 将selectize.js与远程源代码一起使用
- 如何将ajax与tinyMCE HTML编辑器一起使用来发送源代码
- 让源代码映射与评估过的代码一起工作