ValidationMessage always displays / Summary doesn't - ASP.NET MVC 3

Question

The problem is:

I have the an Ajax.BeginForm, that essentially consists of two dropdownlists and the submit button. I want MVC 3 validation to kick in if the user doesn't select an option from both of the dropdownlists.

This is isn't happening. Instead, the page opens with the ValidationMessages showing beside the ddls, and if there is a submission with invalid data, no validation summary gets shown.

The code is:

using (Ajax.BeginForm(MVC.Admin.TutorEditor.AddTutorCourse(Model.TutorName, 0, 0),
                        new AjaxOptions
                        {
                            UpdateTargetId = "TutorCourses",
                            OnBegin = "isValidPleaseWait",
                            LoadingElementId = "PleaseWait"
                        },
                        new { name = "AddTutorCourseForm", id = "AddTutorCourseForm" }))
        {
            Html.ValidationSummary("Sorry, there was an error. Please check below and try again:");                
            <fieldset>
                <legend>Add Course</legend>
                <div class="editor-label">
                    @Html.LabelFor(model => model.AllCourses)
                    @Html.DropDownList("CourseId", Model.AllCourses, "-- Choose Course --", new { style = "width:180px;" })
                    @Html.ValidationMessage("CourseId", "*: Required")
                </div>
                <div class="editor-label">
                    @Html.LabelFor(model => model.TutorRoles)
                    @Html.DropDownList("TutorRoleId", Model.TutorRoles, "-- Choose Role --", new { style = "width:180px;" })
                    @Html.ValidationMessage("TutorRoleId", "*: Required")
                </div>
                <input type="submit" value="Add Course" />
            </fieldset>
        }

The AddTutorCourse Action is:

[HttpPost]
        public virtual ActionResult AddTutorCourse(string username, int CourseId, int TutorRoleId)
        {
            service.SetTutor(username);
            if (CourseId == 0) ModelState.AddModelError("CourseId", "You did not choose a Course");
            if (TutorRoleId == 0) ModelState.AddModelError("TutorRoleId", "You did not choose a Tutor Role");
            if(ModelState.IsValid)
            {
                service.AddTutorToCourse(CourseId, TutorRoleId);
            }
            if (Request.IsAjaxRequest())
            {
                return PartialView(Views.TutorCoursesPartial, service.ViewModel);
            }
            else
            {
                return View(Views.Details, service.ViewModel);
            }            
        }

The included script files are:

    <script id="script0" src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script id="script1" src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
<script id="script2" src="/Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script>
    <script id="script3" src="/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script id="script4" src="/jQueryUI/jquery-ui-1.8.2.custom.min.js" type="text/javascript"></script>
    <script id="script5" src="/jQueryPlugins/Cookies/jquery.cookie.js" type="text/javascript"></script>
    <script type="text/javascript" src="/Scripts/jquery.unobtrusive-ajax.min.js"></script>

What am I doing wrong!?

stealthyninja · Accepted Answer · 2011-12-27 20:01:59Z

11

I was having this problem too, and I finally figured out that you need to add a CSS style to the validation class. Then it won't display it when the page first opens:

.field-validation-valid { display: none; }
.validation-summary-valid {  display: none; }

edited Dec 27, 2011 at 20:01

stealthyninja

10.4k11 gold badges56 silver badges61 bronze badges

answered Apr 4, 2011 at 2:27

d89761

1,4449 silver badges11 bronze badges

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

Comments

Keltex · Accepted Answer · 2011-02-01 17:33:22Z

3

Are you including the required javascript files? You need:

jquery-1.4.1.js
jquery.validate.js
jquery.validate.unobtrusive.js (if using unobtrusive validation)

answered Feb 1, 2011 at 17:33

Keltex

26.5k12 gold badges82 silver badges112 bronze badges

Comments

Phil · Accepted Answer · 2013-04-24 12:28:44Z

1

If you don't require the entire jquery validation library then @diana's answer is a nice option. Alternatively, if you require server validation anyway, then it might be better to disable client validation by including this in your view:

@{ Html.EnableClientValidation(false); }

answered Apr 24, 2013 at 12:28

Phil

1,09114 silver badges16 bronze badges

Collectives™ on Stack Overflow

ValidationMessage always displays / Summary doesn't - ASP.NET MVC 3

The problem is:

The code is:

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

The problem is:

The code is:

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related