PDA

View Full Version : 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!:p

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&#244;mo!)どういたしまして (d&#244; 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
[...] 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?

<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">
<!--

a {
font-family: arial, impact, Helvetica, sans-serif;
font-size: 14px;
color: #0000ff;
text-decoration: none;
font-weight: bold;}

.maintxt {
font-family: arial, baskerville, impact, Helvetica, sans-serif;
font-size: 12px;
background-color: #ffff66;
color: #000000;
text-decoration: none;
font-weight: bold;}
-->

</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>

<!--############################### Start of Main Header -->


<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>


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

</div>
</form>

</body>
</html>



Thanks again in advance,

N.