How do I count and check drop-down box values

M

Mike

I have a form that contains four drop-down boxes, one box each for a specific
item (item1, item2, item3, item4). Each drop-down box has four choices (1, 2,
3, 4). So for each Item, the user can select how many of that item they want,
up to four. For example they can select a quantity of 2 for item1, 3 for
item2, 1 for item3 and 4 for item4. They then click submit.
All that works without a problem. What I want however, is to limit the TOTAL
number of items selected from all four items. They can select 1 through 4 in
each drop-down but I don't want the total number of items to exceed 14. So if
they selected 4 in all four boxes, I would need someway to count this and pop
up a message that says something like "you have exceeded the total items
allowed". I assume this count and validation would need to happen when they
click the Submit button.
How do I do this count and validation.
Thanks... Mike
 
M

MD Websunlimited

<select onchange="checkTotal(this.form)" >
<option vaue="1">1</option>
....
</select>

<script language="javascript" >

function checkTotal(theForm) {
var total = theForm.select1.options[theForm.select1.selectedIndex].value;
total += theForm.select2.options[theForm.select2.selectedIndex].value;
total += theForm.select3.options[theForm.select3.selectedIndex].value;
total += theForm.select4.options[theForm.select4.selectedIndex].value;
total > 14 ? alert("The total number of items selected may not exceed 14"); : theForm.select1.focus();
}
 
M

MD Websunlimited

<select onchange="checkTotal(this.form)" >
<option vaue="1">1</option>
....
</select>

<script language="javascript" >

function checkTotal(theForm) {
var total = theForm.select1.options[theForm.select1.selectedIndex].value;
total += theForm.select2.options[theForm.select2.selectedIndex].value;
total += theForm.select3.options[theForm.select3.selectedIndex].value;
total += theForm.select4.options[theForm.select4.selectedIndex].value;
total > 14 ? alert("The total number of items selected may not exceed 14"); : theForm.select1.focus();
}

--
Mike -- FrontPage MVP '97-'02
http://www.websunlimited.com
Wish you could calculate form field totals? Well, you can with Form Calculator
http://www.websunlimited.com/order/Product/FormCalc/formcalc.htm
FrontPage Add-ins Since '97 2003 / 2002 / 2000 Compatible
 
M

Mike

Mike,
I have pasted my code below. The form works but it is not validating
(checking for the total>14). What am I doing wrong?

Thanks.... Mike

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script language="javascript">
function ValidateForm1()
{
var item1 = Form1.Item1;
var total = Form1.Item1.options[document.Form1.Item1.selectedIndex].value;
total += Form1.Item2.options[document.Form1.Item2.selectedIndex].value;
total += Form1.Item3.options[document.Form1.Item3.selectedIndex].value;
total += Form1.Item4.options[document.Form1.Item4.selectedIndex].value;
total > 14 ? alert("test"); : Form1.Item1.focus();
}
</script>
</head>

<body>

<!--<form method="POST" action="--WEBBOT-SELF--" name="Form1"
onSubmit="location.href='_derived/nortbots.htm';return false;"
webbot-onSubmit> -->
<form method="POST" action="--WEBBOT-SELF--" name="Form1" onSubmit="return
ValidateForm1();">
<!--webbot bot="SaveResults" U-File="_private/form_results.csv"
S-Format="TEXT/CSV" S-Label-Fields="TRUE" startspan --><input TYPE="hidden"
NAME="VTI-GROUP" VALUE="0"><!--webbot bot="SaveResults" i-checksum="43374"
endspan -->
<p>

<select size="1" name="Item1">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item2">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item3">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item4">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select></p>
<p><input type="submit" value="Submit" name="Submit"><input type="reset"
value="Reset" name="Reset"></p>
</form>

</body>

</html>

MD Websunlimited said:
<select onchange="checkTotal(this.form)" >
<option vaue="1">1</option>
....
</select>

<script language="javascript" >

function checkTotal(theForm) {
var total = theForm.select1.options[theForm.select1.selectedIndex].value;
total += theForm.select2.options[theForm.select2.selectedIndex].value;
total += theForm.select3.options[theForm.select3.selectedIndex].value;
total += theForm.select4.options[theForm.select4.selectedIndex].value;
total > 14 ? alert("The total number of items selected may not exceed 14"); : theForm.select1.focus();
}

--
Mike -- FrontPage MVP '97-'02
http://www.websunlimited.com
Wish you could calculate form field totals? Well, you can with Form Calculator
http://www.websunlimited.com/order/Product/FormCalc/formcalc.htm
FrontPage Add-ins Since '97 2003 / 2002 / 2000 Compatible

