We used material select with multiple options and some options disabled. <select id="testSelect" style="display:block !important;width:100%;height:200px;" multiple=""> <option disabled="" value="">Select</option> <option disabled="" value="">Group 1</option> <option value="1-1">Option 1</option> <option value="1-2">Option 2</option> <option disabled="" value="">Group 2</option> <option value="2-1">Option 1</option> <option value="2-2">Option 2</option> <option disabled="" value="">Group 3</option> <option value="3-1">Option 1</option> <option value="3-2">Option 2</option> </select> The style on it is used so we could see the original select with its original select values. We initialize this with $('#testSelect').materialSelect(); . Now we click on "Select all" in material select - it seems like all the options are selected, but when we look at the real options (and when we do $('#testSelect').val() ), we find out material select selected first six options - with two disabled. Why is that?

---