/    Sign up×
Community /Pin to ProfileBookmark

Submit Form only if Sum >= 2

[B]Description of my page:[/B]
I have a form with a number of dropdown menus.
The visitor can freely select and combine the numbers of those dropdown menus. For example he can select ‘1’ in the first dropdownd menu and ‘3’ in the second one and ‘0’ in the third. Just as he wishes. After the selection he pushes a button that submits the values to a cgi script.

[B]The problem:[/B]
Only if the sum of all dropdown menus is 2 or greater, then it is to
submit the form to the cgi script. Otherwise an error page should tell
him to revise his selection.

[B]The current Source Code:[/B]
<FORM METHOD=”post” ACTION=”http://www.domain.com/cgi-bin/file.cgi“>

<!– Dropdown Menu 1 –>
<select size=”1″ NAME=”object1″>
<option value=””>0</option>
<option value=”1″>1</option>
<option value=”2″>2</option>
<option value=”3″>3</option>

<!– Dropdown Menu 2 –>
<select size=”1″ NAME=”object2″>
<option value=””>0</option>
<option value=”1″>1</option>
<option value=”2″>2</option>
<option value=”3″>3</option>

<!– Dropdown Menu 3 –>
<select size=”1″ NAME=”object3″>
<option value=””>0</option>
<option value=”1″>1</option>
<option value=”2″>2</option>
<option value=”3″>3</option>

<!– BUTTON to submit the form to the cgi script –>
<INPUT TYPE=”image” NAME=”process_data” src=”http://www.domain.com/images/image.gif“>

</FORM>

to post a comment
JavaScript

3 Comments(s)

Copy linkTweet thisAlerts:
@phpnoviceMar 20.2006 — Add the following to your FORM tag:

onsubmit="return validateForm(this)"

Then, when you write that function, you'll want to convert the SELECT OPTION values from text to numeric values before adding them together. If you don't then they will just be concatenated as string values -- i.e., as "111" instead of 3. Lastly, at the end of your function, be sure to include this statement:

return true;
Copy linkTweet thisAlerts:
@azuremainauthorMar 20.2006 — Thanks for your help. Any way that you could give me that function?
Copy linkTweet thisAlerts:
@OverkillMar 20.2006 — The code:
&lt;html&gt;
&lt;head&gt;
&lt;script type="text/javascript"&gt;&lt;!--
[color=blue]function validate(_frm)
{
var ob1 = _frm.object1[_frm.object1.selectedIndex].value;
var ob2 = _frm.object2[_frm.object2.selectedIndex].value;
var ob3 = _frm.object3[_frm.object3.selectedIndex].value;

<i> </i> if((parseInt(ob1) + parseInt(ob2) + parseInt(ob3)) &gt;= 2 )
<i> </i> return true;

<i> </i> alert("the sum must be 2 &gt;=");
<i> </i> return false;
<i> </i> }[/color]
<i> </i>//--&gt;&lt;/script&gt;
&lt;/head&gt;

&lt;body&gt;

<i> </i>&lt;FORM METHOD="post" [color=blue]onsubmit="return validate(this);"[/color] ACTION="http://www.domain.com/cgi-bin/file.cgi"&gt;

<i> </i>&lt;!-- Dropdown Menu 1 --&gt;
<i> </i>&lt;select size="1" NAME="object1"&gt;
<i> </i>&lt;option value=""&gt;0&lt;/option&gt;
<i> </i>&lt;option value="1"&gt;1&lt;/option&gt;
<i> </i>&lt;option value="2"&gt;2&lt;/option&gt;
<i> </i>&lt;option value="3"&gt;3&lt;/option&gt;
<i> </i>&lt;/select&gt;

<i> </i>&lt;!-- Dropdown Menu 2 --&gt;
<i> </i>&lt;select size="1" NAME="object2"&gt;
<i> </i>&lt;option value=""&gt;0&lt;/option&gt;
<i> </i>&lt;option value="1"&gt;1&lt;/option&gt;
<i> </i>&lt;option value="2"&gt;2&lt;/option&gt;
<i> </i>&lt;option value="3"&gt;3&lt;/option&gt;
<i> </i>&lt;/select&gt;

<i> </i>&lt;!-- Dropdown Menu 3 --&gt;
<i> </i>&lt;select size="1" NAME="object3"&gt;
<i> </i>&lt;option value=""&gt;0&lt;/option&gt;
<i> </i>&lt;option value="1"&gt;1&lt;/option&gt;
<i> </i>&lt;option value="2"&gt;2&lt;/option&gt;
<i> </i>&lt;option value="3"&gt;3&lt;/option&gt;
<i> </i>&lt;/select&gt;

<i> </i>&lt;!-- BUTTON to submit the form to the cgi script --&gt;
<i> </i>&lt;INPUT TYPE="image" NAME="process_data" src="http://www.domain.com/images/image.gif"&gt;

<i> </i>&lt;/FORM&gt;

&lt;/body&gt;
&lt;/html&gt;


