CODEWITHSUNDEEP
javascriptjqueryselectize.js
Adrian
Adrian

Reputation: 2656

Selectize.js: add category label to the selection

selectize.js

It is possible to add a non selectable category (label) to the input selection?

enter image description here

The problem is, that I have a big list of inputs and it would be great to add categories (labels) to the selection. Like this:

Category 1
---Item1
---Item2
---Item3
---Item4
Category 2
---Item5
---Item6
---Item7
---Item8
...etc

Upvotes: 4

Views: 2321

Answers (2)

Ángela
Ángela

Reputation: 1425

You can enable both tag creation and option groups. It seems to work here.

Use a select element, with optgroup for categories:

<select id="select-gear" class="demo-default" multiple placeholder="Select gear...">
    <option value="">Select gear...</option>
    <optgroup label="Climbing">
        <option value="pitons">Pitons</option>
        <option value="sling">Sling</option>
    </optgroup>
    <optgroup label="Skiing">
        <option value="skis">Skis</option>
        <option value="skins">Skins</option>
        <option value="poles">Poles</option>
    </optgroup>
</select>

When you initialize it, use the option create : true:

$('#select-gear').selectize({
    create: true
});

Upvotes: 2

Ramesh Kotha
Ramesh Kotha

Reputation: 8322

Selectize supports <optgroup>

enter image description here

Upvotes: 1

Related Questions