Niraj Choubey Niraj Choubey - 6 months ago 38
Javascript Question

How to set height of ListBox to auto

I have a Html ListBox:

<select id="targetField" multiple="multiple" name="D1" style="width:200px;">
<option>INDIA</option>
<option>USA</option>
<option>UK</option>
<option>AUSTRALIA</option>
<option>RUSSIA</option>
<option>FRANCE</option>
<option>HOLLAND</option>
</select>


I need to set the height of this to auto i.e I do not want scrollbar to appear.

I tried
Height:auto;
But it is not working in IE.

How should I do this?

Answer

Set the size property to the number of items, like this:

<select id="targetField" multiple name="D1" style="width:200px;" size="7">

If you need to do it programmatically, you can set all <select> elements to their option length, like this:

$("select").attr("size", function() { return this.options.length; });

You can test it out here.

Comments