HTML Select Box show as Multiple, but to Disable Multiple Selection?

StackOverflow https://stackoverflow.com/questions/14155752

Question

I needed to have:

  • A html <select> box showing as a vertically expanded box (not a Dropdown). So i set it as multiple.

Then it is showing correctly as:

<select id="gagaga" multiple>
    <option>A</option>
    <option>B</option>
    <option>C</option>
</select>
  • Then how can i make it non-multiple selectable? (to allow only 1 selection)
Was it helpful?

Solution

Use this size="3"

<!DOCTYPE html>
<html>
<body>
<select id="gagaga" size="3">
    <option>A</option>
    <option>B</option>
    <option>C</option>
</select>
</body>
</html>

If the value of the size attribute is greater than 1, but lower than the total number of options in the list, the browser will add a scroll bar to indicate that there are more options to view.

OTHER TIPS

Do not use the multiple attribute instead set the size for it .

Quoted from w3schools:

The size attribute specifies the number of visible options in a drop-down list.

If the value of the size attribute is greater than 1, but lower than the total number of options in the list, the browser will add a scroll bar to indicate that there are more options to view.

You can use this: 

<html>
<body>
<select id="gagaga" size="3">
   <option>A</option>
   <option>B</option>
    <option>C</option>
</select>
</body>
</html>

you need to provide size to it:

<select id="gagaga" size='3'>
   <option>A</option>
   <option>B</option>
   <option>C</option>
</select>

and just remove the multiple there, It will enable you to select just one option in the list.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top