Form Validations

jQuery Validation This jQuery plugin makes simple clientside form validation easy, whilst still offering plenty of customization options.

help
Validations Example
                                                    
<form class="formValidate" id="formValidate" method="POST" action="#" novalidate="novalidate">
    <div class="row">
        <div class="input-field col s12">
            <label for="uname">Username*</label>
            <input id="uname" name="uname" type="text" data-error=".errorTxt1">
            <div class="errorTxt1"></div>
        </div>
        <div class="input-field col s12">
            <label for="cemail">E-Mail *</label>
            <input id="cemail" type="email" name="cemail" data-error=".errorTxt2">
            <div class="errorTxt2"></div>
        </div>
        <div class="input-field col s12">
            <label for="password">Password *</label>
            <input id="password" type="password" name="password" data-error=".errorTxt3">
            <div class="errorTxt3"></div>
        </div>
        <div class="input-field col s12">
            <label for="cpassword">Confirm Password *</label>
            <input id="cpassword" type="password" name="cpassword" data-error=".errorTxt4">
            <div class="errorTxt4"></div>
        </div>
        <div class="input-field col s12">
            <label for="curl">URL *</label>
            <input id="curl" type="url" name="curl" data-error=".errorTxt5">
            <div class="errorTxt5"></div>
        </div>

        <div class="input-field col s12">
            <textarea id="ccomment" name="ccomment" class="materialize-textarea " data-error=".errorTxt7"></textarea>
            <label for="ccomment">Your comment *</label>
            <div class="errorTxt7"></div>
        </div>

        <div class="col s12">
            <button class="btn waves-effect waves-light right theme-bg" type="submit" name="action">Submit <i class="material-icons right">send</i></button>
        </div>
    </div>
</form>
                                                    
                                                
                                                    
$("#formValidate").validate({
    rules: {
        uname: {
            required: true,
            minlength: 5
        },
        cemail: {
            required: true,
            email: true
        },
        password: {
            required: true,
            minlength: 5
        },
        cpassword: {
            required: true,
            minlength: 5,
            equalTo: "#password"
        },
        curl: {
            required: true,
            url: true
        },
        ccomment: {
            required: true,
            minlength: 15
        }
    },
    //For custom messages
    messages: {
        uname: {
            required: "Enter a username",
            minlength: "Enter at least 5 characters."
        },
        curl: "Enter your website URL",
        cpassword: "Your enter password is different.",
    },
    errorElement: 'div',
    errorPlacement: function(error, element) {
        var placement = $(element).data('error');
        if (placement) {
            $(placement).append(error)
        } else {
            error.insertAfter(element);
        }
    }
});