Function is automatically called without any input in jquery

[piyusharora420]

Hello Everyone,

 

I want to use jquery for validating forms. I have written the below mentioned code for the same. But, else part of each function is automatically called without any blur or keyup event.

 

 

$(document).ready(function(){
var reg=$("#reg");
var firstName=$("#firstName");
var lastName=$("#lastName");
var email=$("#email");
var reEmail=$("#reEmail");
var password=$("#password");
var gender=$('#gender');
var month=$("#month");
var year=$("#year");
var day=$("#day");

firstName.blur(isValidName($(this),"First name can contatin only alphabets","#firstNameValidate"));
lastName.blur(isValidName($(this),"last name can contatin only alphabets","#lastNameValidate"));
email.blur(isValidEmail(email,"Enter a valid email address","#emailValidate"));
reEmail.blur(isValidEmail($(this),"Enter a valid email address","#reEmailValidate"));
password.blur(isValidPassword($(this),"Password length should be b/w 8 and 15","#passwordValidate"));
gender.blur(isNull($(this),"Please select your gender","#genderValidate"));

firstName.keyup(isValidName($(this),"First name can contatin only alphabets","#firstNameValidate"));
lastName.keyup(isValidName($(this),"First name can contatin only alphabets","#firstNameValidate"));
email.keyup(isValidEmail($(this),"Enter a valid email address","#emailValidate"));
reEmail.keyup(isValidEmail($(this),"Enter a valid email address","#reEmailValidate"));
password.keyup(isValidPassword($(this),"Password length should be b/w 8 and 15","#passwordValidate"));
gender.keyup(isNull($(this),"Please select your gender","#genderValidate"));

reg.submit(function(){
	if(isValidName() & isValidateEmail() & isValidPassword() & isNull())
		return true
	else
		return false;

});

function isValidName(name,alertMsg,id)
{
var a=name.val();
var nameRegex=/^[a-zA-Z]+$/;
if(nameRegex.test(a))
{
	$(id).removeClass("yellow").addClass("form.reg td span").text("whats your first name?");
	return true;
}
else
{
	$(id).addClass("yellow").removeClass("form.reg td span").text(alertMsg);
	name.focus();
	return false;
}
}

//Function for validating Email address
function isValidEmail(elem, helperMsg,id)
{
var emailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;

if(elem.val().match(emailExp))
{
	$(id).removeClass("yellow").addClass("form.reg td span");
	return true;
}
else
{
		//alert(helperMsg);
		$(id).addClass("yellow").removeClass("form.reg td span").text(helperMsg);
		elem.focus();
		return false;
}
}


//Function for validating passwords
function isValidPassword(password,alertMsg,id)
{
var passRegex=/^[\w\-\@\#\&\*\%\$]{8,15}$/;
if(password.val().match(passRegex))
{
	$(id).removeClass("yellow").addClass("form.reg td span");
	return true;
}
else
{
	$(id).addClass("yellow").text("whats your password");
	//alert(alertMsg);
	password.focus();
	return false;
}
}

//Function for checking emply values
function isNull(anyValue,alertMsg,id)
{
if(anyValue.val().length!=0)
{
	$(id).removeClass("yellow").addClass("form.reg td span");
	return true;
}
else
{
	//alert(alertMsg);
	$(id).addClass("yellow").text(alertMsg);
	anyValue.focus();
	return false;
}
}

});

[kicken]

That is because your running the functions during the ready event.

 

firstName.blur(isValidName($(this),"First name can contatin only alphabets","#firstNameValidate"));

 

That code says to execute the isValidName function NOW, and assign it's return-value as an onblur handler.  That is not what you want, you want to assign a function as the onblur handler which then executes your isValidName function later.  To do that, wrap all calls in function(){ ... }, such as:

 

firstName.blur(function(){ isValidName($(this),"First name can contatin only alphabets","#firstNameValidate"); });