Blending jQuery form and validation
I'm trying to blend the validation part of this tutorial: http://yensdesign.com/2009/01/how-validate-forms-both-sides-using-php-jquery/ with the sliding form part of this tutorial: http://tympanus.net/codrops/2010/06/07/fancy-sliding-form-with-jquery/.
The sliding form has a built in validation, but it's lacking. That and it only validates when the user moves to the next slide. I want to incorporate the instant validation of the yensdesign tutorial, but I'm having a hard time understanding how to do this. I'm still a beginner when it comes to javascript and jQuery and this is kicking my hind end. I want to call the validate functions whenever a user enters information in, instead of only when the slide changes. But the way that the slider is programmed, I can't tell what changes to make and where... I tried to add the validateFName
function in place of this code: $('#formElem').children(':nth-child('+ parseInt(step) +')').find(':input:not(button)').each(function(){
But that doesn't work. I really don't want someone to just give me the code. I would prefer to have someone walk me through what needs to happen to blend these two parts of a form together.
I appreciate any help you can give. Reading a jquery "how-to" book didn't help because this is such a specific issue. So that's why I'm bring开发者_JS百科ing it here.
EDIT Here's a working JSFiddle without the working validation part... http://jsfiddle.net/KyHvX/
Actually, the question was almost answered as is. If instead of validating all the fields using the same code, if I split them up and use the specific validation code(different validation method for emails than names) for the respective validator(email, fname, lname, etc.), then make sure to update the events that you want the validation to take place after, everything works fine.
精彩评论