Question

我已经看了很多关于如何做到这一点的例子。

我正在尝试使用Selectize jQuery插件将数据库中的项目预填充到select元素中。这个想法是用户之前选择了一个项目并进入此页面来编辑或添加更多项目。

据我所知，您使用＆＃34; items＆＃34;填充数组。选项。我试图让它发挥作用没有成功。

这是我的代码：

$('#nsn').selectize({
    persist: false,
    maxItems: null,
    valueField: 'id',
    labelField: 'name',
    searchField: ['nsn', 'part_name', 'id'],
    sortField: [
        {field: 'nsn', direction: 'asc'},
        {field: 'part_name', direction: 'asc'}
    ],
//"items" below should pre-populate select element 
    items: [
        {nsn: '2840-01-461-8833NZ', part_name: 'adfasdfasdf', id:'562'},
        {nsn: '1111-22-333-4444', part_name: 'afafdsdf', id:'902'},
    ],
    options: [
        {nsn: 'NA', part_name: 'F100 Variable Vane', id:'329'},
{nsn: 'N/A', part_name: 'F100 Variable Vane', id:'331'},
{nsn: '6685-01-281-6849AW', part_name: 'Generator Oil Temperature   Indicator', id:'672'},
{nsn: '6680-01-350-8049RK', part_name: 'Fuel Quantity Indicator', id:'391'},
{nsn: '6680-01-350-8048RK', part_name: 'Indicator, Liquid Quantity', id:'367'},
{nsn: '6680-01-224-7271RK', part_name: 'Fuel Quantity Indicator', id:'390'},
{nsn: '6680-00-220-4090RK', part_name: 'Fuel Quantity Indicator', id:'389'}
],
    render: {
        item: function (item, escape) {
            var name = formatName(item);
            return '<div>' +
            (item.nsn ? '<span class="name">' + escape(item.nsn) + '</span>, ' : '') +
            (item.part_name ? '<span class="email">' +    escape(item.part_name) + '</span>' : '') +
            '</div>';
        },
        option: function (item, escape) {
            var name = formatName(item);
            var label = name || item.nsn;
            var caption = name ? item.nsn : null;
            return '<div>' +
            '<span class="label">' + escape(label) + '</span>' +
            (caption ? '<span class="caption">' + escape(caption) + '</span>' : '') +
            '</div>';
        }
    },
    create:false
});

因此，根据项目中的数组，多选中应该已经选择了两个项目。其他一切都很完美。任何帮助表示赞赏。

Answer 1

您可以使用addItem(value, silent)选择项目。

Answer 2

查看此How to add item into selectize js automatically after document ready?

我正在使用独立库。其他公认的答案对我不起作用。

$(document).ready(function(){
   var selectize_element = $("#select-links")[0].selectize;
   selectize_element.addOption({
      text:'First Item',
      value: 'First Item'
   });
   selectize_element.refreshOptions() ;
   selectize_element.addItem('First Item');
});

Selectize.js：从数据库中预填充项目选择多选

2 个答案: