How to hide optgroup/option elements?
I figured that this solution works fine for me:
Make another select e.g.
$("#footer_canvas").after('<select id="parkingLot"></select>');
then hide it
$("#parkingLot").hide();
When you want to 'hide' some optgroup, just 'park' it in this hidden select.
$('#VehicleVehicleCategoryId optgroup[label="kategorie L"]').appendTo("#parkingLot");
Same way you can make it visible. This is just the snippets of my solution, that works fine for me.
DisgruntledGoat
I'm a web developer and programmer from the UK. I'll fill this out more when I can be bothered; really I'm just trying to get the autobiography badge.
Updated on April 30, 2020Comments
-
DisgruntledGoat about 4 years
Is there a way to hide
option
oroptgroup
HTML elements? I've tried callinghide()
in jQuery, and also using regular Javascript to setstyle.display='none'
.It works in Firefox but not in any other browsers. Actually removing them from the DOM does work, so perhaps there's a way to save each DOM element when it's removed, and reinsert them in the same place?
My HTML is like this:
<select name="propsearch[area]" id="propsearch_area"> <option value="0">- Any -</option> <optgroup label="Bristol"> <option value="Hotwells">Hotwells</option> <option value="Montpelier">Montpelier</option> </optgroup> <optgroup label="Cardiff"> <option value="Heath">Heath</option> <option value="Roath">Roath</option> </optgroup> <optgroup label="Exeter"> <option value="Pennsylvania Road">Pennsylvania Road</option> <option value="Lower North Street">Lower North Street</option> </optgroup> <optgroup label="Swansea"> <option value="Brynmill">Brynmill</option> <option value="Uplands">Uplands</option> </optgroup> </select>