The code highlighted:
[b][color=#0000FF]&lt;html&gt;[/color][/b]
[b][color=#0000FF]&lt;head&gt;[/color][/b]
[b][color=#0000FF]&lt;script[/color][/b] [color=#009900]type[/color][color=#990000]=[/color][color=#FF0000]"text/javascript"[/color][b][color=#0000FF]&gt;[/color][/b][i][color=#9A1900]&lt;!--[/color][/i]
[i][color=#9A1900] function validate(_frm)[/color][/i]
[i][color=#9A1900] {[/color][/i]
[i][color=#9A1900] var ob1 = _frm.object1[_frm.object1.selectedIndex].value;[/color][/i]
[i][color=#9A1900] var ob2 = _frm.object2[_frm.object2.selectedIndex].value;[/color][/i]
[i][color=#9A1900] var ob3 = _frm.object3[_frm.object3.selectedIndex].value;[/color][/i]

[i][color=#9A1900] if((parseInt(ob1) + parseInt(ob2) + parseInt(ob3)) &gt;= 2 )[/color][/i]
[i][color=#9A1900] return true;[/color][/i]

[i][color=#9A1900] alert("the sum must be 2 &gt;=");[/color][/i]
[i][color=#9A1900] return false;[/color][/i]
[i][color=#9A1900] }[/color][/i]
[i][color=#9A1900] //--&gt;[/color][/i][b][color=#0000FF]&lt;/script&gt;[/color][/b]
[b][color=#0000FF]&lt;/head&gt;[/color][/b]

[b][color=#0000FF]&lt;body&gt;[/color][/b]

<i> </i>[b][color=#0000FF]&lt;FORM[/color][/b] [color=#009900]METHOD[/color][color=#990000]=[/color][color=#FF0000]"post"[/color] [color=#009900]onsubmit[/color][color=#990000]=[/color][color=#FF0000]"return validate(this);"[/color] [color=#009900]ACTION[/color][color=#990000]=[/color][color=#FF0000]"http://www.domain.com/cgi-bin/file.cgi"[/color][b][color=#0000FF]&gt;[/color][/b]

<i> </i>[i][color=#9A1900]&lt;!-- Dropdown Menu 1 --&gt;[/color][/i]
<i> </i>[b][color=#0000FF]&lt;select[/color][/b] [color=#009900]size[/color][color=#990000]=[/color][color=#FF0000]"1"[/color] [color=#009900]NAME[/color][color=#990000]=[/color][color=#FF0000]"object1"[/color][b][color=#0000FF]&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]""[/color][b][color=#0000FF]&gt;[/color][/b]0[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"1"[/color][b][color=#0000FF]&gt;[/color][/b]1[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"2"[/color][b][color=#0000FF]&gt;[/color][/b]2[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"3"[/color][b][color=#0000FF]&gt;[/color][/b]3[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;/select&gt;[/color][/b]

<i> </i>[i][color=#9A1900]&lt;!-- Dropdown Menu 2 --&gt;[/color][/i]
<i> </i>[b][color=#0000FF]&lt;select[/color][/b] [color=#009900]size[/color][color=#990000]=[/color][color=#FF0000]"1"[/color] [color=#009900]NAME[/color][color=#990000]=[/color][color=#FF0000]"object2"[/color][b][color=#0000FF]&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]""[/color][b][color=#0000FF]&gt;[/color][/b]0[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"1"[/color][b][color=#0000FF]&gt;[/color][/b]1[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"2"[/color][b][color=#0000FF]&gt;[/color][/b]2[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"3"[/color][b][color=#0000FF]&gt;[/color][/b]3[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;/select&gt;[/color][/b]

<i> </i>[i][color=#9A1900]&lt;!-- Dropdown Menu 3 --&gt;[/color][/i]
<i> </i>[b][color=#0000FF]&lt;select[/color][/b] [color=#009900]size[/color][color=#990000]=[/color][color=#FF0000]"1"[/color] [color=#009900]NAME[/color][color=#990000]=[/color][color=#FF0000]"object3"[/color][b][color=#0000FF]&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]""[/color][b][color=#0000FF]&gt;[/color][/b]0[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"1"[/color][b][color=#0000FF]&gt;[/color][/b]1[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"2"[/color][b][color=#0000FF]&gt;[/color][/b]2[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;option[/color][/b] [color=#009900]value[/color][color=#990000]=[/color][color=#FF0000]"3"[/color][b][color=#0000FF]&gt;[/color][/b]3[b][color=#0000FF]&lt;/option&gt;[/color][/b]
<i> </i>[b][color=#0000FF]&lt;/select&gt;[/color][/b]

<i> </i>[i][color=#9A1900]&lt;!-- BUTTON to submit the form to the cgi script --&gt;[/color][/i]
<i> </i>[b][color=#0000FF]&lt;INPUT[/color][/b] [color=#009900]TYPE[/color][color=#990000]=[/color][color=#FF0000]"image"[/color] [color=#009900]NAME[/color][color=#990000]=[/color][color=#FF0000]"process_data"[/color] [color=#009900]src[/color][color=#990000]=[/color][color=#FF0000]"http://www.domain.com/images/image.gif"[/color][b][color=#0000FF]&gt;[/color][/b]

<i> </i>[b][color=#0000FF]&lt;/FORM&gt;[/color][/b]

[b][color=#0000FF]&lt;/body&gt;[/color][/b]
[b][color=#0000FF]&lt;/html&gt;[/color][/b]
×

Success!

Help @azuremain spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...