jquery validation in mvc3 application

Question

Can someone help me to do validation in mvc3 html editable grid? The sum of the values on the column should not exceed one hundred. Can I validate using jQuery or do server-side validation?

Answer 1

This is Server Side Validation

Class:

public class Party
{
[Required(ErrorMessage = "Start date is required")]
public DateTime StartDate { get; set; }

[Required(ErrorMessage = "Duration is required")]    
public int DurationInHours { get; set; }

[Required(ErrorMessage = "No. of joinees is required")]
[Range(2, 10, ErrorMessage = "No. of joinees should be minimum 2 and not more than 10")]
public int NoOfJoinees { get; set; }    

public bool Drinks { get; set; }
}

Controller:

public class PartyController: Controller
{
public ActionResult Index()
{
    return View();
}
} 

View:

@model CustomValidation.MVC.Models.Party

@using (Html.BeginForm())
{
@Html.ValidationSummary()


Start date (MM/dd/yyyy HH:mm:ss AM/PM) *: @Html.TextBoxFor(x => x.StartDate, new { size = 25 })
Duration (Hours) *: @Html.DropDownListFor(x => x.DurationInHours, new[]{
                        new SelectListItem(){ Text = "1", Value = "1"},
                        new SelectListItem(){ Text = "2", Value = "2"},
                        new SelectListItem(){ Text = "3", Value = "3"},
                        new SelectListItem(){ Text = "4", Value = "4"},
                        new SelectListItem(){ Text = "5", Value = "5"}
                        }, "Select the duration", new { style = "width:180px" })


    No. of joinees *: @Html.TextBoxFor(x => x.NoOfJoinees, new { size = 5 })

    Drinks? @Html.CheckBoxFor(x => x.Drinks)

    <input type="submit" value="Host the party!" />
}

And Client Side Validation:

HTML

<input type="text" id="UserName" name="UserName"/>
<input type="button" onclick="Validation()" value="Enter" />

Javascript:

function Validation() {
var data= {
UserName: $('#UserName').val()
};

if (data.UserName.trim() == "" || data.UserName== undefined) {
$("#ShowWarning").html('<img src="/Image/warning.jpg" title="Please Enter UserName!">').show();
}

Also you can check below example too

http://www.mindstick.com/Articles/d17c1dc9-e00b-4c13-94e7-87dacdca027f/?Validation%20in%20ASP%20NET%20MVC3

i hope helps you

Answer 2

In MVC, you should always use client side and server side validation. If you mark the models with validation attributes both the server-side and client-side validation should work just fine.

Please check this link for detailed validation in MVC3 - http://bradwilson.typepad.com/blog/2010/10/mvc3-unobtrusive-validation.html

And also check this below Scott-Gu blog which helps for validation.

http://weblogs.asp.net/scottgu/archive/2010/01/15/asp-net-mvc-2-model-validation.aspx