Placeholder in Select option

How do I get an equivalent placeholder in a selection? For example, when you have a picklist, it might say in the City field, and then clicking on it will display all the cities in the options.

+3


source to share


2 answers


I think this is what you want.

HTML:

<select id="choice">
  <option value="0" selected="selected">Choose...</option>
  <option value="1">Something</option>
  <option value="2">Something else</option>
  <option value="3">Another choice</option>
</select>

      

CSS:



#choice option { color: black; }
.empty { color: gray; }

      

JavaScript:

$("#choice").change(function () {
  if($(this).val() == "0") $(this).addClass("empty");
  else $(this).removeClass("empty")
});

$("#choice").change();

      

try jsfiddle .

+3


source


Don't know what exactly you are looking for



<select>
    <option value="" disabled selected>Select your option</option>
    <option value="value1">Value 1</option>
    <option value="value2">Value 2</option>
    <option value="value3">Value 3</option>
</select>

      

+2


source







All Articles