ASP.NET MVC3 Validation problem

Question

I have following ViewModel:

public class Bulletin1ViewModel
    {
        [Required]
        public String NumberDelegations { get; set; }

        [Required]
        public String TravelPlans { get; set; }
    }

Which I want to use in my View:

     @using ErasProject.Models
        @model ErasProject.Models.Bulletin1ViewModel
<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

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

            <fieldset>

            <p>
            @Html.EditorFor(model => model.NumberDelegations)
            @Html.ValidationMessageFor(model => model.NumberDelegations)
            </p>

            <p>
            @Html.EditorFor(model => model.TravelPlans)
            @Html.ValidationMessageFor(model => model.TravelPlans)
            </p>

            <p>
            <input type="submit" value="Submit" />
            </p>

            </fieldset>

    }

But my validation isn't triggered. Neither client-side nor server-side. Anyone could have an idea why? Thanks.

balexandre · Accepted Answer · 2011-05-16 11:17:39Z

5

you need to add both jquery and jQuery Validation plugin (and optionally, the unobtrusive library)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"           type="text/javascript"></script>
<script src="http://ajax.microsoft.com/ajax/jQuery.Validate/1.7/jQuery.Validate.min.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>

so, your view will be as:

@using ErasProject.Models
@model ErasProject.Models.Bulletin1ViewModel

<script src="jquery.min.js"></script>
<script src="jQuery.Validate.min.js"></script>
<script src="jquery.validate.unobtrusive.min.js"></script>

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

    <fieldset>

    <p>
    @Html.EditorFor(model => model.NumberDelegations)
    @Html.ValidationMessageFor(model => model.NumberDelegations)
    </p>

    <p>
    @Html.EditorFor(model => model.TravelPlans)
    @Html.ValidationMessageFor(model => model.TravelPlans)
    </p>

    <p>
    <input type="submit" value="Submit" />
    </p>

    </fieldset>

}

Just added your object and created a Add Action like:

public ActionResult Add()
{
    return View();
}

and created a View using the Create template and the Bulletin1ViewModel class that look like this:

@model WebApp_MVC3.Models.Bulletin1ViewModel

@{
    ViewBag.Title = "Add";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Add</h2>

<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Bulletin1ViewModel</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.NumberDelegations)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.NumberDelegations)
            @Html.ValidationMessageFor(model => model.NumberDelegations)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.TravelPlans)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.TravelPlans)
            @Html.ValidationMessageFor(model => model.TravelPlans)
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

without doing anything more, the result is:

original file

enter image description here

I would re-check the javascript libraries...

edited May 16, 2011 at 11:17

answered May 16, 2011 at 11:02

balexandre

75.4k47 gold badges240 silver badges352 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Hanz Over a year ago

They are already added. It's an MVC3 application with RazorView engine. And I've checked they are indeed present.

balexandre Over a year ago

they load correctly when you see the source of your page? did you build?

Hanz Over a year ago

I reloaded the javascript libraries and it works now. thank you!

Matthias · Accepted Answer · 2011-05-16 11:17:02Z

1

Don't use

<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>

but just drag and drop the following .js files from your Scripts folder in your project:

jquery-1.4.4.min.js
jquery.validate.min.js
jquery.validate.unobtrusive.min.js

That will make sure your references to the js files are correct.

answered May 16, 2011 at 11:17

Matthias

13.5k13 gold badges37 silver badges56 bronze badges

1 Comment

balexandre Over a year ago

do an Update using Web Platform Installer or using the power shell... jQuery is already in version 1.6.1 :)

Collectives™ on Stack Overflow

ASP.NET MVC3 Validation problem

2 Answers 2

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related