form validation on submit - forms

Question

I am facing problem in form validation. Following is my jQuery validation code.
kindly help me how this validation is working on submit button.
<script type="text/javascript">
$(document).ready(function() {
$(".col a").click(function() {
$(".col a").removeClass("active");
$(this).addClass("active");
});
});
jQuery(document).ready(function() {
jQuery(".expContent").hide();
//toggle the componenet with class msg_body
jQuery(".expHeading").click(function() {
jQuery(this).next(".expContent").slideToggle(500);
});
});
$(document).ready(function() {
// Vertical
$("#vertical").on("blur", function(e) {
if ($("#vertical").val().length < 2) {
alert("vertical", "Vertical is Mandatory");
} else {
hideMsg("vertical");
}
});
// Name
$("#name").on("blur", function(e) {
if ($("#name").val().length < 2) {
alert("Name is Mandatory");
} else {
hideMsg("name");
}
});
function IsEmail(email) {
var filter = /^[\w-\.]+#([\w-]+\.)+[\w-]{2,4}$/;
if (filter.test(email)) {
return true;
} else {
return false;
}
}
$("#email").on("blur", function(e) {
if ($("#email").val().length == 0) {
//alert("Please submit a Valid Email Id");
}
if (IsEmail($("#email").val())) {
hideMsg("email");
} else {
alert("Please submit a Valid Email Id");
}
});
// Mobile No
$("#enqMobileNo").on("blur", function(e) {
if ($("#enqCountryResidence").val() == "in") {
if ($("#enqMobileNo").val().length == 10) {
hideMsg("enqMobileNo");
} else {
alert('Please Enter 10 Digit Mobile No. Only like 9812345678. Without Area or Country Code i.e "0" or "+91"');
}
} else {
if ($("#enqMobileNo").val().length 1) {
hideMsg("enqMobileNo");
} else {
alert("Please Enter Mobile No. Only. Without Area or Country Code");
}
}
});
$("#enqMobileNo").on('keyup', function() {
if ($("#enqMobileNo").val() == "0") {
$("#enqMobileNo").val("");
}
if ($("#enqCountryResidence").val() == "in") {
limitText(this, 10);
if ($("#enqMobileNo").val().length == 10) {
hideMsg("enqMobileNo");
}
} else {
//inlineMsg
("enqMobileNo", "Please Enter Mobile No. Only<br /Without Area or Country Code");
}
});
// Gender
$("#gender").on("blur", function(e) {
if ($("#gender").val() == "") {
alert('Please select Gender', 2);
} else {
hideMsg("gender");
}
});
// Age
$("#age").on("blur", function(e) {
if ($("#age").val() == "") {
alert('Please select Age', 2);
} else {
hideMsg("age");
}
});
// City
$("#enqCity").on("blur", function(e) {
if ($("#enqCity").val() == "") {
alert('Current Location City Name is Mandatory', 2);
} else {
hideMsg("enqCity");
}
});
// Course
$("#enqSection").on("blur", function(e) {
if ($("#enqSection").val() == "") {
alert('Please Select Course', 2);
} else {
hideMsg("enqSection");
}
});
// Spl
$("#enqSpeciality").on("blur", function(e) {
if ($("#enqSpeciality").val() == "") {
alert('Please Select Speciality', 2);
} else {
hideMsg("enqSpeciality");
}
});
// Level
$("#enqLevel").on("blur", function(e) {
if ($("#enqLevel").val() == "") {
alert('Please Select Level', 2);
} else {
hideMsg("enqLevel");
}
});
function limitText(field, maxChar) {
var ref = $(field),
val = ref.val();
if (val.length = maxChar) {
ref.val(function() {
console.log(val.substr(0, maxChar))
return val.substr(0, maxChar);
});
}
}
});
</script>

Answer 1

I think it is better to use jQuery form validation plugin. It is very easy to use.You can get step by step help with examples on this site