jQuery Validation Plugin

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

Validations example

Simple jQuery Validation script to validate your form inputs.

     $("#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            },            crole:"required",            ccomment: {				required: true,				minlength: 15            },            cgender:"required",			cagree:"required",        },        //For custom messages        messages: {            uname:{                required: "Enter a username",                minlength: "Enter at least 5 characters"            },            curl: "Enter your website",        },        errorElement : 'div',        errorPlacement: function(error, element) {          var placement = $(element).data('error');          if (placement) {            $(placement).append(error)          } else {            error.insertAfter(element);          }        }     });     

Materialize default error and success messages

Materialize admin theme has built in custom error or success messages, You can add custom validation messages by adding either data-erroror data-successattributes to your input field labels.

Form validation with placeholder

Add class .left-alertto show error message in left align.

Form validation with icons

Add class .right-alertto show error message in right align.

Note:Materialize default validation work based on HTML5 input types.