MVC 5 Html.ValidationSummary still visible after AJAX post

Question

When using Html.ValidationSummary and Html.BeginForm, you typically reload or navigate away from the page when all fields validate and the controller can perform the next steps. In this situation, there is no need to clear the validation summary.

However, when using Ajax.BeginForm the user might never leave the page. Once the form is validated, control goes to the controller live above but the controller may send the user back to the calling form as some server-side validation needs to be addressed. In this situation, an apparent bug in .NET does not clear the ValidationSummary. Yes, I can hide/clear it via JavaScript/JQuery using the OnBegin property of the form, but then it never unhides if it's needed on the form at a later step, say when you invalidate the client side validation.

A snippet of my form:

@using (Ajax.BeginForm("ExistingLogin", "Home", null, new AjaxOptions { HttpMethod = "Post", OnBegin="onBegin", OnSuccess = "onSuccess", OnFailure = "onError" }, new { @class = "form-horizontal", role = "form" }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary("Please correct the following errors:", new { @class = "alert alert-danger", @role = "alert" })
    <div id="controllerResponse" class="alert alert-danger" role="alert" style="display:none;"></div>

How do you handle this?

Check this question: stackoverflow.com/questions/17844156/… — Chris Pratt

Connie DeCinko Connie DeCinko · Accepted Answer · 2014-07-30T16:37:47

Rather than hide/show the validator, follow what jQuery does, change the class:

function onComplete() {
    $(".alert").removeClass("validation-summary-errors");
    $(".alert").addClass("validation-summary-valid");
}

Just not sure if it's better to do this in the OnComplete or in the OnBegin.

MVC 5 Html.ValidationSummary still visible after AJAX post

1 Answers