php - Two forms HTML, validate only submitted form -
i have 2 forms on single page. 1 form particular page it's on , other side form on every page. have gotten validator work format error ridden fields; shows red boxes around fields incomplete. works on first form if submit second form, still format first form only. have taken out code first form, , second side form works perfectly. question how can validator check , submit form clicked? have made short test page illustrate problem.
<!doctype > <head> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.validate.js"></script> <script type="text/javascript" src="js/jquery.maskedinput.js"></script> <script type="text/javascript" src="js/mktsignup.js"></script> <link rel="stylesheet" type="text/css" media="screen" href="css/css.css"> </head> <body> <!-- when submit form appropriate red boxes shown around errored fields--> <form id="requestappointment" method="post" type="actionform" action="." name="requestfreeconsultation"> <label for="name">your name</label><br> <input type="text" class="stdformfieldsml defaultinvalid" value="first name" name="firstname" id="firstname" onclick="if(this.value=='first name')this.value='';" /> <input type="submit" name="firstform" value="submit" /> </form> <!-- form when hit submit causes red boxes around previous form's incomplete fields--> <form name="freeconsultationwidget" action="thank-you.php" method="post"> <label for="namemini">your name</label><br> <input type="text" class="stdformfieldsml defaultinvalid" value="first name" name="firstnamemini" id="firstnamemini" onclick="if(this.value=='first name')this.value='';" /> <input type="image" name="secondform" value="submit1"/> </form> </body> </html> as has suggested going post js file. (i not posting standard jquery validate file.)
$(document).ready(function(){ jquery.validator.addmethod("password", function( value, element ) { var result = this.optional(element) || value.length >= 6 && /\d/.test(value) && /[a-z]/i.test(value); if (!result) { element.value = ""; var validator = this; settimeout(function() { validator.blockfocuscleanup = true; element.focus(); validator.blockfocuscleanup = false; }, 1); } return result; }, "your password must @ least 6 characters long , contain @ least 1 number , 1 character."); // custom method making default value companyurl ("http://") invalid, without displaying "invalid url" message jquery.validator.addmethod("defaultinvalid", function(value, element) { return value != element.defaultvalue; }, ""); jquery.validator.addmethod("billingrequired", function(value, element) { if ($("#bill_to_co").is(":checked")) return $(element).parents(".subtable").length; return !this.optional(element); }, ""); jquery.validator.messages.required = ""; $("form").validate({ invalidhandler: function(e, validator) { var errors = validator.numberofinvalids(); if (errors) { var message = errors == 1 ? 'you missed 1 field. has been highlighted below' : 'you missed ' + errors + ' fields. have been highlighted below'; $("div.error span").html(message); $("div.error").show(); } else { $("div.error").hide(); } }, onkeyup: false, submithandler: function() { $("div.error").hide(); alert("submit! use link below go other step"); }, messages: { password2: { required: " ", equalto: "please enter same password above" }, email: { required: " ", email: "please enter valid email address, example: you@yourdomain.com", remote: jquery.validator.format("{0} taken, please enter different address.") } }, debug:true }); $("input.home").mask("(999) 999-9999"); $("input.zipcode").mask("99999"); $("input.ssnumber").mask("999-999-9999"); /* var creditcard = $("ssnumber").mask("999-999-9999 9999"); $("#cc_type").change( function() { switch ($(this).val()){ case 'amex': creditcard.unmask().mask("9999 999999 99999"); break; default: creditcard.unmask().mask("9999 9999 9999 9999"); break; } } ); */ /* // toggle optional billing address var subtablediv = $("div.subtablediv"); var togglecheck = $("input.togglecheck"); togglecheck.is(":checked") ? subtablediv.hide() : subtablediv.show(); $("input.togglecheck").click(function() { if (this.checked == true) { subtablediv.slideup("medium"); $("form").valid(); } else { subtablediv.slidedown("medium"); } }); */ }); $.fn.hoverclass = function(classname) { return this.hover(function() { $(this).addclass(classname); }, function() { $(this).removeclass(classname); }); };
you can try in script section, provided using jquery
$('form[name="requestappointment"]').submit(function(){ alert('from requestappointment submited');// test purpose // logic }); $('form[name="freeconsultationwidget"]').submit(function(){ alert('from freeconsultationwidget submited');// test purpose // logic });
Comments
Post a Comment