如何以编程方式设置selectize.js选项列表

 mobiledu2502926273 发布于 2023-02-11 17:55

我知道如何在Initiliaztion上设置optionList但是如何以编程方式设置它?我有一个inviteList数组.

$("#select-invite").options(inviteList);

byte255.. 48

您可以使用load方法通过编程API设置选项.您可能还想调用clear和clearOptions方法来重置选定的值和旧选项.

以下是如何将它们放在一起:

var selectize = $("#select-invite")[0].selectize;
selectize.clear();
selectize.clearOptions();
selectize.load(function(callback) {
    callback(inviteList);
});

请注意,inviteList应该是一个对象数组,当初始化select时,这些对象具有在valueField和labelField选项中配置的属性.例如,以下是使用默认valueField和labelField选项的inviteList的外观:

var inviteList = [
    {
        text: 'Option One',
        value: 1
    },
    {
        text: 'Option Two',
        value: 2
    }
];


dKen.. 10

据我所知,没有办法通过API添加多个选项.您需要编写一个使用该addOption()方法的循环.在尝试使用API​​之前,您需要获取选择控件的实例.从Github示例中查看下面的示例:

// Create the selectize instance as usual 
var $select = $('#select-tools').selectize({
    maxItems: null,
    valueField: 'id',
    labelField: 'title',
    searchField: 'title',
    options: [
        {id: 1, title: 'Spectrometer', url: 'http://en.wikipedia.org/wiki/Spectrometers'},
        {id: 2, title: 'Star Chart', url: 'http://en.wikipedia.org/wiki/Star_chart'},
        {id: 3, title: 'Electrical Tape', url: 'http://en.wikipedia.org/wiki/Electrical_tape'}
    ],
    create: false
});

// Get the selectize control instance
var control = $select[0].selectize;

// Add the new option when a button is clicked
// Remove the click event and put the addOption call in a loop
$('#button-addoption').on('click', function() {
        control.addOption({
        id: 4,
        title: 'Something New',
        url: 'http://google.com'
    });
});

来自Github的例子.

撰写答案
今天,你开发时遇到什么问题呢?
立即提问
热门标签
PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有