Selectize.js: предварительно заполнить элементы из базы данных, выбрать мультиселект
Я искал примеры того, как это сделать.
Я пытаюсь предварительно заполнить элементы из базы данных в элемент выбора с помощью плагина Selectize jQuery. Идея состоит в том, что пользователь предварительно выбрал элемент (ы) и заходит на эту страницу для редактирования или добавления дополнительных элементов.
Из того, что я могу сказать, вы заполняете массив, используя «Предметы«вариант. У меня был нулевой успех, пытаясь заставить это работать.
Вот мой код:
$('#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
});
Таким образом, на основе массива в элементах, два элемента должны отображаться уже выделенными в множественном выборе. Все остальное работает отлично. Любая помощь приветствуется.
Решение
Ты можешь использовать addItem(value, silent) выбрать предметы.
Другие решения
Проверьте это Как добавить элемент в selectstize js автоматически после того, как документ готов?
Я использую автономную библиотеку. Другие принятые ответы не работали для меня.
$(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');
});