Mike said:
I have a form that contains four drop-down boxes, one box each for a specific
item (item1, item2, item3, item4). Each drop-down box has four choices (1, 2,
3, 4). So for each Item, the user can select how many of that item they want,
up to four. For example they can select a quantity of 2 for item1, 3 for
item2, 1 for item3 and 4 for item4. They then click submit.
All that works without a problem. What I want however, is to limit the TOTAL
number of items selected from all four items. They can select 1 through 4 in
each drop-down but I don't want the total number of items to exceed 14. So if
they selected 4 in all four boxes, I would need someway to count this and pop
up a message that says something like "you have exceeded the total items
allowed". I assume this count and validation would need to happen when they
click the Submit button.
How do I do this count and validation.
Thanks... Mike
Click to expand...
Click to expand...
 
M

MD Websunlimited

There are three problems:

1. The line total > 14 ? alert("test"); : Form1.Item1.focus(); should be total > 14 ? alert("test") : Form1.Item1.focus();

2. JavaScript is case sensitive and you have onSubmit which should be onsubmit

3. I forgot to convert the value to an integer
Form1.Item1.options[document.Form1.Item1.selectedIndex].value should be
parseInt(Form1.Item1.options[document.Form1.Item1.selectedIndex].value);



--
Mike -- FrontPage MVP '97-'02
http://www.websunlimited.com
Create fast, better scaling link bars with CSS Menu Maker
http://www.websunlimited.com/order/Product/CssMenu/css_menu.htm
FrontPage Add-ins Since '97 2003 / 2002 / 2000 Compatible


Mike said:
Mike,
I have pasted my code below. The form works but it is not validating
(checking for the total>14). What am I doing wrong?

Thanks.... Mike

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script language="javascript">
function ValidateForm1()
{
var item1 = Form1.Item1;
var total = Form1.Item1.options[document.Form1.Item1.selectedIndex].value;
total += Form1.Item2.options[document.Form1.Item2.selectedIndex].value;
total += Form1.Item3.options[document.Form1.Item3.selectedIndex].value;
total += Form1.Item4.options[document.Form1.Item4.selectedIndex].value;
total > 14 ? alert("test"); : Form1.Item1.focus();
}
</script>
</head>

<body>

<!--<form method="POST" action="--WEBBOT-SELF--" name="Form1"
onSubmit="location.href='_derived/nortbots.htm';return false;"
webbot-onSubmit> -->
<form method="POST" action="--WEBBOT-SELF--" name="Form1" onSubmit="return
ValidateForm1();">
<!--webbot bot="SaveResults" U-File="_private/form_results.csv"
S-Format="TEXT/CSV" S-Label-Fields="TRUE" startspan --><input TYPE="hidden"
NAME="VTI-GROUP" VALUE="0"><!--webbot bot="SaveResults" i-checksum="43374"
endspan -->
<p>

<select size="1" name="Item1">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item2">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item3">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item4">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select></p>
<p><input type="submit" value="Submit" name="Submit"><input type="reset"
value="Reset" name="Reset"></p>
</form>

</body>

</html>

MD Websunlimited said:
<select onchange="checkTotal(this.form)" >
<option vaue="1">1</option>
....
</select>

<script language="javascript" >

function checkTotal(theForm) {
var total = theForm.select1.options[theForm.select1.selectedIndex].value;
total += theForm.select2.options[theForm.select2.selectedIndex].value;
total += theForm.select3.options[theForm.select3.selectedIndex].value;
total += theForm.select4.options[theForm.select4.selectedIndex].value;
total > 14 ? alert("The total number of items selected may not exceed 14"); : theForm.select1.focus();
}

--
Mike -- FrontPage MVP '97-'02
http://www.websunlimited.com
Wish you could calculate form field totals? Well, you can with Form Calculator
http://www.websunlimited.com/order/Product/FormCalc/formcalc.htm
FrontPage Add-ins Since '97 2003 / 2002 / 2000 Compatible

Mike said:
I have a form that contains four drop-down boxes, one box each for a specific
item (item1, item2, item3, item4). Each drop-down box has four choices (1, 2,
3, 4). So for each Item, the user can select how many of that item they want,
up to four. For example they can select a quantity of 2 for item1, 3 for
item2, 1 for item3 and 4 for item4. They then click submit.
All that works without a problem. What I want however, is to limit the TOTAL
number of items selected from all four items. They can select 1 through 4 in
each drop-down but I don't want the total number of items to exceed 14. So if
they selected 4 in all four boxes, I would need someway to count this and pop
up a message that says something like "you have exceeded the total items
allowed". I assume this count and validation would need to happen when they
click the Submit button.
How do I do this count and validation.
Thanks... Mike
Click to expand...
Click to expand...
Click to expand...
 
M

Mike

Mike,

Ok, we are almost there. The count and validation are working fine now. The
last problem to work through is this: when I select more than 14 items, it
pops up the alert like it should, but when I click OK in the alert window, it
takes me on to the confirmation page instead of back to the form. I have
pasted the corrected code below (just the javascript - the rest of the page
is unchanged except for correcting the case for onsubmit). Thanks... Mike

