optgroupをselctize.jsで選択した値で表示

Question

複数の値を選択できるselectizeフィールドがあります。これらの値はoptgroupsでグループ化されます。理解を容易にするために、複数のオプトグループに値を設定することもできます。選択したフィールドのラベルにオプトグループの名前が表示されます。どうすればこれを達成できますか？

「最初のアイテム」を選択した場合、どのアイテムが選択されたか分かりません。ストアまたはウェアハウス。

ありがとうございます！

<select name="test" id="test-select" multiple="multiple"> 
    <optgroup label="Store"> 
    <option data-type="stores" value="1">First item</option> 
    <option data-type="stores" value="2">Second item</option> 
    </optgroup> 
    <optgroup label="Warehouse"> 
    <option data-type="warehouses" value="3">First item</option> 
    <option data-type="warehouses" value="4">Second item</option> 
    </optgroup> 
</select> 

そして、これはjavascriptのコードです：

https://jsfiddle.net/4t8fjj7g/1/

HTML

基本的に

$('select#test-select').selectize({ 
    searchField: ['text', 'type'] 
}); 

Answer 1

、ダフィーが提案したもの、しかし...あなたがカスタムレンダリング機能を使用することができます ドロップダウンオプションと選択したアイテム：

$('select#test-select').selectize({ 
    searchField: ['text', 'type'], 
    render: { 
    item: itemRenderFunction, 
    option: optionRenderFunction 
    } 
}); 

これにより、選択したアイテムリストでのラベルの乗算を避けることができます。