|
Chained Selects Step-by-step: Set up option groups in a list group We can use option groups in a list group, for example if we have a select list with option groups: and the HTML codes would look like this: <select> <option>Select a vehicle</option> <optgroup label="Toyota"> <option>Cars</option> <option>SUVs/Van</option> <option>Trucks</option> </optgroup> <optgroup label="Honda"> <option>Cars</option> <option>SUVs/Van</option> </optgroup> </select> To do so with CS, we map the <optgroup> to addOptGroup('list-name', 'label') and </optgroup> to endOptGroup('list-name'):
addOption("vehicles", "Select a vehicle", "");
addOptGroup("vehicles", "Toyota");
addOption("vehicles", "Cars", "");
addOption("vehicles", "SUVs/Van", "");
addOption("vehicles", "Trucks", "");
endOptGroup("vehicles");
addOptGroup("vehicles", "Honda");
addOption("vehicles", "Cars", "");
addOption("vehicles", "SUVs/Van", "");
endOptGroup("vehicles");
Note: Option group support in CS is disabled for Opera and browsers that don't support DOM. Click [ here ] to see a demo page. [ Apply CSS to list options ] [ Back to main page ] # # #
|