jquery - jQuery - dynamically switch Select Menu to Multiple

Question

I have a normal select menu with a few options. I'd like to use jquery to change it to have multiple="multiple". I intend to use a checkbox to toggle it.

<input type="checkbox" id="toggle"> Toggle Select
<br>
<select name="targets" id="targets">
<option value="0">-----Select a Target----</option>
<option value="1">Target 1</option>
<option value="2">Target 2</option>
<option value="3">Target 3</option>
</select>

<script language="javascript" type="text/javascript">
$(document).ready(function(){

    $("#toggle").on('click',function(){
        if($(this).is(':checked')==true){ 
         $("#targets").attr('multiple',true).attr('height',90);
        }else{
         $("#targets").attr('multiple',false).attr('height',0);
        }
    });

});
</script>

The height seems to be ignored.
Can <select> menus toggle the multiple="multiple" attribute effectively?

Answer 1

You are toggling the multiples just fine. If you are really trying to change the height of a select box you need to use the attr size not height.

Check out the fiddle here: http://jsfiddle.net/R8A7g/

Just change the size attr in the JS to change the height around.