Sprawdzanie poprawności klienta nie wyświetla wiadomości

Question

Mam aplikację internetową MVC4 z formularzem do tworzenia kont użytkowników. Sprawdzanie poprawności formularza działa, ale gdy dane wejściowe nie sprawdzają poprawności, nie jest wyświetlany komunikat o błędzie. To wciąż uniemożliwia złożenie dopóki problem walidacji jest rozwiązany, ale nie ma tekstu

Razor Zobacz Formularz

<h2>Create New Account</h2> 
<fieldset> 
    <legend></legend> 
    @using (Html.BeginForm("CreateUser",null)){ 
     @Html.AntiForgeryToken() 
     <table class="create"> 
      <tr> 
       <td colspan="2"><b>New Account</b> 
      </tr> 
      <tr> 
       <td>@Html.DisplayNameFor(model=>model.UserName)</td><td>@Html.TextBoxFor(model=>model.UserName)</td> 
       <td>@Html.DisplayNameFor(model=>model.EmailAddress)</td><td>@Html.TextBoxFor(model=>model.EmailAddress)</td> 
       <td><input type="submit" value="Create User" /></td> 
      </tr> 
     </table> 
    } 
</fieldset> 
    @Html.ValidationSummary() 

Wiązki stosowane obejmują pliki walidacji

bundles.Add(new ScriptBundle("~/bundles/asset").Include(
      "~/Scripts/jquery-{version}.js", 
      "~/Scripts/jquery-ui-{version}.js", 
      "~/Scripts/jquery.validate*", 
      "~/Scripts/jquery.unobtrusive*")); 

model stosowany jest model podmiot , Dodałem częściową klasę do adnotacji wymagań sprawdzania poprawności

[MetadataType(typeof(UserProfileMetadata))] 
public partial class UserProfile 
{ 
    //Empty Class just required for adding class level attribute 
} 

public class UserProfileMetadata 
{ 
    //Fields from user profile requiring annotations 
    [EmailAddress] 
    [Required] 
    [Display(Name = "Email Address")] 
    public string EmailAddress { get; set; } 

    [Required] 
    public string UserName { get; set; } 

} 

Sprawdzanie poprawności działa, ale teraz pokazując komunikat sprawia, że ​​myślę, że musi to być błąd znacznika, ale po prostu go nie widzę.

Answer 1

Przeniesienie poprawki ValidationSummary wewnątrz formularza spowoduje jej naprawienie.

<h2>Create New Account</h2> 
<fieldset> 
    <legend></legend> 
    @using (Html.BeginForm("CreateUser",null)){ 
     @Html.ValidationSummary() 
     @Html.AntiForgeryToken() 
     <table class="create"> 
      <tr> 
       <td colspan="2"><b>New Account</b> 
      </tr> 
      <tr> 
       <td>@Html.DisplayNameFor(model=>model.UserName)</td> <td>@Html.TextBoxFor(model=>model.UserName)</td> 
      <td>@Html.DisplayNameFor(model=>model.EmailAddress)</td><td>@Html.TextBoxFor(model=>model.EmailAddress)</td> 
      <td><input type="submit" value="Create User" /></td> 
     </tr> 
    </table> 
} 
</fieldset> 

Answer 2

Dla każdego natknięcia się ten, kto nie chce być ograniczony do przesuwania @Html.ValidationSummary do formy, to znaczy, że żyje w _Layout.cshtml i chcesz go tam, oto sposób wokół tego.

Poniższa metoda jest najwyraźniej używana przez firmę Microsoft do zapełniania @Html.ValidationSummary. W standardowej formie wygląda data-valmsg-summary-true w $('this'). this w tym przypadku jest formularzem wywołującym. Cóż, mój @Html.ValidationSummary mieszka w pageBody na _Layout.cshtml, aby utrzymać go w stanie SUCHYM.

function onErrors(event, validator) { // '#pageBody' is the containing element 
    var container = $('#pageBody').find("[data-valmsg-summary=true]"), 
    list = container.find("ul"); if (list && list.length && validator.errorList.length) { 
     list.empty(); container.addClass("validation-summary-errors").removeClass("validation-summary-valid"); 
     $.each(validator.errorList, function() { 
      $("<li />").html(this.message).appendTo(list); 
     }); 
    } 
} 

Dotychczas Zmieniłem to tylko:

var container = $('this').find("[data-valmsg-summary=true]") 

do tego:

var container = $('#pageBody').find("[data-valmsg-summary=true]") 

Teraz wywołać mój walidacji z pomocą kliknięcia przycisku. Aby uzyskać onErrors(event, validator) na ogień, użyłem następujące jQuery:

$('#btnSave').click(function() { 
     if ($('form').valid()) { 
      // Do stuff 
     } else { 
      onErrors(event, $('form').data('validator')); 
     } 
    }); 

voila, @ Html.ValidationSummary zapełnia nawet przy użyciu jQuery.unobtrusive.

Wielkie dzięki Leniel Macaferi dla wskazujące mnie we właściwym kierunku tutaj: http://www.leniel.net/2013/08/customizing-aspnet-mvc-html-validation-summary-with-bootstrap-3-panel.html#sthash.jGRguVuV.qSjYUlhS.dpbs