How to call a function from within a function, etc.? :-) 4

garymgordon · Aug 17, 2001

I have the two functions (as shown below).

So, my question is ...

What is the best way to have a FORM check both of these before processing the information to a perl script.

Can I have the onSubmit call both of the functions (one after the other) before it submits the information to a perl script ... and if so, ... how?

Or, ...

Can I combine the two together somehow?

Or, ...

Can I have one function ... call the other function (when it reached the end of the first one) ... to kind of link multiple functions together ... one after the other?

I could really use some good advice and help.

Thanks.
Gary

============

CODE:

<script type="text/javascript" language="javascript">

</script>

<script type="text/javascript" language="javascript">


</script>

Gary M. Gordon, LLC
webmaster@garymgordon.com
Certified Web Developer ::
Application Programmer

http://www.garymgordon.com/

mzongo · Aug 17, 2001

Just create another function called something like "validateAll" and in it, just have the 2 calls and call this new function from the OnSubmit.

So

function validateAll(blah...) {
return (validateCheckBoxes(blah,blah) && checkData());
}

Yeah? and OnSubmit="JavaScript:validateAll(blah...);"

That simple?

tleish · Aug 17, 2001

You can call them both in the onSubmit action, just seperate the functions with a semi-colon (

onSubmit="validateCheckBoxes(checkboxName, checkboxList); checkData()" - tleish

garymgordon · Aug 17, 2001

Please don't think I'm stupid, ... but

From what you saw ..

What would I need to put for the 'blah' ... as in:

function validateAll(blah...) {

I guess I was just a little confused.

Could I just have:

function validateAll() {
return (validateCheckBoxes(checkboxName, checkboxList) && checkData());
}

Or ... do I need to put something in the "validateAll" parenthesis?

Sorry again for my lack of knowledge on this.

But THANK YOU.

Gary

Gary M. Gordon, LLC
webmaster@garymgordon.com
Certified Web Developer ::
Application Programmer

http://www.garymgordon.com/

mzongo · Aug 17, 2001

no worries... go for the second suggestion - put a semi colon in - I always overcomplicate everything!! - listen to tleish. (and blah was just because I couldn't be bothered to type in the parameters you were using). Cheers.

garymgordon · Aug 17, 2001

tleish,

When I use:

onSubmit="validateCheckBoxes(checkboxName, checkboxList); checkData()"

It notifies me of any fields that didn't have information within them ... but it simply sends the information on - regardless. It doesn't stop. It just continues to send the form through its action.

How do I get it to 'check' and validate the form .. and not continue on ... unless all conditions are met?

Thanks,
Gary
Gary M. Gordon, LLC
webmaster@garymgordon.com
Certified Web Developer ::
Application Programmer

http://www.garymgordon.com/

mzongo · Aug 17, 2001

try putting a return in, so

onSubmit="return (validateCheckBoxes(checkboxName, checkboxList) && checkData());"

worth a try don't you think?

garymgordon · Aug 17, 2001

That did'nt seem to do it either.

Here's the full script. (So you can see what I am working with including the html form and submit information.)

<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> Validation Form - for Checkboxes, Radio Buttons, and Text Fields </title>

<script type="text/javascript" language="javascript">

</script>

<script type="text/javascript" language="javascript">


</script>

<style type="text/css">

</style>

</head>

<body>

<font face="arial" size="2">
This form will <b>first</b> check the text fields ... and return a message for each one that wasn't completed.<br>
<br>
<b>Next</b>, it will validate the 'checkboxes' and provide a separate reminder indicating that the user needs to check off at least ONE of the checkboxes in order
to submit the form.<br>
<br>

<form name="Form" method="post" action="/cgi-bin/FILENAME.cgi" onSubmit="return validateCheckBoxes('size', this.size)">

<table border="0">
<tr>
<td valign="top"><input type="checkbox" name="size" value="small"> Small<br>
<input type="checkbox" name="size" value="medium"> Medium<br>
<input type="checkbox" name="size" value="large"> Large<br>
<input type="checkbox" name="size" value="extra_large"> Extra Large<br>
</td>
</tr>
</table>

<br>
First Name: <input type="text" name="first_name" size="10" maxlength="25">   Last Name: <input type="text" name="last_name" size="15" maxlength="35"><br>
<br>
Email Address: <input type="text" name="email" size="25" maxlength="50"><br>
<br>
<div align="center">
<input type="submit" value="Submit" onClick="return checkData()"> <input type="reset" value="Reset">
</div>

</form>

</font>

</body>
</html>

Please let me know what you think.
Gary
Gary M. Gordon, LLC
webmaster@garymgordon.com
Certified Web Developer ::
Application Programmer

http://www.garymgordon.com/

tleish · Aug 17, 2001

Try this:

[COLOR=000080]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">[/color]

[COLOR=000080]<HTML>[/color]
[COLOR=000080]<HEAD>[/color]
[COLOR=000080]<TITLE>[/color]Validation Form - for Checkboxes, Radio Buttons, and Text Fields [COLOR=000080]</TITLE>[/color]

<script type="text/javascript" language="javascript">
<!--
function validateCheckBoxes(checkboxList){

var checkboxValue = null;
for (var i=0; i < checkboxList.length; i++) {
if (checkboxList

Code:

i

Code:

.checked) {
checkboxValue = checkboxList

Code:

i

Code:

.value;
break;
}
}

if (checkboxValue == null) {
alert("Please be sure to check off a minimum of at least ONE checkbox.");
return false;
}else
return true; // in operation would be "return true"

}

function checkData(){

var vError = "";
var vForm = document.Form;

if (vForm.first_name.value == ""){
vError += "Please enter your first name in the field titled: 'First Name'\n";
}

if (vForm.last_name.value == ""){
vError += "Please enter your last name in the field titled: 'Last Name'.\n"
}

if (vForm.email.value == ""){
vError += "Please enter your e-mail address in the field titled: 'E-mail Address'.";
}

if(vError == "")
return true;
else{
alert(vError);
return false;
}

}

//-->
</script>

[COLOR=000080]<style type="text/css">[/color]

[COLOR=000080]</style>[/color][/color]

[COLOR=000080]</HEAD>[/color]

[COLOR=000080]<BODY>[/color]

[COLOR=000080]<font face="arial" size="2">[/color]
This form will [COLOR=000080]<b>[/color]first[COLOR=000080]</b>[/color] check the text fields ... and return a message for each one that wasn't completed.[COLOR=000080]<br>[/color]
[COLOR=000080]<br>[/color]
[COLOR=000080]<b>[/color]Next[COLOR=000080]</b>[/color], it will validate the 'checkboxes' and provide a separate reminder indicating that the user needs to check off at least ONE of the checkboxes in order
to submit the form.[COLOR=000080]<br>[/color]
[COLOR=000080]<br>[/color]

[COLOR=000080][COLOR=FF8000]<form name="Form" method="post"
action="/cgi-bin/FILENAME.cgi"
onSubmit="return (validateCheckBoxes(this.size) && checkData())">[/color][/color]

[COLOR=008080]<table border="0">[/color]
[COLOR=008080]<tr>[/color]
[COLOR=008080]<td valign="top">[/color][COLOR=000080][COLOR=FF8000]<input type="checkbox" name="size" value="small">[/color][/color] Small[COLOR=000080]<br>[/color]
[COLOR=000080][COLOR=FF8000]<input type="checkbox" name="size" value="medium">[/color][/color] Medium[COLOR=000080]<br>[/color]
[COLOR=000080][COLOR=FF8000]<input type="checkbox" name="size" value="large">[/color][/color] Large[COLOR=000080]<br>[/color]
[COLOR=000080][COLOR=FF8000]<input type="checkbox" name="size" value="extra_large">[/color][/color] Extra Large[COLOR=000080]<br>[/color]
[COLOR=008080]</td>[/color]
[COLOR=008080]</tr>[/color]
[COLOR=008080]</table>[/color]

[COLOR=000080]<br>[/color]
First Name: [COLOR=000080][COLOR=FF8000]<input type="text" name="first_name" size="10" maxlength="25">[/color][/color] Last Name: [COLOR=000080][COLOR=FF8000]<input type="text" name="last_name" size="15" maxlength="35">[/color][/color][COLOR=000080]<br>[/color]
[COLOR=000080]<br>[/color]
Email Address: [COLOR=000080][COLOR=FF8000]<input type="text" name="email" size="25" maxlength="50">[/color][/color][COLOR=000080]<br>[/color]
[COLOR=000080]<br>[/color]
[COLOR=000080]<div align="center">[/color]
[COLOR=000080][COLOR=FF8000]<input type="submit" value="Submit">[/color][/color] [COLOR=000080][COLOR=FF8000]<input type="reset" value="Reset">[/color][/color]
[COLOR=000080]</div>[/color]

[COLOR=000080][COLOR=FF8000]</form>[/color][/color]

[COLOR=000080]</font>[/color]

[COLOR=000080]</BODY>[/color]
[COLOR=000080]</HTML>[/color] - tleish

garymgordon · Aug 17, 2001

tleish,

Ok. That worked!! You're a genius!!!

But .. if you wouldn't mind ...

Could you explain exactly what you need to change or modify in comparison to what was there originally?

What magic did you do?

)

Thanks again,
Gary
Gary M. Gordon, LLC
webmaster@garymgordon.com
Certified Web Developer ::
Application Programmer

http://www.garymgordon.com/

tleish · Aug 17, 2001

Here's the list of changes:

Overall:[ol][li]Combined to the Javascript Functions into one Javascript Tag[/li]
[/ol]function validateCheckBoxes(checkboxList)[ol][li]Changed validateCheckBoxes(checkboxName, checkboxList) to validateCheckBoxes(checkboxList) since checkboxName wasn't being used.[/li]
[li]checkboxList is an array, so checkboxList.length will return the number of checkboxes with the name specified. In order to check if a specific checkbox is checked, you need to access it via array (ex checkboxList

Code:

[1]

). So in the loop I changed if (checkboxList.checked) to if (checkboxList

Code:

[i]

.checked). The i is comming from the loop.[/li]
[li]Changed checkboxValue = checkboxList.value; to checkboxValue = checkboxList

Code:

[i]

.value; for the same reason as the previous item. You really could just make this checkboxValue = 1[/li]
[li]Added return true to the function so that it will return either false or true[/li]
[/ol]function checkData()[ol][li]Replaced var correct = true; with var vError = ""; as a string that will store all the errors. At the end of the function, if vError is still empty, there's no errors.[/li]
[li]Added var vForm = document.Form; so that I could type vForm instead of document.Form in each of the if statements. It's just for convenience, and not necessary[/li]
[li]Changed all document.Form to vForm in the if() statements[/li]
[li]Removed correct = false; from all the if() statements[/li]
[li]Changed all alert("Text&quot to vError += "Text\n". The += is a shortcut for writing vError = vError + "Text\n". Then \n at then end of each string makes a carriage return so that the nect string (or error in this case) will be on new line in the final alert box.[/li]
[li]Changed return correct; to
if(vError == "&quot
return true;
else{
alert(vError);
return false;
If the vError is "", that means there were no errors (return true), else alert the list of error (alert(vError)) and return false.
[/li]
[/ol]Form:[ol][li]Removed onClick="return checkData()" from the submit button[/li]
[li]Changed onSubmit="return validateCheckBoxes('size', this.size)" to onSubmit="return (validateCheckBoxes(this.size) && checkData())". What this does is it first evaluates the 2 functions. if both functions resolve to true (true && true) then the will be onSubmit="return (true) and the form will submit. If 1 or both of the functions returns false (true && false) then the will be onSubmit="return (false) and the form will NOT submit"[/li][/ol]Does that explain it? - tleish

garymgordon · Aug 17, 2001

THANK YOU ... Oh Tek-Tip "Master of Javascript!"

Sincerely,
Gary

Thank you very, very much!
Gary M. Gordon, LLC
webmaster@garymgordon.com
Certified Web Developer ::
Application Programmer

http://www.garymgordon.com/

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

How to call a function from within a function, etc.? :-) 4

garymgordon

Programmer

mzongo

Programmer

tleish

Programmer

garymgordon

Programmer

mzongo

Programmer

garymgordon

Programmer

mzongo

Programmer

garymgordon

Programmer

tleish

Programmer

garymgordon

Programmer

tleish

Programmer

garymgordon

Programmer

Similar threads

Part and Inventory Search

Sponsor