Does @ Html.ValidationSummary work for client-side validation in MVC3 or MVC4?

Question

I have the following code:

@Html.ValidationSummary(false) 
@Html.ValidationSummary(true, "xxx")

@using (Ajax.BeginForm(
        action,
        "Menus",
        null,
        new AjaxOptions
        {
            UpdateTargetId = "update-message",
            InsertionMode = InsertionMode.Replace,
            HttpMethod = "POST",
            OnSuccess = success
        }, new { @id = "menuForm" }))
{
    <dl>
    <dt>@Html.LabelFor(model => model.Order)</dt>
    <dd>@Html.TextBoxFor(model => model.Order)</dd>
    <dd>@Html.ValidationMessageFor(model => model.Order)</dd>
    </dl>

When I enter the value of Order 999, I immediately receive a client-side confirmation that shows me an error message immediately after the Order Text field. However, nothing is displayed in the Html.ValidationSummary area. Can this be used with client side validation?

Here is my model:

public class Menu
{
    [Range(0, 99, ErrorMessage = "{0} must be between {1} and {2}")]
    [DisplayName("Order")]
    public int Order { get; set; }

My web configuration:

  <appSettings>
    <add key="webpages:Enabled" value="false" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>

Answer 1

I am not 100% sure, but the check summary that I can find in the default MVC 3 application is on the Form. Perhaps because your validation summaries are outside the form, they are not updated. What happens when you move a validation summary on a form?

From:

@Html.ValidationSummary(false) 
@Html.ValidationSummary(true, "xxx")

@using (Ajax.BeginForm(
        action,
        "Menus",
        null,
        new AjaxOptions
        {
            UpdateTargetId = "update-message",
            InsertionMode = InsertionMode.Replace,
            HttpMethod = "POST",
            OnSuccess = success
        }, new { @id = "menuForm" }))
{
    <dl>
    <dt>@Html.LabelFor(model => model.Order)</dt>
    <dd>@Html.TextBoxFor(model => model.Order)</dd>
    <dd>@Html.ValidationMessageFor(model => model.Order)</dd>
    </dl>

To:

@using (Ajax.BeginForm(
        action,
        "Menus",
        null,
        new AjaxOptions
        {
            UpdateTargetId = "update-message",
            InsertionMode = InsertionMode.Replace,
            HttpMethod = "POST",
            OnSuccess = success
        }, new { @id = "menuForm" }))
{
    @Html.ValidationSummary(false) 
    @Html.ValidationSummary(true, "xxx")
    <dl>
    <dt>@Html.LabelFor(model => model.Order)</dt>
    <dd>@Html.TextBoxFor(model => model.Order)</dd>
    <dd>@Html.ValidationMessageFor(model => model.Order)</dd>
    </dl>