Reputation: 610
I am a newbie to javascript and i cant return the boolean value of the function.. i am validating the textboxes for null and return false if its empty help please?
validateForm : function() {
$('.requiredField :input').each(function(){
if ('input[type=text]'){
if($(this).val().length === 0){
$(this).addClass('warning');
var errorMsg = $('<br /><span>Please Fill in the TextBox</span>').addClass('warning');
errorMsg.insertAfter(this);
$(errorMsg).css('color','red');
$('.warning').css('border-color','red');
//$(this).focus(function(){
//$(this).removeClass('warning');
//$(this).parent().children('span').remove();
//$(this).parent().children('br').remove();
//});
return false;
}
else
return true;
}
});
},
Form.validateForm(); // call to the function
Upvotes: 1
Views: 381
Reputation: 227240
You are return
ing from inside the .each()
. That doesn't make your function return a value.
In an .each()
loop, return false;
is like using break;
, and return true;
is like using continue;
.
You need to declare a variable outside of the .each()
, set its value inside the loop, then return it after the loop.
Upvotes: 2
Reputation: 6291
As mentionned by @RocketHazmat, your function needs to aggregate results from the inside loop and have a single exit point in order to validate (and add the css classes/html elements) every input.
You need to do something like this:
validateForm : function () {
var invalidInputs = [];
// only test the type='text' inputs
$('.requiredField :input[type="text"]').each(function () {
// if there is no value
if ($(this).val() == undefined || $(this).val().length == 0) {
$(this).addClass('warning');
var errorMsg = $('<br /><span>Please Fill in the TextBox</span>').addClass('warning');
errorMsg.insertAfter(this);
$(errorMsg).css('color','red');
$('.warning').css('border-color','red');
// add the invalid input to an array
invalidInputs.push($(this));
}
});
// The form is only valid for no invalid inputs were found.
return invalidInputs.length == 0;
}
Upvotes: 0
Reputation: 679
It seems that you are trying to write a plugin? Try the following code:
(function($) {
$.fn.validateForm = function()
{
var formID = $(this).attr('id');
$('#'+ formID +' input[type=submit]').click(function(e)
{
e.preventDefault();
$('input[type=text]').each(function(){
if($(this).val().length === 0){
$(this).addClass('warning');
var errorMsg = $('<span>Please Fill in the TextBox</span>').addClass('warning');
errorMsg.insertAfter(this);
$(errorMsg).css('color','red');
$('.warning').css('border-color','red');
return false;
}else{
return true;
}
});
});
};
})(jQuery);
Upvotes: 0
Reputation: 358
You can try this:
$('.requiredField :input').each(function(){
var i=$(this).val();
if(i == '' || i == null)
{
//execute your codes
return false;
}else{
return true;
}
});
Upvotes: 0
Reputation:
check this line
if ('input[type=text]'){
it should be
if($('input[type=text]')){
Upvotes: 0