Start combobox without any text

Asked

Viewed 179 times

2

I have a select (usually called a combobox) and wish there was no text when running the site

<select>
  <option value="Roupa Desportiva">Roupa Desportiva</option>
  <option value="Futebol">Futebol</option>
  <option value="Basquetebol">Basquetebol</option>
  <option value="Andebol">Andebol</option>
  <option value="Tenis">Tenis</option>
</select>

that’s the code I’m using

html

1 answer

10


Just leave the first field empty

Option 1

<select>
  <option selected data-default value=""></option>
  <option value="Roupa Desportiva">Roupa Desportiva</option>
  <option value="Futebol">Futebol</option>
  <option value="Basquetebol">Basquetebol</option>
  <option value="Andebol">Andebol</option>
  <option value="Tenis">Tenis</option>
</select>

Option 2: Help text for the user.

select option[data-default] {
  color: #999; /* cor simulando que o campo está desabilitado depois que abre o select */
}
<select>
  <option selected data-default>- Selecione -</option>
  <option value="Roupa Desportiva">Roupa Desportiva</option>
  <option value="Futebol">Futebol</option>
  <option value="Basquetebol">Basquetebol</option>
  <option value="Andebol">Andebol</option>
  <option value="Tenis">Tenis</option>
</select>

  • it is only because visually it does not look beautiful and for later put in the database do not want to have a blank value not to have to make validations

  • @Joségomes Yes I understand. In fact the worst in my view is the user find that the field is already selected with an option, or find that the field is required.

  • yes that is why I did not want there text... There is then no other way to solve than the above?

  • Yes I just edited with another option

  • Okay, thanks for the help @hugocsl

  • Quiet young man we are there. Includes a CSS in select now, so the first option is kind of deleted in the combo box, it’s just a usability detail even. Good sorete with the project!

Show 1 more comment

Browser other questions tagged html

You are not signed in. Login or sign up in order to post.