2

I have dropdown with more than 100 option with default 20 option is shown for remaining we need to scroll.

I need to decrease the option as 10 instead of 20. I have used size parameter in select tag it display like below

dropown

I need display like dropdown can any one help me to fix this problem.

Thanks,

vinox
  • 401
  • 10
  • 22
  • Do you have any code? –  Nov 20 '13 at 11:39
  • possible duplicate of [How can I limit the visible options in an HTML – Prashanth Nov 20 '13 at 11:42
  • To get to appear as a drop down you cant use the size i don't think –  Nov 20 '13 at 11:52
  • http://stackoverflow.com/questions/14778992/how-to-limit-display-or-height-of-a-select-html-tag, http://stackoverflow.com/questions/8530173/html-select-limit-number-of-options-visible see this link. – Vipul Vaghasiya Nov 20 '13 at 12:03

3 Answers3

1

You can use size property of select to limit the visible elements

<select size="10">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

If the control is presented as a scrolled list box, this attribute represents the number of rows in the list that should be visible at one time. Browsers are not required to present a select elements as a scrolled list box. The default value is 0, Reference.

Adil
  • 146,340
  • 25
  • 209
  • 204
1

Check this

<select name="numbers" size="5">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
</select>

http://jsfiddle.net/cSSjF/

Prashanth
  • 1,294
  • 3
  • 13
  • 30
0

Having a size option for an select element means it will show only the number of options you put in size property.

For displaying only 20 you can use css tricks.

Give the height to the dropdownlist and then make it as much height as you can able to show the options you want.

Hope this helps.

nrsharma
  • 2,532
  • 3
  • 20
  • 36