Solved

style="display:none" does not work for option element

Posted on 2007-12-04
4
5,721 Views
Last Modified: 2009-04-11
Hello
I have a select list and I need a way to set certain option tags invisible. I tried applying style="display:none" to the option tags but this has had no effect.
The reason for this is that I am going to use some JavaScript to dynamically enable some selections in the drop down list.
Please see the attached code snippet.
Thanks

<select id="counties" tabindex="1">

 <option value="">Select</option>

 <option style="display:none" value="IE76176089">Carlow</option>

 <option style="display:none" value="IE96268862">Cavan</option>

 <option style="display:none" value="IE55624026">Clare</option>

 <option style="display:none" value="GB55624026">London</option>

 <option style="display:none" value="GB55624026">Surrey</option>

</select>

Open in new window

0
Comment
Question by:mike99c
  • 2
4 Comments
 
LVL 19

Assisted Solution

by:SteveH_UK
SteveH_UK earned 166 total points
Comment Utility
0
 
LVL 19

Accepted Solution

by:
erikTsomik earned 167 total points
Comment Utility
0
 
LVL 29

Assisted Solution

by:Göran Andersson
Göran Andersson earned 167 total points
Comment Utility
You can't hide options, you have to remove them from the select list if you don't want them to show up.

Here is how you dynamically add an option to the select list:

var o = document.createElement('option');
o.value = 'IE76176089';
o.text = 'Carlow';
document.getElementById('counties').options.Add(o);
0
 
LVL 29

Expert Comment

by:Göran Andersson
Comment Utility
Checking back to see if you had any progress?
0

Featured Post

What Is Threat Intelligence?

Threat intelligence is often discussed, but rarely understood. Starting with a precise definition, along with clear business goals, is essential.

Join & Write a Comment

Creating a CSS block that only applies to printing By default, all of your CSS applies to every possible view of your page - whether on screen, printed, landscape, touch-screen, or whatever.  You can, however, add CSS that only applies under certai…
Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

13 Experts available now in Live!

Get 1:1 Help Now