ASP.NET MVC 4 IEnumerable <MyModel> validation côté client

Question

J'ai vue principale et partielle:

// // GET :/Question/Ajouter/

public ActionResult Add() 
{ 
    return View(); 
} 

// 
// Post: /Question/GetAnswerContainers/ 
[HttpPost] 
public ActionResult GetAnswerContainers(int count) 
{ 
    ViewBag.AnswerCount = count; 
    return PartialView(); 
} 

Vue principale est assez simple :

@using (@Html.BeginForm()) 
{ 
    @Html.AntiForgeryToken() 

    <fieldset> 
     <legend>Add Question Form</legend> 


     <div id="question_answers"> 
      @Html.LabelFor(m => m.AnswerCount) 
      @Html.TextBoxFor(m => m.AnswerCount, 
       new { 
         @class = "answer_count", 
         action = @Url.Action("GetAnswerContainers") 
        })<br/> 
      @Html.ValidationMessageFor(m => m.AnswerCount)<br/> 

      <div id="answers"></div> 
     </div> 

     <input type="submit" value="Add" /> 
    </fieldset> 
} 

J'ai aussi jQuery pour ma zone de texte:

$(function() { 
    $('#question_answers input[type="text"].answer_count').keyup(function() { 
     var answerCount = $(this).val(); 
     if (isNaN(answerCount)) 
      return;    

     $.ajax({ 
      type: 'POST', 
      data: { count: $(this).val() }, 
      url: $(this).attr("action"), 
      timeout: 2000, 
      async: false, 
      success: function (data) { 
       removeAnswers(); 
       addAnswers(data); 

       $('form').removeData('validator'); 
       $('form').removeData('unobtrusiveValidation'); 
       $.validator.unobtrusive.parse('form'); 
      }, 
      error: null 
     }); 
    }); 
}); 

function addAnswers(data) { 
    var answersContainer = $('#question_answers #answers');  
    answersContainer.append($((data))); 
} 

Vue partielle:

@model Quiz.Models.Question.QuestionAnswer 

@Html.LabelFor(m => m.AnswerText) 
@for (var i = 0; i < ViewBag.AnswerCount; i++) 
{ 
    @Html.TextBoxFor(m => m.AnswerText) 
    @Html.ValidationMessageFor(m => m.AnswerText)  
} 

Modèle:

public class QuestionAnswer 
{ 
    [Required] 
    [Display(Name = "Answers")] 
    public string AnswerText { get; set; } 
} 

donc mon problème que la validation côté client standard asp.net ne peut pas traiter avec de nombreux objets de modèle QuestionAnswer, il est prendre la première textBox à partir de for boucle et l'utiliser pour valider toute vue partielle. Est-il possible de valider correctement plusieurs objets d'un modèle côté client?

Answer 1

Le problème ici est avec le nom des zones de texte AnswerText. Ils ont tous le même nom et le cadre de validation côté client discret ne serait pas comment à quel élément à attacher. Donc, il attache simplement à la première.

Je vous recommande de passer par le following article dans lequel Steven Sanderson illustre une petite petite aide appelée Html.BeginCollectionItem qui utilise Guids pour les index des articles de collection. Cela permettrait à la validation côté client de fonctionner correctement.