Hiding OPTIONS in SELECT ?

comp.lang.javascript · Jun 21, 2004

Using IE5.5+, is it possible to hide options in a select?

The following doesn't work:

<HTML>
<HEAD>
<STYLE>
SELECT OPTION.orgA{ display:none }
.orgB{ display:inline }
.orgC{ display:none }
</STYLE>
</HEAD>
<BODY>
<SELECT id=cbo size=3>
<OPTION class="orgA">RTI</OPTION>
<OPTION class="orgB">LAB</OPTION>
<OPTION class="orgC">TCI</OPTION>
</SELECT>
</BODY>
</HTML>

Best Regards,
Jesse Wade

*** Sent via Devdex http://www.devdex.com ***
Don't just participate in USENET...get rewarded for it!

Grant Wagner · Jun 21, 2004

comp.lang.javascript said:
Using IE5.5+, is it possible to hide options in a select?

The following doesn't work:

<HTML>
<HEAD>
<STYLE>
SELECT OPTION.orgA{ display:none }
.orgB{ display:inline }
.orgC{ display:none }
</STYLE>
</HEAD>
<BODY>
<SELECT id=cbo size=3>
<OPTION class="orgA">RTI</OPTION>
<OPTION class="orgB">LAB</OPTION>
<OPTION class="orgC">TCI</OPTION>
</SELECT>
</BODY>
</HTML>

Best Regards,
Jesse Wade

If you want to have items dynamically appear and disappear from a
<select> you're going to have to remove the references to the
actual <option> objects and recreate them when you want them
"visible":

document.getElementById{'cbo').options[1] = null;

var select = document.getElementById('cbo');
select.options[select.option.length] = new Option(...);

Of course that adds it to the bottom, if you want it added at the
cursor position or in sorted order, you'll have to re-order the
<option> objects after you add the new ones.

--
| Grant Wagner <[email protected]>

* Client-side Javascript and Netscape 4 DOM Reference available
at:
*
http://devedge.netscape.com/library/manuals/2000/javascript/1.3/reference/frames.html

* Internet Explorer DOM Reference available at:
*
http://msdn.microsoft.com/workshop/author/dhtml/reference/dhtml_reference_entry.asp

* Netscape 6/7 DOM Reference available at:
* http://www.mozilla.org/docs/dom/domref/
* Tips for upgrading JavaScript for Netscape 7 / Mozilla
* http://www.mozilla.org/docs/web-developer/upgrade_2.html

Multi select options in a menu	1	Oct 30, 2022
I want to Display Excel As HTML In js	2	Feb 24, 2023
Options in select Box	5	Oct 21, 2006
deselect select list options in IE6	0	Jul 6, 2007
Problem Changing Options in <SELECT>	7	Dec 9, 2003
Select Boxes and Conditional Statements	0	Aug 28, 2006
Scrolling multiple-select, IE vs Firefox	4	Apr 29, 2006
select list in frame	0	Feb 15, 2006

Hiding OPTIONS in SELECT ?

comp.lang.javascript

Grant Wagner

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads