PDA

View Full Version : Problem with validating select box



golfer
04-02-2003, 08:27 PM
I have a dynamically generated form (from a database) which lists out skill sets in select drop-downs grouped by category.

The user can select one or more skill sets from any of the select boxes.

Here is a sample of what it looks like in code.

Category 1
<select name="SubCatID" multiple>
<option value="1">subcat 1
<option value="2">subcat 2
<option value="3">subcat 3
</select>

Category 2
<select name="SubCatID" multiple>
<option value="4">subcat 4
<option value="5">subcat 5
</select>

Notice that the "name" of each select is the same and that the value of each option is never duplicated in the different drop-downs.

My problem is that the user must choose at least ONE skill set. The code I am using is great if you have only 1 select, but it doesn't seem to be working if you have more than one select with the same name.

Here is my code:

for (i=0; i<=(SkillListLen - 1); i++)
{
if (form.SubCatID[i].selected)
{
SkillSelectProceed = 1;
break;
}
}
if (SkillSelectProceed == 0)
{
submitform = false;
manfields += "You must select at least one skill or expertise.\n";
}

The error I am getting is that form.SubCatID is not defined.

What do I have to change to either my form or the javascript validation to get this to work?

Thanks in advance.

Cheryl

HairyTeeth
04-02-2003, 10:32 PM
try this:


<html>
<head>
<title>Untitled</title>
<script type="text/jav&#97;script" language="jav&#97;script">
<!--;
function validate(form){
var f=form.subCatID;
if(f[0].value=="" && f[1].value ==""){
alert("Please select at least one skill or expertise")
return false;
}
return true;
}
//-->
</script>
</head>
<body>
<form action="jav&#97;script: alert('Success!')" method="post"
onsubmit="return validate(this)">
<select name="subCatID" multiple="multiple">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

<select name="subCatID" multiple="multiple">
<option value="4">4</option>
<option value="5">5</option>
</select>
<input type="submit" value="Submit" />

</form>
</body>
</html>

cheesebagpipe
04-03-2003, 12:02 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>untitled</title>
<script type="text/javascript" language="javascript">

function chkSelects(selGrp) {
var oSelect, oOption, i = 0, j;
while (oSelect = selGrp[i++]) {
j = 0;
while (oOption = oSelect.options[j++]) if (oOption.selected) return true;
}
alert('You must select at least one skill or expertise!');
selGrp[0].focus();
return false;
}

</script>
</head>
<body>
<form onsubmit="return chkSelects(SubCatID)">
Category 1
<select name="SubCatID" multiple="multiple">
<option value="1">subcat 1
<option value="2">subcat 2
<option value="3">subcat 3
</select>

Category 2
<select name="SubCatID" multiple="multiple">
<option value="4">subcat 4
<option value="5">subcat 5
</select>

Category 3
<select name="SubCatID" multiple="multiple">
<option value="6">subcat 6
<option value="7">subcat 7
<option value="8">subcat 8
</select>

Category 4
<select name="SubCatID" multiple="multiple">
<option value="9">subcat 9
<option value="10">subcat 10
</select>

<input type="submit" value="DONE">
</form>
</body>
</html>

golfer
04-03-2003, 03:14 PM
That worked great! After a little manipulation to add this snippet to the rest of my validation for the form, my client is very happy.

Thank you thank you.

Cheryl