Jay
Jay

Reputation: 1404

jQuery form validation for appended fields

I have a form which contains couple fields. Its very easy to validate this form. But when I'm using append or clone comand and add couple more fields in it dynamically I cannot validate the appended fields.
Here is the my code:

function addone(container, new_div) {  
    var to_copy = document.getElementById(new_div);  
    $(to_copy).clone(true).insertAfter(to_copy);  
}

And because it doesn't matter which fields and I want all of them get field out I used class instead of id.

$(document).ready(function(){  
    $('#add_size').live('click', function(){  
        if($('.inp').val() == "") {  
            alert('Need to fill-out all fields')  
        }  
        else {  
            alert('Thanks')  
        }  
    })  
})

Any idea? Thanks in advance.

Upvotes: 0

Views: 264

Answers (2)

fitzgeraldsteele
fitzgeraldsteele

Reputation: 4557

I see one thing that might cause you trouble...:

If you're only going to check fields for validity on submit, then I don't think you need the live handler. You're not adding fields with #add_size, you're adding .inp's. Just do your validations on click, and jQuery should find all the .inp class fields that are there at the time of the event:

$('#add_size').click(function(

   $('.inp').each ...

)};

Or maybe I totally read the question wrong...

Upvotes: 0

Reigel Gallarde
Reigel Gallarde

Reputation: 65284

$(document).ready(function(){  
    $('#add_size').live('click', function(){  
        if( ! checkvalid() ) {  
            alert('Need to fill-out all fields')  
        }  
        else {  
            alert('Thanks')  
        }  
    })  
})

function checkvalid(){
    var valid = true;
   $('.inp').each(function(){
       if (this.value == '') {
           valid = false;
           return;
       }
   })
   return valid;
}

Upvotes: 1

Related Questions