Selectize.js：从数据库中预选项目selectize multiselect

Question

我已经看过很多关于如何执行此操作的示例。

我想使用Selectize jQuery插件将项目从数据库预填充到select元素。这个想法是，用户先前选择了一个或多个项目并且来到这个页面来编辑或添加更多项目。

从我所知道的，你使用“items”选项填充数组。试图让这个工作成功，我没有成功。

这里是我的代码：

$('#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'); 
});