Click here to Skip to main content
15,891,951 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
Is it possible to add placeholder in an asp.net Dropdownlist
Posted
Comments
[no name] 25-Apr-14 3:17am    
your question is not getting clear. can explain briefly to the requirement
Schatak 25-Apr-14 3:34am    
is there any spl need to add so?
MAGuru 25-Apr-14 5:09am    
How to add placeholder to a dropdown list
j snooze 25-Apr-14 14:54pm    
Why do you want to do that? What is the purpose of putting a placeholder in a drop down list?
JB0301 4-May-14 21:42pm    
just put a "SELECT" or "Choose" at your list, I think it is NOT possible to put a placeholder on the dropdownlist, or you can just set a text for it on load

1 solution

According to Mozilla Dev Network[^], placeholder is not a valid attribute on a input. And also, a value attribute is suggested, just in case some older browsers depend on it.

Instead, add an option with an empty value like so:

<select placeholder="select your beverage">
<option value="" default="" selected="">select your beverage</option>
<option value="tea">Tea</option>
<option value="coffee">Coffee</option>
<option value="soda">Soda</option>
</select>

Bonus: In newer browsers, adding the required attribute to the element will not allow the user to submit the form if the default option is selected.

If you want to style the default option, you need the following CSS:

CSS
select option[default] {
    color: #333;
}

Note that this will only style the item inside the drop-down list, not the value displayed on the input. If you want to style that with CSS target your element directly.

If you wanted to make it slightly harder for the user to select the default item, you could use a display: none; CSS rule, but remember that this will not prevent users from selecting it, this just makes it harder for them to do so.
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900