PDA

Click to See Complete Forum and Search --> : Dropdown menu to multiple select

johnt
04-22-2003, 02:55 PM
Is there a way of using Javascript to change a dropdown menu to a multiple select menu? That is, add 'multiple' to the select tag?
Jona
04-22-2003, 03:00 PM
<select size="4">
khalidali63
04-22-2003, 03:01 PM
this line of code should do it for you.

document.formName.selectBoxName.multiple="multiple";
Jona
04-22-2003, 03:02 PM
My bad... :rolleyes:
DrDaMour
04-22-2003, 03:31 PM
i also found that

document.formname.selectname.size = integer makes it a selecet box of integer size.
johnt
04-22-2003, 03:44 PM
Originally posted by khalidali63
this line of code should do it for you.

document.formName.selectBoxName.multiple="multiple";

Thanks, but I tested it using the code below and it doesn't seem to work - the menu remains a dropdown rather than a multiple select.

<html>

<head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<title>Test</title>
<script language="JavaScript">
document.george.peter.multiple="multiple";
</script>
</head>

<body bgcolor="#ffffff">
<form action="/nowhere/" method="get" name="george">
<select name="peter">
<option value="one">first</option>
<option value="two">second</option>
<option value="three">third</option>
</select>
</form>
</body>

</html>
Jona
04-22-2003, 03:47 PM
You have to put it in a function, or else you'll get an error.

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<title>Test</title>
<script language="JavaScript">
function multi(){
document.george.peter.multiple="multiple";
}
</script>
</head>

<body bgcolor="#ffffff" onload="multi()">
<form action="/nowhere/" method="get" name="george">
<select name="peter">
<option value="one">first</option>
<option value="two">second</option>
<option value="three">third</option>
</select>
</form>
</body>
</html>
khalidali63
04-22-2003, 03:52 PM
Well you needed to do it a bit different.check the code below.



<html>

<head>
<meta http-equiv="content-type" content="text/html;charset=ISO-8859-1">
<title>Test</title>
<script language="JavaScript">
function resetSelect(){
document.george.peter.multiple="multiple";
}
</script>
</head>

<body bgcolor="#ffffff">
<form action="/nowhere/" method="get" name="george">
<select name="peter">
<option value="one">first</option>
<option value="two">second</option>
<option value="three">third</option>
</select>
<input type="Button" onclick="resetSelect();" value="Allow Multiple Selections"/>
</form>
</body>

</html>


or you can call resetSelect() function in the onload event of body tag
johnt
04-23-2003, 03:56 AM
[QUOTE]Originally posted by khalidali63
[B]Well you needed to do it a bit different.check the code below.

Well this worked:

<script language="JavaScript">
function resetSelect(){
document.george.peter.size="3";
}
</script>
</head>

<body bgcolor="#ffffff" onload="resetSelect()">

... in the sense that it made three rows viewable, but this does not make a multiple select form.

Your suggestion which should achieve what I am after, as implemented below, does not appear to work (at least in my browser):

<script language="JavaScript">
function resetSelect(){
document.george.peter.multiple="multiple";
}
</script>
</head>

<body bgcolor="#ffffff" onload="resetSelect()">
DrDaMour
04-23-2003, 08:54 AM
my bad, got size and multiple confused. This worked for me though:

<HTML>
<HEAD>
<TITLE> New Document </TITLE>



</HEAD>

<BODY>
<form id="george">
<select id="peter">
<option value="dog">cat</option>
<option value="dog">cat</option>
<option value="dog">cat</option>
<option value="dog">cat</option>
</select>

<input type=button onclick="resetSelect()">

</form>
<script>
function resetSelect(){
document.forms.george.peter.multiple = true;
}
</script>
</BODY>
</HTML>
khalidali63
04-23-2003, 09:03 AM
Either I have no idea what you are after...
;)

or you are not implementing the suggestion properly..

Take a look at the link below,It does make a list box multiple select or single select on a clikc of a button,
if the function name that is usedin the onclick event of a the buttonis moved to onload event of the body tag it will make work then too.The code is tested with 2 browsers NS6+ and IE6+..
enjoy.

http://68.145.35.86/skills/javascripts/MakeListboxMultipleSelect.html

:D