function ValidateForm1()
{
var item1 = Form1.Item1;
var total =
parseInt(Form1.Item1.options[document.Form1.Item1.selectedIndex].value);
total += parseInt(Form1.Item1.options[Form1.Item2.selectedIndex].value);
total += parseInt(Form1.Item1.options[Form1.Item3.selectedIndex].value);
total += parseInt(Form1.Item1.options[Form1.Item4.selectedIndex].value);
total > 14 ? alert("test") : Form1.Item1.focus();
}
</script>


MD Websunlimited said:
There are three problems:

1. The line total > 14 ? alert("test"); : Form1.Item1.focus(); should be total > 14 ? alert("test") : Form1.Item1.focus();

2. JavaScript is case sensitive and you have onSubmit which should be onsubmit

3. I forgot to convert the value to an integer
Form1.Item1.options[document.Form1.Item1.selectedIndex].value should be
parseInt(Form1.Item1.options[document.Form1.Item1.selectedIndex].value);



--
Mike -- FrontPage MVP '97-'02
http://www.websunlimited.com
Create fast, better scaling link bars with CSS Menu Maker
http://www.websunlimited.com/order/Product/CssMenu/css_menu.htm
FrontPage Add-ins Since '97 2003 / 2002 / 2000 Compatible


Mike said:
Mike,
I have pasted my code below. The form works but it is not validating
(checking for the total>14). What am I doing wrong?

Thanks.... Mike

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<script language="javascript">
function ValidateForm1()
{
var item1 = Form1.Item1;
var total = Form1.Item1.options[document.Form1.Item1.selectedIndex].value;
total += Form1.Item2.options[document.Form1.Item2.selectedIndex].value;
total += Form1.Item3.options[document.Form1.Item3.selectedIndex].value;
total += Form1.Item4.options[document.Form1.Item4.selectedIndex].value;
total > 14 ? alert("test"); : Form1.Item1.focus();
}
</script>
</head>

<body>

<!--<form method="POST" action="--WEBBOT-SELF--" name="Form1"
onSubmit="location.href='_derived/nortbots.htm';return false;"
webbot-onSubmit> -->
<form method="POST" action="--WEBBOT-SELF--" name="Form1" onSubmit="return
ValidateForm1();">
<!--webbot bot="SaveResults" U-File="_private/form_results.csv"
S-Format="TEXT/CSV" S-Label-Fields="TRUE" startspan --><input TYPE="hidden"
NAME="VTI-GROUP" VALUE="0"><!--webbot bot="SaveResults" i-checksum="43374"
endspan -->
<p>

<select size="1" name="Item1">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item2">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item3">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select>
<select size="1" name="Item4">
<option value="1">1 Set</option>
<option value="2">2 Sets</option>
<option value="3">3 Sets</option>
<option value="4">4 Sets</option>
</select></p>
<p><input type="submit" value="Submit" name="Submit"><input type="reset"
value="Reset" name="Reset"></p>
</form>

</body>

</html>

MD Websunlimited said:
<select onchange="checkTotal(this.form)" >
<option vaue="1">1</option>
....
</select>

<script language="javascript" >

function checkTotal(theForm) {
var total = theForm.select1.options[theForm.select1.selectedIndex].value;
total += theForm.select2.options[theForm.select2.selectedIndex].value;
total += theForm.select3.options[theForm.select3.selectedIndex].value;
total += theForm.select4.options[theForm.select4.selectedIndex].value;
total > 14 ? alert("The total number of items selected may not exceed 14"); : theForm.select1.focus();
}

--
Mike -- FrontPage MVP '97-'02
http://www.websunlimited.com
Wish you could calculate form field totals? Well, you can with Form Calculator
http://www.websunlimited.com/order/Product/FormCalc/formcalc.htm
FrontPage Add-ins Since '97 2003 / 2002 / 2000 Compatible

I have a form that contains four drop-down boxes, one box each for a specific
item (item1, item2, item3, item4). Each drop-down box has four choices (1, 2,
3, 4). So for each Item, the user can select how many of that item they want,
up to four. For example they can select a quantity of 2 for item1, 3 for
item2, 1 for item3 and 4 for item4. They then click submit.
All that works without a problem. What I want however, is to limit the TOTAL
number of items selected from all four items. They can select 1 through 4 in
each drop-down but I don't want the total number of items to exceed 14. So if
they selected 4 in all four boxes, I would need someway to count this and pop
up a message that says something like "you have exceeded the total items
allowed". I assume this count and validation would need to happen when they
click the Submit button.
How do I do this count and validation.
Thanks... Mike
Click to expand...
Click to expand...
Click to expand...
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Link a text box based on drop down box with four options MS Word 365 0
Drop down list control value in vba 2
Sum Values from different column 1
Need Help to Create Query 2
Need Help 1
Paragraph numbering in Word 1
how to populate a text box from make 2 linked drop down list 1
Problem converting tet to table 5

Top