2012-10-24 7 views
5

Mam następujący model:
Walidacja modelu MVC w dynamicznym formularzu?

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

po to moim zdaniem:

@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> 
} 

Jak widać, mamy formę do przesyłania jednego lub więcej plików. Tak więc dodałem przycisk + dla użytkowników, że mogą dodać pole pliku do utworzenia.

Użytkownicy muszą wpisać nazwę pliku i wybrać plik do przesłania. Ale walidator klienta MVC sprawdza poprawność pierwszych danych wejściowych dodanych z Razor.
Jak zmusić walidatora MVC do sprawdzania poprawności wszystkich pól po stronie klienta i po stronie serwera.

Kolejne pytanie brzmi:
Jak możemy obsłużyć coraz wartości pól w MVC Controller.

Dzięki

Odpowiedz

8

This great blog pomoże Ci zrozumieć, jak spoiwo domyślny model będzie wiązać list i tablic. Wystarczy dokonać ViewModel dla strony, która wygląda nieco jak poniżej:

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

Następnie w funkcji „+” jQuery, upewnij się, że generowane nazwy wejściowe są coś lFileModels.[0].Title (lub może to być lFileModels[0].Title, wystarczy kliknąć ten odnośnik a ty to rozgryziesz)

Następnie, aby uzyskać te informacje w kontrolerze, jest to jak każda inna forma!

[HttpPost] 
public ActionResult Index(FileUploadViewModel viewModel) 
{ 

} 

Edit

Another link dla pliku MVC przesyłasz

Edycja 2

Po ponownym przeczytaniu kodu raz, ja sobie teraz sprawę, że problem walidacji jest wynikiem dodawania dyskretny sprawdzanie poprawności po załadowaniu biblioteki. Musisz ponownie przeanalizować walidatory.

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

Wiązanie dotyczy walidacji po stronie serwera i drugiej części pytania.

Edycja 3

Przez dodanie pól, zamiast robić to prosto w JS, Ajax należy załadować sekcję formularza z polami plików. Po kliknięciu przycisku dodawania pojawia się żądanie częściowego wyświetlenia pól pliku z listą bieżących elementów, w swoich danych pocztowych. Widok częściowy zwraca następnie renderowany widok z dodatkowym polem. To tylko pomysł. Nie próbowałem ani nawet nie widziałem tego pomysłu. Właśnie o tym pomyślałem i doszedłem do wniosku, że mogę się nim podzielić.

+0

Moje pytanie nie dotyczyło tylko wiązania modelu danych, główne pytanie dotyczyło sprawdzania poprawności strony klienta w polach wejściowych, które dodano do javascript –

+0

. Odpowiedziałem na oba pytania rozwiązaniami, ale nie wyjaśnieniami. Przepraszamy, edytuję mój wpis. – Pluc

+0

Po lekturze jeszcze raz uświadamiam sobie, że byłem poza torem. Cały mój post odpowiada tylko na twoje pytanie dodatkowe i weryfikację po stronie serwera. To nie ma wpływu na stronę klienta. Edit2 jest odpowiedzią na oryginalny post. Powinieneś używać właściwych terminów w swoich tytułach pytań. Walidacja modelu to sprawdzanie poprawności po stronie serwera. Dlatego się pogubiłem (ale tak, powinienem był poświęcić więcej uwagi także samemu stanowisku). – Pluc

Powiązane problemy