I've got a form with the following function on it that checks a text field named H_commence and I want to add validation for a checkbox too so that the checkbox named H_terms is checked before the form submitted. I've been going round in circles over this... does anyone have a solution at all please? Kind thanks in advance function checka(f) { if (document.proposal.H_commence.value == "") { alert("You have not answered all the questions. The ones you need to fill in are marked with a *."); document.proposal.H_commence.focus(); return false; } return true; } Code (markup):
Here is a sample code that will work for you. <script language="JavaScript" type="text/javascript"> function validate(){ if(form.iagree.checked == false){ alert("Will not work unless you ckeck the box."); return false; } else{ return true; } } </script> <form name="form" action="index.php" method="post" onSubmit="return validate();"> <input type="checkbox" name="iagree" /> <input type="submit" name="submit" value="go" /> </form> Code (markup):
Hi CliveRay, thanks That looks simple enough and I've tried to integrate that into my pages using the current onClick commands and another script I have in place, so where I used to have: onClick="return validata(this)" Code (markup): ...for my Submit button which opens the script function validata(f) { if (submitcount == 0){ submitcount++; if (checkcommence(f)) { return true; } else {agree submitcount=0; return false; } } else {return false;} } Code (markup): ...I now have the script: function validata(f) { if (submitcount == 0){ submitcount++; if (checkcommence(f)&&checkagree(f)) { return true; } else { submitcount=0; return false; } } else {return false;} } Code (markup): ...to process the checkbox too. And my validation script now says... var submitcount=0; function checkcommence(f) { if (document.proposal.H_commence.value == "") { alert("You need to enter the date you wish your cover to commence from."); document.proposal.H_commence.focus(); return false; } else{ return true; } } function checkagree(f) { if (document.proposal.iagree.checked == false) { alert("You need to tick the box to indicate that you have read and agree to the terms & conditions."); return false; } else{ return true; } } Code (markup): Trouble is that now it brings up the alert for not entering a value for H_commence ("You need to enter the date you wish your cover to commence from.") and on hitting OK on the alert box just goes straight on to the next page and not back to the form
Sure thing, CliveRay, thanks for your time on this The form is the 6th and final in a series of ASP forms and it's just this JavaScript validation that's holding me up... So here's the HTML/ASP with a couple of external js calls and one embedded in the head... <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>-</title> <META name="keywords" CONTENT=""> <META name="description" CONTENT=""> <META name="robots" CONTENT="noindex,follow"> <META name="language" CONTENT="English"> <META name="rating" CONTENT="Global"> <META name="revisit-after" CONTENT="30 days"> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link rel="stylesheet" href="/styles/jw.css" type="text/css"> <script language="JavaScript" type="text/javascript" src="jwscript.js"></script> <script language="JavaScript1.2" type="text/javascript" src="fw_menu.js"></script> <script language="JavaScript1.2" type="text/javascript" src="proposal9.js"></script> <script language="JavaScript1.2" type="text/javascript"> <!-- function validata(f) { if (submitcount == 0){ submitcount++; if (checkcommence(f)&&checkagree(f)) { return true; } else { submitcount=0; return false; } } else {return false;} } //--> </script> </head> <body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0" bgcolor="#ffffff" onLoad="MM_preloadImages('img/pop/popupmenu_r2_c1_f2.gif','img/reddot_t.gif')"> <script language="JavaScript1.2" type="text/javascript">fwLoadMenus();</script> <img src="img/header_logo.gif" width="760" height="90" alt="-" title="-"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td class="header"> <table width="760" border="0" cellspacing="0" cellpadding="0"> <tr> <td> </td> </tr> <tr> <td> <table width="760" border="0" cellspacing="0" cellpadding="0"> <tr> <td><img src="img/title_left.gif" width="192" height="28" alt=""></td> <td bgcolor="#FFFFFF" width="416"> <h1>Request Cover</h1> </td> <td><img src="img/title_right.gif" width="152" height="28" alt=""></td> </tr> </table> </td> </tr> </table> </td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> <table border="0" cellpadding="0" cellspacing="0" width="760"> <tr> <td valign="top" rowspan="2"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="160" valign="top"> <table width="150" border="0" cellspacing="0" cellpadding="0" class="menu"> <tr onMouseOut="MM_swapImgRestore();this.style.background='#FFFFFF';this.style.color='#000000'" onMouseOver="MM_swapImage('bluedot1','','img/reddot_t.gif',1);this.style.background='#DCDCDC';this.style.cursor='hand';this.style.color='#000000'" onClick="location.href='index.htm'"> <td><img src="img/bluedot_t.gif" width="17" height="19" name="bluedot1" alt="*"></td> <td height="19">Home</td> </tr> <tr class="greydivide"> <td colspan="2"><img src="img/spacer.gif" alt=""></td> </tr> <tr onMouseOut="MM_swapImgRestore();FW_startTimeout();this.style.background='#FFFFFF';this.style.color='#000000'" onMouseOver="window.FW_showMenu(window.fw_menu_0,150,137);MM_swapImage('popupmenu_r2_c1','','img/pop/popupmenu_r2_c1_f2.gif',1);MM_swapImage('bluedot2','','img/reddot_t.gif',1);this.style.background='#DCDCDC';this.style.cursor='hand';this.style.color='#000000'" onClick="location.href='overseas_insurance_expatriates.htm'"> <td><img src="img/bluedot_t.gif" width="17" height="19" name="bluedot2" alt="*"></td> <td height="19">Overseas Insurance</td> </tr> <tr class="greydivide"> <td colspan="2"><img src="img/spacer.gif" alt=""></td> </tr> <tr onMouseOut="MM_swapImgRestore();this.style.background='#FFFFFF';this.style.color='#000000'" onMouseOver="MM_swapImage('bluedot3','','img/reddot_t.gif',1);this.style.background='#DCDCDC';this.style.cursor='hand';this.style.color='#000000'" onClick="location.href='commercial_insurance.htm'"> <td><img src="img/bluedot_t.gif" width="17" height="19" name="bluedot3" alt="*"></td> <td height="19">Commercial Insurance</td> </tr> <tr class="greydivide"> <td colspan="2"><img src="img/spacer.gif" alt=""></td> </tr> <tr onMouseOut="MM_swapImgRestore();this.style.background='#FFFFFF';this.style.color='#000000'" onMouseOver="MM_swapImage('bluedot4','','img/reddot_t.gif',1);this.style.background='#DCDCDC';this.style.cursor='hand';this.style.color='#000000'" onClick="location.href='personal_insurance.htm'"> <td><img src="img/bluedot_t.gif" width="17" height="19" name="bluedot4" alt="*"></td> <td height="19">Personal Insurance</td> </tr> <tr class="greydivide"> <td colspan="2"><img src="img/spacer.gif" alt=""></td> </tr> <tr onMouseOut="MM_swapImgRestore();this.style.background='#FFFFFF';this.style.color='#000000'" onMouseOver="MM_swapImage('bluedot5','','img/reddot_t.gif',1);this.style.background='#DCDCDC';this.style.cursor='hand';this.style.color='#000000'" onClick="location.href='financial_services.htm'"> <td><img src="img/bluedot_t.gif" width="17" height="19" name="bluedot5" alt="*"></td> <td height="19">Financial Services</td> </tr> <tr class="greydivide"> <td colspan="2"><img src="img/spacer.gif" alt=""></td> </tr> <tr onMouseOut="MM_swapImgRestore();this.style.background='#FFFFFF';this.style.color='#000000'" onMouseOver="MM_swapImage('bluedot6','','img/reddot_t.gif',1);this.style.background='#DCDCDC';this.style.cursor='hand';this.style.color='#000000'" onClick="location.href='contact_us.htm'"> <td><img src="img/bluedot_t.gif" width="17" height="19" name="bluedot6" alt="*"></td> <td height="19">Contact Us</td> </tr> <tr class="greydivide"> <td colspan="2"><img src="img/spacer.gif" alt=""></td> </tr> <tr onMouseOut="MM_swapImgRestore();this.style.background='#FFFFFF';this.style.color='#000000'" onMouseOver="MM_swapImage('bluedot7','','img/reddot_t.gif',1);this.style.background='#DCDCDC';this.style.cursor='hand';this.style.color='#000000'" onClick="location.href='enquiry_form.htm'"> <td><img src="img/bluedot_t.gif" width="17" height="19" name="bluedot7" alt="*"></td> <td height="19">Enquiry Form</td> </tr> </table></td> <td width="600" valign="top"> <table width="600" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="470" valign="top"> <blockquote> <FORM action="submit8.asp" method=post name=proposal> <table width=400 border=0 cellpadding=3 cellspacing=0 class="summary"> <% FOR Each item in Request.Form IF not item = "Submit" THEN Response.Write (" <input name='"&item&"' type='hidden' value='"&Request.Form(item)&"'>"&vbcrlf) NEXT %> <tr> <td colspan="2"><p><br><b>Final confirmation</b></td> </tr> <tr> <td colspan="2"> </td> </tr> <tr class=""> <td align=left>From what date do you require cover to commence?<font color="red">*</font></td> <td align=left valign=middle> <input type=text name="H_commence" value=""> </td> </tr> <tr> <td colspan="2"> </td> </tr> <tr> <td colspan="2">Subject to Underwriters acceptance of your proposal, cover will commence from the date shown in the above box or from date of receipt by us, whichever is the later. The premium will be advised to you via the medium selected (<%=request.form("A_contact")%>). You will have 14 days to remit the premium, failing receipt of which cover will lapse.</td> </tr> <tr> <td colspan="2"> </td> </tr> <tr> <td colspan="2">If you can confirm that all the statements contained in this proposal are true and complete and understand that they will form the basis for Underwriters consideration of your request for insurance then please:</td> </tr> <tr> <td align="center" colspan="2">You must agree to the <a href="terms-of-business.htm" target="_blank">terms & conditions</a> then tick this box<span style="color:red;">*</span>: <input type="checkbox" name="iagree" value="checkbox"></td> </tr> <tr> <td colspan="2" align="center">Submit your proposal</td> </tr> <tr> <td align=center colspan="2"><input name="Submit" type=submit onClick="validata(this)" value="Submit proposal"></td> </tr> </table> <img src="img/spacer.gif" width="130" height="1" alt=""> </form> </blockquote> <hr> <p class="footnote" align="center"><a href="index.htm">Home</a> | <a href="overseas_insurance_expatriates.htm">Overseas Insurance for Expatriates</a> | <a href="premium_illustration.htm">Premium Illustration</a> <br> <a href="summary.htm">Summary Of Cover</a> | <a href="request_cover.asp">Request Cover</a> | <a href="commercial_insurance.htm">Commercial Insurance<br> </a><a href="personal_insurance.htm">Personal Insurance</a> | <a href="financial_services.htm">Financial Services</a> | <a href="contact_us.htm">Contact Us</a> | <a href="enquiry_form.htm">Enquiry Form</a></p> <hr> <p> </p> </td> <td> </td> </tr> </table> </td> </tr> </table> </td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> </td> </tr> </table> </td> </tr> </table> </body> </html> Code (markup): And this is the content of the external script proposal9.js : var submitcount=0; function checkcommence(f) { if (document.proposal.H_commence.value == "") { alert("You need to enter the date you wish your cover to commence from."); document.proposal.H_commence.focus(); return false; } else{ return true; } } function checkagree(f) { if (document.proposal.iagree.checked == false) { alert("You need to tick the box to indicate that you have read and agree to the terms & conditions."); return false; } else{ return true; } } Code (markup): I've checked the other external scripts and they're not relevant to this issue...
Sorry for getting back late, I stepped out for a few hours, thanks for the codes. Looks like all you need to do is replace the submit button with the following: <input name="Submit" type=submit onClick="return validata(this)" value="Submit proposal"> Code (markup): and validation should start working fine. Hope you'll get your site up soon when this is sorted
No worries, CliveRay, I had to go pick up a car. Yes! And such a simple error too! That worked absolutely fine, thank you so much Can I get you a beer?