javascript - Make form validation return true? -
here validation code:
function validateenquiryform() { var x = document.forms["enquiry"]["name"].value; if(x == null || x == "" || x == "name") { $('#name').removeclass('custom').addclass('error'); $('.name-error').show(); //return false; } else if(x !== null || x !== "" || x !== "name") { $('#name').removeclass('error').addclass('custom'); $('.name-error').hide(); } var x = document.forms["enquiry"]["phone"].value; if(x == null || x == "" || x == "phone number") { $('#phone').removeclass('custom').addclass('error'); $('.phone-error').show(); //return false; } else if(x !== null || x !== "" || x !== "phone number") { $('#phone').removeclass('error').addclass('custom'); $('.phone-error').hide(); } var x = document.forms["enquiry"]["requirements"].value; if(x == null || x == "" || x == "add other requirements here...") { $('#requirements').removeclass('textarea-1').addclass('error'); $('.requirements-error').show(); //return false; } else if(x !== null || x !== "" || x !== "add other requirements here...") { $('#requirements').removeclass('error').addclass('custom'); $('.requirements-error').hide(); } var x = document.forms["enquiry"]["summary"].value; if(x == null || x == "" || x == "summarise project in few key words...") { $('#summary').removeclass('custom').addclass('error'); $('.summary-error').show(); //return false; } else if(x !== null || x !== "" || x !== "summarise project in few key words...") { $('#summary').removeclass('error').addclass('custom'); $('.summary-error').hide(); } var x = document.forms["enquiry"]["email"].value; var atpos = x.indexof("@"); var dotpos = x.lastindexof("."); if(atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= x.length) { $('#email').removeclass('custom').addclass('error'); $('.email-error').show(); //return false; } else if(atpos > 1 || dotpos > atpos + 2 || dotpos + 2 <= x.length) { $('#email').removeclass('error').addclass('custom'); $('.email-error').hide(); } $('.error-banner').effect("pulsate", { times: 2 }, 1000); return false; }
when code runs checks fields see if blank. if 1 or more incorrectly filled in .error-banner
pulses , individual messages displayed. problem when form filled in correctly banner still flashes. tell me going wrong..?
as far can tell, function ends block, unconditionally:
$('.error-banner').effect("pulsate", { times: 2 }, 1000); return false;
maybe change to:
var valid = true; // in error handling conditionals, set valid false: if(x == null || x == "" || x == "phone number") { $('#phone').removeclass('custom').addclass('error'); $('.phone-error').show(); valid = false; } ... if (!valid) { $('.error-banner').effect("pulsate", { times: 2 }, 1000); } return valid;
i have agree majority of commenters approach leaves lot of room improvement, though.
Comments
Post a Comment