Help with multiple actions within onClick ...?

**NGJ** · 05-12-2006, 02:48 PM

Hi,

I'm trying to get two validation checks to run at the point of SUBMITting a form. The problem is that whilst the first check takes place, the second check doesn't seem to happen. Once the first check has been satisfied, the form just submits - seemingly ignoring the second....

Can anyone please suggest a corretion to the following ?

onClick="return checkmail(this.form.____Email);return validateTheDate()"; value="Submit!">

To be honest, I've read about the 'return' thing and I still don't understand!

Thanks in advance,

N.

**NGJ** · 05-12-2006, 02:50 PM

Sorry, the full piece actually reads....

<input type="Submit" onClick="return checkmail(this.form.____Email);return validateTheDate();" value="Submit!">

**Twey** · 05-12-2006, 03:24 PM

Because as soon as you return, no further code executes. In this case, you should use:

onClick="return (checkmail(this.form.____Email) && validateTheDate());"

Well, actually, you should be checking this using onsubmit, not onclick.

**NGJ** · 05-12-2006, 03:46 PM

Thanks.... using 'onClick', it works up to validating the email address and then does the job of validating the date. However, if the date entered is a previous date, it gives me the alert message; I then click "OK"; it then just submits anyway without going back to let me adjust the date.

When changing it to onSubmit, it seems to ignore both validations and just submits.

Any thoughts?

Thanks (Domo!)

**Twey** · 05-12-2006, 05:26 PM

When changing it to onSubmit, it seems to ignore both validations and just submits.

onsubmit should be in the form tag, not that of the submit button.

Thanks (Dômo!)

どういたしまして (dô itasimasite)

**NGJ** · 05-12-2006, 06:14 PM

Hhhmm, not quite sure I'm doing this right...

I've tried shifting the onSubmit piece of code into the FORM tag - but still, it just seems to post straight away without any validation at all.

Onegaishimasu, could you give me some example code to demonstrate how you would implement this? "Misete kudasai!"

**mwinter** · 05-12-2006, 06:32 PM

Originally Posted by NGJ

[...] it just seems to post straight away without any validation at all.

Onegaishimasu, could you give me some example code to demonstrate how you would implement this?

HTML Code:

<form action="..." onsubmit="return checkmail(this.form.elements.____Email) && validateTheDate();">
  <!-- ... -->
    <input type="submit" value="Submit!">
  <!-- ... -->
</form>

If you still have problems, then you need to post a link to a minimal test case as the problem will be unrelated to the intrinsic event listener.

Mike

**NGJ** · 05-12-2006, 07:18 PM

Still not doing it I'm afraid...

Here's an abridged version of the code... I've taken out some of the CSS, the FORM elements and some of the credit notes - just to shrink it down a bit.

Can you help please?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Request for Service</title>

<script type="text/javascript" src="calendarDateInput.js">
</script>

<script type="text/javascript">

/***********************************************
* Disable "Enter" key in Form script- By Nurul Fadilah(nurul@REMOVETHISvolmedia.com)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

function handleEnter (field, event) {
var keyCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;
if (keyCode == 13) {
var i;
for (i = 0; i < field.form.elements.length; i++)
if (field == field.form.elements[i])
break;
i = (i + 1) % field.form.elements.length;
field.form.elements[i].focus();
return false;
}
else
return true;
}

</script>

<style type="text/css">


</style>

</head>

<body BGCOLOR=#ffffff TEXT=#333333 LINK="#0000CC" VLINK=#FF6666>

<script type="text/javascript">
function validateTheDate() {
var Today = new Date();
if (Response_Requested_By_Object.picked.date < Today) alert('Cannot select a date in the past.');
else if (Response_Requested_By_Object.picked.yearValue > 2020) alert('Cannot select dates beyond 2020.');
}
</script>

<script type="text/javascript">
var copying = false;

function copy(formNum, fromName, toName) {
if(!copying) return;
var from = document.forms[formNum].elements[fromName],
to = document.forms[formNum].elements[toName];
to.value = from.value;
window.setTimeout("beginCopy('" + formNum + "', '" + fromName + "', '" + toName + "')", 300);
}

function beginCopy(formNum, fromName, toName) {
copying = true;
copy(formNum, fromName, toName);
}

function endCopy() {
copying = false;
}
</script>

<script type="text/javascript">

/***********************************************
* Email Validation script- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var emailfilter=/^\w+[\+\.\w-]*@([\w-]+\.)*\w+[\w-]*\.([a-z]{2,4}|\d+)$/i

function checkmail(e){
var returnval=emailfilter.test(e.value)
if (returnval==false){
alert("Please enter a valid email address.")
e.select()
}
return returnval
}

</script>



<DIV style="position:absolute; left:20px; top:150px; z-index:10"; align="left" align="top">

<form name="formname" method="post" action="/lib/common/mailing.asp" onSubmit="return checkmail(this.form.____Email) && validateTheDate();">

<input type="hidden" name="mailto" value="mytestemail@place.co.uk">
<input type="hidden" name="mailcc" value="email_copy">
<input type="hidden" name="mailsubject" value="form">
<input type="hidden" name="htmloutput" value="yes">
<input type="hidden" name="orderby" value="____Email,Response_Requested_By">

<input type="hidden" name="senttext" value="<h1>Thank you! Your Request has been submitted.</h1>">

<table width="700" border="2" cellspacing="2" cellpadding="2">
<tr align="center">
<td colspan="3" class="title">Request for Service</td>
</tr>
<tr align="center">
<td colspan="3" class="sub">*To be completed by the requestor:</td>
</tr>

.... more ....

<tr>
<td class="text" align="center">E-Mail</td>
<td class="text"><input type="text" value="@mailaddress.com" onkeypress="return handleEnter(this, event)" onkeydown="beginCopy(0, this.name, 'mailcc');" onkeyup="endCopy();" class="memorize" name="____Email" size="40"></td>
</tr>

.... more ...

<tr>
<td colspan="2" align="right" class="maintxt">Response Requested By</td>
<td class="text"><script>DateInput('Response_Requested_By',true)</script>
</td>
</div>

</table>

 <input type="Submit" value="Submit!">
  <input type="reset" value="Clear All">
<br>

</div>
</form>

</body>
</html>

Thanks again in advance,

N.

Thread: Help with multiple actions within onClick ...?

Thread Tools

Search Thread

Help with multiple actions within onClick ...?

Bookmarks

Bookmarks

Posting Permissions