CODEWITHSUNDEEP
htmlinternet-explorer
Spike Lee
Spike Lee

Reputation: 411

html select option in internet explorer

I have the following code ; 

              <label for="courseLevel">Level</label>
              <select name="courseLevel" id="courseLevel">
                <option label="courseLevel">Foundation</option>
                <option label="courseLevel">Undergraduate</option>
                <option label="courseLevel">Postgraduate</option>
              </select>

In firefox and chrome i get "Foundation","Undergraduate","Postgraduate" as the options. In internet explorer i get "courseLevel","courseLevel","courseLevel". Why? and how can it be fixed?

Upvotes: 0

Views: 3124

Answers (5)

pb149
pb149

Reputation: 2298

Your XHTML is wrong.

You actually want <option value=""> tags; the label property makes no sense there. Furthermore, each value of an <option> tag should be unique. The label tag is correct there, since it corresponds to the id of the <select> tag and will make the drop-down menu appear when the 'Level' text is clicked.

<label for="courseLevel">Level</label>
   <select name="courseLevel" id="courseLevel">
      <option value="1">Foundation</option>
      <option value="2">Undergraduate</option>
      <option value="3">Postgraduate</option>
   </select>

Upvotes: 0

Dennis
Dennis

Reputation: 32598

The label attribute is only supported by IE/Opera and will replace the option's innerText value.

Upvotes: 0

Quamis
Quamis

Reputation: 11077

because firefox ignores the label elements assigned to each option.

http://www.w3schools.com/TAGS/att_option_label.asp , http://www.w3schools.com/TAGS/tag_option.asp

seems like only IE7+ and Opera supports this tag

Upvotes: 0

Bailey Parker
Bailey Parker

Reputation: 15905

label is not being used correctly (only IE 7+ and Opera support it). You don't need it.

<label for="courseLevel">Level</label>
<select name="courseLevel" id="courseLevel">
    <option>Foundation</option>
    <option>Undergraduate</option>
    <option>Postgraduate</option>
</select>

What you are probably looking for is value. For example, you could assign numeric values to each of the options like so:

<label for="courseLevel">Level</label>
<select name="courseLevel" id="courseLevel">
    <option value='0'>Foundation</option>
    <option value='1'>Undergraduate</option>
    <option value='2'>Postgraduate</option>
</select>

However, you don't need them. When no values are specified, the text between <option> and </option> will be used.

Upvotes: 3

Rijk
Rijk

Reputation: 11301

option tags don't need a label attribute. It might be the cause of this problem.

Upvotes: 1

Related Questions