Xác thực mô hình MVC trên biểu mẫu động?

Question

Tôi có Model sau:

public class FileModel 
{ 
    public int Id { get; set; } 

    [Required(ErrorMessage = "Required")] 
    [StringLength(100, ErrorMessage = "Max is 100, Min is 3", MinimumLength = 3)] 
    public string Name { get; set; } 

    public string Path { get; set; } 

    [Required(ErrorMessage = "Required")] 
    public string FileTypeId { get; set; } 

    public DateTime RegistrationDate { get; set; } 
} 

sau đây là quan điểm của tôi:

@using (Html.BeginForm("Index", "FileManagement", FormMethod.Post, new { enctype = "multipart/form-data" })) 
{ 
    <table class="content-table" style="min-width: 600px; border-spacing: 15px;"> 
     <tr> 
      <td colspan="4" class="table-header">New File 
       <div class="add-icon">+</div> 
      </td> 
     </tr> 
     <tr> 
      <td>Name: </td> 
      <td>@Html.TextBoxFor(q => q.NewFile.Name, new { maxlength = "100", id = "NewFile_Name1", name = "NewFile.Name1" }) 
       <br />@Html.ValidationMessageFor(q => q.NewFile.Name) 
      </td> 
      <td> 
       <input type="file" id="FileUploadField1" /></td> 
      <td style="width: 16px; text-align: center;">&nbsp;</td> 
     </tr> 
     <tr> 
      <td colspan="4" style="text-align: center;"> 
       <input type="submit" value="Submit" /> 
      </td> 
     </tr> 
    </table> 
    <script type="text/javascript"> 

     $('.content-table .add-icon').click(function() { 
      var lastFileField = $('.content-table input[type="file"]').last(); 
      var lastId = lastFileField.attr('id').replace(/\D*/g, ''); 
      lastId = parseInt(lastId) + 1; 
      var newFields = '<tr>' + 
       '<td>Name : </td>' + 
       '<td><input data-val="true" data-val-length="Max chars is 100, Min chars is 3" data-val-length-max="100" data-val-length-min="3" data-val-required="Required" id="NewFile_Name' + lastId + '" name="NewFile.Name' + lastId + '" type="text" value="" /><br /><span class="field-validation-valid" data-valmsg-for="NewFile.Name' + lastId + '" data-valmsg-replace="true"></span></td>' + 
       '<td><input type="file" id="FileUploadField' + lastId + '"/></td>' + 
       '<td style="text-align:right;"><div class="delete-icon"></div></td>' + 
       '</tr>'; 
      var lastTr = $(lastFileField).parents('tr:first')[0]; 
      $(lastTr).after(newFields); 
     }); 

     $('.content-table .delete-icon').live('click', function() { 
      $(this).parents('tr:first').remove(); 
     }); 
    </script> 
} 

Như bạn có thể thấy, chúng ta có một hình thức để tải lên một hoặc nhiều file. Vì vậy, tôi đã thêm một nút + cho người dùng rằng họ có thể thêm một trường tệp để tạo thành.

Người dùng phải nhập tên tệp và chọn tệp để tải lên. Nhưng trình xác thực ứng dụng khách của MVC chỉ xác thực các đầu vào đầu tiên được thêm vào với Razor.

Làm cách nào để buộc trình xác thực MVC xác thực tất cả các trường ở phía máy khách và phía máy chủ.

câu hỏi khác là:
Làm sao chúng ta có thể xử lý nhận các giá trị thực tế tại một Controller MVC.

Cảm ơn

Answer 1

This great blog sẽ giúp bạn hiểu làm thế nào mô hình mặc định binder sẽ ràng buộc danh sách và mảng. Chỉ cần làm một ViewModel cho trang của bạn trông hơi như thế này:

public class FileUploadViewModel 
{ 
    public List<FileModel> lFileModels { get; set; } 
} 

Sau đó, trong "+" jQuery chức năng của bạn, hãy chắc chắn tên đầu vào tạo ra được một cái gì đó giống như lFileModels.[0].Title (hoặc nó có thể là lFileModels[0].Title, chỉ cần nhấp vào liên kết và bạn sẽ tìm ra nó)

Sau đó, để có được thông tin đó trong bộ điều khiển, nó giống như bất kỳ hình thức nào khác!

[HttpPost] 
public ActionResult Index(FileUploadViewModel viewModel) 
{ 

} 

Sửa

Another link cho file MVC tải lên

Chỉnh sửa 2

Sau khi đọc mã của bạn một lần nữa, bây giờ tôi nhận ra rằng vấn đề xác nhận là do thêm không phô trương xác nhận sau khi thư viện được tải. Bạn phải phân tích lại các trình xác nhận.

$("form").data("validator", null); 
$.validator.unobtrusive.parse($("form")); 

Ràng buộc áp dụng cho xác thực phía máy chủ và phần thứ hai của câu hỏi của bạn.

Sửa 3

Để thêm lĩnh vực, thay vì làm nó thẳng trong JS, bạn nên Ajax tải phần hình thức của bạn với các lĩnh vực tập tin. Khi bạn nhấp vào nút thêm, nó yêu cầu xem một phần của các trường tệp với, trong dữ liệu bài đăng của nó, một danh sách các mục hiện tại. Chế độ xem một phần sau đó sẽ trả lại một chế độ xem được hiển thị với một trường bổ sung. Nó chỉ là một ý tưởng. Tôi đã không cố gắng hoặc thậm chí thấy ý tưởng đó. Tôi chỉ mặc dù về nó và figured tôi có thể chia sẻ nó.