Hi everyone in this blog I’m explaining about jquery validation.

Description:

"But doesn't jQuery make it easy to write your own validation plugin?"
Sure, but there are still a lot of subtleties to take care of: You need a standard library of validation methods (such as emails, URLs, credit card numbers). You need to place error messages in the DOM and show and hide them when appropriate. You want to react to more than just a submit event, like keyup and blur.
You may need different ways to specify validation rules according to the server-side enviroment you are using on different projects. And after all, you don't want to reinvent the wheel, do you?

"But aren't there already a ton of validation plugins out there?"

Right, there are a lot of non-jQuery-based solutions (which you'd avoid since you found jQuery) and some jQuery-based solutions. This particular one is one of the oldest jQuery plugins (started in July 2006) and has proved itself in projects all around the world. There is also an article discussing how this plugin fits the bill of the should-be validation solution.

Example:

<linkhref="~/Content/bootstrap.min.css"rel="stylesheet"/>
<divclass="container">
    <divclass="row">
        <divclass="well col-md-6 col-md-offset-3">
            <h3class="text-center text-primary">Login</h3>
            <hr/>
            @using (Html.BeginForm("Index", "Home", FormMethod.Post, new { @id = "commentForm" }))
            {
                <divclass="row form-group has-feedback">
                    <divclass="col-md-12">
                        
                        <labelfor="cname">Name (required, at least 2 characters)</label>
                        <inputid="cname"name="name"class="form-control"minlength="2"type="text"required>
                    </div>
                </div>
                <divclass="row form-group has-feedback">
                    <divclass="col-md-12">
                        <labelfor="cemail">E-Mail (required)</label>
                        <inputid="cemail"type="email"class="form-control"name="email"required>
                    </div>
                </div>
                <divclass="row form-group has-feedback">
                    
                    <divclass="col-md-12">
                        
                        <labelfor="curl">URL (optional)</label>
                        <inputid="curl"type="url"class="form-control"name="url">
                    </div>
                </div>  
                <divclass="row form-group has-feedback">
                    <divclass="col-md-12">
                        <labelfor="ccomment">Your comment (required)</label>
                        <textareaid="ccomment"class="form-control"name="comment"required></textarea>
                    </div>
                </div>
                <divclass="col-md-12 text-right"><buttontype="submit"class="btn btn-primary">Submit</button></div>
 
            }
        </div>
    </div>
</div>
<scriptsrc="~/Scripts/jquery.min.js"></script>
<scriptsrc="~/Scripts/jquery.validate.min.js"></script>
<script>
    $("#commentForm").validate();
</script>

 Output:

1.       When run application first time

2.    When submit form without fill any field

3.   When fill name field and emailed(not correct format) field 

4.    When fill name field, emailed field and url field(not correct format)

in my next post i'll explain about Getting Started with Linq Queries