Multi Select
Basic example
<vscode-multi-select id="select-example"> <vscode-option description="Consectetur adipiscing elit"> Lorem </vscode-option> <vscode-option selected description="Donec elit odio"> Ipsum </vscode-option> <vscode-option description="Aliquam ac vulputate eros"> Dolor </vscode-option></vscode-multi-select>
const select = document.querySelector("#select-example");
select.addEventListener("change", () => { console.log(select.value);});
Combobox mode
<p> <label for="search-method">Search method:</label> <select name="search-method-selector" id="search-method-selector"> <option value="contains">contains</option> <option value="fuzzy">fuzzy</option> <option value="startsWith">startsWith</option> <option value="startsWithPerTerm">startsWithPerTerm</option> </select></p>
<vscode-multi-select id="combobox-example" combobox> <vscode-option>Afghanistan</vscode-option> <vscode-option>Albania</vscode-option> <vscode-option>Algeria</vscode-option> ...</vscode-multi-select>
const cb = document.querySelector("#combobox-example");const sl = document.querySelector("#search-method-selector");
sl.addEventListener("change", () => { cb.filter = sl.options[sl.selectedIndex].value;});
cb.filter = sl.options[sl.selectedIndex].value;