PDA

Click to See Complete Forum and Search --> : Newbie needs help

Aronya1
08-21-2003, 01:33 AM
Hi All,

I would like to have 3 lists, but allow the user to choose only one item. Similar to the operation of radio buttons, but I need the 3 seperate lists.

The 2nd part of the problem is that I need to validate the form these lists will be part of, forcing the user to make a choice from one of them.

Ideas? Suggestions? Free help? ;-)


Thanks,
Aronya1
Gollum
08-21-2003, 02:30 AM
try this...

<html>
<head>
<script>
function clearSel(id)
{
var oSel = document.getElementById(id);
for ( var i = 0; i < oSel.options.length; i++ )
{
oSel.options[i].selected = false;
}
}
function leaveOne(oSel)
{
var nSel = 0;
for ( var i = 0; i < oSel.options.length; i++ )
{
if ( nSel > 0 )
{
oSel.options[i].selected = false;
}
else
{
if ( oSel.options[i].selected ) nSel++;
}
}
}
</script>
</head>
<body>
Select one
<table cellspacing=10>
<tr>
<td><select id=s1 multiple onchange="clearSel('s2'); clearSel('s3'); leaveOne(this);">
<option>Tom
<option>Dick
<option>Harry
</select></td>
<td><select id=s2 multiple onchange="clearSel('s1'); clearSel('s3'); leaveOne(this);">
<option>Hewey
<option>Dewey
<option>Louie
</select></td>
<td><select id=s3 multiple onchange="clearSel('s1'); clearSel('s2'); leaveOne(this);">
<option>Winkin
<option>Blinkin
<option>Nod
</select></td>
</body>
</html>
Aronya1
08-21-2003, 02:50 AM
Gollum,

Many thanks for the quick response. It works great the way you have it, but I need drop-down lists. They will be getting fairly sizeable & won't work as multi-line text boxes.

I've tried to adapt your code to my situation, but it doesn't seem to work. Here's the original code, in case you want to start with that & take another shot at it:

<td><font face="Arial, Helvetica, sans-serif"> Schools&nbsp;
<select name="Schools" size="1" id="select4" style=background-color:"9EB0BE">
<option selected>---</option>
<option>Canyon View Elementary</option>
<option>Castle Park Elementary </option>
<option>Creekside Elementary</option>
<option>Miramar Ranch Elementary</option>
<option>Mt. Carmel High School </option>
<option>Poway High School</option>
<option>Rancho Bernardo High School</option>
<option>Rancho Bernardo Middle School </option>
<option>Scholl Creek Elementary </option>
<option>Valley Elementary</option>
<option>Westview High School </option>
</select>
</font></td>
</tr>
<tr>
<td><font face="Arial, Helvetica, sans-serif">Churches&nbsp;
<select name="Churches" size="1" id="select5" style=background-color:"9EB0BE">
<option selected>---</option>
<option>Mira Mesa Baptist Church</option>
<option>Mt. Olive Lutheran Church &amp; Preschool </option>
<option>UCSD Lutheran</option>
<option>Westminster Presbyterian Church &amp; Women's Club
</option>
</select>
</font></td>
</tr>
<tr>

<td><font face="Arial, Helvetica, sans-serif">Other Groups&nbsp;
<select name="Other" size="1" id="select6" style=background-color:"9EB0BE">
<option selected>---</option>
<option>Angels International</option>
<option>Buffalo Hunters Men's Group</option>
<option>Friends of County Animal Shelters</option>
<option>Friends of the Library, Poway</option>
<option>Herpotology Society</option>
<option>Laureate Alpha Kappa (Beta Sigma Phi)</option>
<option>Multicultural Family &amp; Life Skills</option>
<option>Pomerado Community Band</option>
<option>Poway Women's Club</option>
<option>Rotary Club of Poway</option>
<option>Rotary Club, San Diego North</option>
<option>Sacred Order Sanctuary</option>
<option>Weingart Poway Senior Center</option>
</select></td></tr>

Thanks again.
Aronya1
Gollum
08-21-2003, 03:22 AM
Even easier...

<script>
function clearSel(id)
{
var oSel = document.getElementById(id);
oSel.selectedIndex = 0;
}
</script>

...

<select name="Schools" size="1" id="select4" style=background-color:"9EB0BE" onchange="clearSel('select5'); clearSel('select6');">
Aronya1
08-21-2003, 11:19 AM
Thanks again. I'll wrestle with it later in the day & let you know how it works.
Aronya1
08-21-2003, 10:17 PM
Still no go, but thanks. Did it work for you?