Selectize.js在“onItemAdd”回调

TL获得更多的数据; DRSelectize.js在“onItemAdd”回调

使其更清晰，我希望有机会在onItemAdd函数内选择JSON对象的所有数据。现在我只能通过配置变量访问_id和name。

好吧，所以我有一个工作Selectize.js函数从我的服务器抓取JSON对象并创建选择选项。

我想知道的是，我可以从“onItemSelect”回调中的现有JSON对象获得更多数据吗？

我可以直接得到的唯一数据是value作为在配置，在这种情况下是“_id”和我假设是形成在配置在labelField，在这种情况下是name形式$item指定JSON数据。

如何获得比选定项目更多的数据？您在呈现对象中看到我使用变量item.sku，如何在“onItemAdd”回调中访问sku变量？

数据形成的服务器是一个JSON阵列：

[ 
    { _id: 'abcd1234', name: 'Sample', sku: '00123' }, 
    { _id: 'efgh5678', name: 'Sample2', sku: '00124' } 
]

我的功能

// setup select box to add new products to list 
$('#buyingGroupAddProducts').selectize({ 
    valueField: '_id', 
    labelField: 'name', 
    searchField: 'name', 
    options: [], 
    create: false, 
    closeAfterSelect: true, 
    render: { 
    option: function(item, escape) { 
     return '<div>'+ escape(item.sku) + ': ' + escape(item.name) + '</div>'; 
    } 
    }, 
    load: function(query, callback) { 
    if (!query.length) return callback(); 
    $.ajax({ 
     url: '/buying/products-search', 
     type: 'GET', 
     dataType: 'json', 
     data: { 
     q: query 
     }, 
     error: function() { 
     callback(); 
     }, 
     success: function(res) { 
     callback(res); 
     } 
    }); 
    }, 
    onItemAdd: function(value, $item) { 

    // DO the thing 
    console.log($item); 

    } 
});

SelectizeJS网站：http://selectize.github.io/selectize.js/

来源

2016-02-29 Nicekiwi

你有没有这样做？我也在寻找答案。 – neobie

@neobie我做过了，但没有选择Selectize。我不记得我使用过这个项目，我从头开始构建自己的插件，另一个我使用http://www.runningcoder.org/jquerytypeahead/ – Nicekiwi

一劈为您解决问题：里面onItemAdd功能，您可以访问您所有的JSON：this.options为您提供所有选择选项，所以现在您拥有完整的JSON值，您可以轻松地在你的json中回顾对应于所选值的项目。如果您在plunker中提供用例，我可以填写我的答案。

来源

2017-10-06 14:05:24 Mouss

Selectize.js在“onItemAdd”回调

回答

相关问题