|
Book Section
General Section
Other Sites
|
JavaScript Workshop Forums
| View previous topic :: View next topic |
| Author |
Message |
koppel
Member
Joined: 22 Jul 2002
Posts: 41
|
 Posted: Mon Aug 05, 2002 1:24 am Post subject: Automatic multiple select |
 |
|
Hi,
 I wonder if there is a way to create a multiple select object that the user can select several options without pressing on SHIFT or CTRL keys.
What I meen is: every time the user chooses an option from the selectbox, the selected option is colored as selected, and all the previos selections are also colored as selected.
thank you,
Koppel. |
|
| Back to top |
|
 |
beetle
New member
Joined: 05 Aug 2002
Posts: 1
|
| Posted: Mon Aug 05, 2002 1:08 pm Post subject: |
|
|
Uhh, acutally you can, but it's a major PITA. With this method, you can't acutally de-select the last option left selected, because clicking on it does not invoke the onChange() event. | Code: | <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN" />
<HTML>
<HEAD>
<TITLE>Multiple Select Test</TITLE>
<META NAME="Generator" CONTENT="TextPad 4.4" />
<META NAME="Author" CONTENT="Peter Bailey" />
<META NAME="Keywords" CONTENT="" />
<META NAME="Description" CONTENT="" />
<META HTTP-EQUIV="Content-Script-Type" CONTENT="text/javascript" />
<META HTTP-EQUIV="Content-Style-Type" CONTENT="text/css" />
<script>
var selectedOptions = new Array();
function initArray(selectObj)
{
var l = selectObj.length;
for (var i=0; i<l; i++)
selectedOptions[i] = (selectObj.options[i].selected);
}
function modifySelect(selectObj)
{
var i = selectObj.selectedIndex;
selectedOptions[i] = !(selectedOptions[i]);
for (var j=0; j<document.forms[0].tester.length; j++)
selectObj.options[j].selected = selectedOptions[j];
return false;
}
</script>
<style>
body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; background-color: #FFFFFF; color: #000000; }
</style>
</HEAD>
<BODY onLoad="initArray(document.forms[0].tester);">
<form>
<select name="tester" multiple size="4" onChange="return modifySelect(this);">
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
<option value="Option 3">Option 3</option>
<option value="Option 4">Option 4</option>
</select>
</form>
</BODY>
</HTML> |
|
|
| Back to top |
|
|
|
|
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
|
Powered by phpBB © 2001, 2002 phpBB Group
|
|
(c) 1997-2002 Starling Technologies and
Michael Moncur. Portions (c) Sams Publishing.
|
|
|
FAQ
Search
Memberlist
Usergroups
Register
Profile
Log in to check your private messages
Log in
