6

Tôi có ứng dụng internet MVC4 với biểu mẫu để tạo tài khoản người dùng. Việc xác thực biểu mẫu hoạt động nhưng trong khi xác thực không thành công, không có thông báo lỗi nào được hiển thị. Nó vẫn ngăn cản nộp đến khi vấn đề xác nhận đã được giải quyết nhưng không có văn bảnXác thực ứng dụng khách không hiển thị thông báo

Razor Xem Mẫu

<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() 

Các bó sử dụng bao gồm các tập tin xác nhận

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

Mô hình sử dụng là một mô hình tổ chức , Tôi đã thêm một phần lớp để chú thích các yêu cầu xác thực

[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; } 

} 

Việc xác thực làm việc nhưng bây giờ cho thấy thông báo làm cho tôi nghĩ rằng nó phải là một lỗi đánh dấu nhưng tôi chỉ không thể nhìn thấy nó.

+3

có bạn đã cố gắng di chuyển bản tóm tắt xác nhận vào mẫu? Ngoài ra, validationsummary sẽ không phổ biến với kết quả cho đến khi gửi được nhấp – Slicksim

+0

* facepalm * có, vấn đề đã có bản tóm tắt bên ngoài biểu mẫu. Cháy nó như một giải pháp và tôi sẽ chấp nhận nó. Nhìn chằm chằm vào nó trong khoảng 40 phút và chỉ không nhìn thấy nó! – James

+0

Tôi đã làm cùng một bản thân mình, tôi sẽ nhận được một mắt đen từ lòng bàn tay của tôi một ngày :) – Slicksim

Trả lời

13

Di chuyển ValidationSummary bên trong biểu mẫu sẽ sửa lỗi đó.

<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> 
5

Đối với bất cứ ai vấp ngã trên này ai không muốn bị hạn chế việc di chuyển @Html.ValidationSummary vào hình thức, tức là nó sống ở _Layout.cshtml, và bạn thích nó ở đó, đây là một con đường xung quanh đó.

Phương pháp dưới đây rõ ràng là những gì được Microsoft sử dụng để điền @Html.ValidationSummary. Ở dạng tiêu chuẩn, nó tìm kiếm data-valmsg-summary-true trong $('this'). this trong trường hợp này là biểu mẫu gọi. Vâng, số điện thoại @Html.ValidationSummary của tôi tồn tại trong pageBody<div> trên _Layout.cshtml để giữ cho nó KHÔ.

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); 
     }); 
    } 
} 

Cho đến nay, tôi đã chỉ thay đổi này:

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

này:

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

Bây giờ, tôi kích hoạt xác nhận của tôi từ một nút bấm. Để có được onErrors(event, validator) để bắn, tôi đã sử dụng jQuery như sau:

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

Voila, @ Html.ValidationSummary populates ngay cả khi sử dụng jQuery.unobtrusive.

Một lớn nhờ vào Leniel Macaferi đã chỉ cho tôi đi đúng hướng ở đây: http://www.leniel.net/2013/08/customizing-aspnet-mvc-html-validation-summary-with-bootstrap-3-panel.html#sthash.jGRguVuV.qSjYUlhS.dpbs