MVC 2 RC: Does Client-side Validation using Data Annotations work with Lists? RSS

• • Reply
  

  ozmosis

  Member

  8 Points

  23 Posts

  MVC 2 RC: Does Client-side Validation using Data Annotations work with Lists?

  Jan 27, 2010 01:06 PM|LINK

  In my view data class I have a List.

  public class FriendsViewData
  {
      public List<Person> people { get; set; }
  }

  I have all the properties of the class Person as required using Data Annotations.

  public class Person
  {
      [Required(ErrorMessage="First Name is required")]
      public string FirstName { get; set; }
  }

  In the View I loop the List like this: ... 

  <script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
  <script src="/Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script>
  
  <% Html.EnableClientValidation(); %>
  
  <% using (Html.BeginForm()) {%>
  
  <% 
     for (int i = 0; i < Model.people.Count; i++ )
     {%>
  
         <div>
           <%= Html.TextBox(string.Format("people[{0}].FirstName",i), Model.people[i].FirstName)%>
           <%= Html.ValidationMessage(string.Format("people[{0}].FirstName", i))%>
         </div>
  
  
    <%  } %>
  
  <input type="submit" value="Submit" />
  
  <% } %>

  Generated HTML:
  

  <div>
      <input id="people_0__FirstName" name="people[0].FirstName" type="text" value="Name0" />
      <span class="field-validation-valid" id="form0_people_0__FirstName_validationMessage"></span>     
  </div>
  
  <div>
      <input id="people_1__FirstName" name="people[1].FirstName" type="text" value="Name1" />
      <span class="field-validation-valid" id="form0_people_1__FirstName_validationMessage"></span>     
  </div>
  
  <div>
      <input id="people_2__FirstName" name="people[2].FirstName" type="text" value="Name2" />
      <span class="field-validation-valid" id="form0_people_2__FirstName_validationMessage"></span>     
  </div>

  Result:

  Does not work at all.

  Other things I've tried:

  Tried using these HTML Helper methods instead:

      <div>
          <%= Html.TextBoxFor(model => model.people[i].FirstName) %>
          <%= Html.ValidationMessageFor(model => model.people[i].FirstName) %>
      </div>

  Generated output:

         <div>  
             <input id="FirstName" name="FirstName" type="text" value="Name0" />  
             <span class="field-validation-valid" id="form0_FirstName_validationMessage"></span>  
         </div>  
  
         <div>  
             <input id="FirstName" name="FirstName" type="text" value="Name1" />  
             <span class="field-validation-valid" id="form0_FirstName_validationMessage"></span>  
         </div>  
  
         <div>  
             <input id="FirstName" name="FirstName" type="text" value="Name2" />  
             <span class="field-validation-valid" id="form0_FirstName_validationMessage"></span>  
         </div> 

  Result:

  Interestingly, when I trigger a validation on the first textbox, it fires simultaneously for all of the textboxes. The rest of the textboxes do not trigger validation at all.

  Looking at the generated id and names for the textboxes and their corresponding error text span element, they are all identical.

  
  

  Anyone figure out how to use Client Validation with Data Annotations with a List in the view data, supporting Model Binding?

  Thank you for your attention!
  

  viewstate MVC view data client-side validation dataannotations ModelBinder client side validation

  • Edited by ozmosis on Jan 27, 2010 01:15 PM
  • Edited by ozmosis on Jan 27, 2010 01:21 PM
  • Edited by ozmosis on Jan 27, 2010 01:22 PM
  • Edited by ozmosis on Jan 27, 2010 01:26 PM
  • Edited by ozmosis on Jan 27, 2010 01:27 PM
  • Edited by ozmosis on Jan 27, 2010 01:28 PM
  • Edited by ozmosis on Jan 27, 2010 01:29 PM
  • Edited by ozmosis on Jan 27, 2010 01:31 PM
  • Edited by ozmosis on Jan 27, 2010 01:39 PM
  • Edited by ozmosis on Jan 27, 2010 01:40 PM
  • Edited by ozmosis on Jan 27, 2010 03:01 PM
  • Edited by ozmosis on Jan 27, 2010 03:02 PM
  • Edited by ozmosis on Jan 27, 2010 03:05 PM
• • Reply
  

  bradwils

  Contributor

  5779 Points

  691 Posts

  Microsoft

  Re: MVC 2 RC: Does Client-side Validation using Data Annotations work with Lists?

  Jan 27, 2010 03:32 PM|LINK

  ozmosis

  <div class="dp-highlighter">

  1. <div>  
  2.     <%= Html.TextBoxFor(model => model.people[i].FirstName) %>  
  3.     <%= Html.ValidationMessageFor(model => model.people[i].FirstName) %>  
  4. </div>  

  </div>

  This is the correct way to do it, but it's broken right now, and will be fixed in the next drop.

  • Edited by ozmosis on Jan 27, 2010 04:12 PM
  • Edited by ozmosis on Jan 27, 2010 05:08 PM
  • Marked as answer by ricka6 on Jan 29, 2010 08:37 PM
• • Reply
  

  ozmosis

  Member

  8 Points

  23 Posts

  Re: MVC 2 RC: Does Client-side Validation using Data Annotations work with Lists?

  Jan 27, 2010 04:10 PM|LINK

  Ok, great thanks.

  This way is the only way that ModelBinding is working for Lists in the viewdata.

  <input id="people_0__FirstName" name="people[0].FirstName" type="text" value="Name0" />

  So what can be done right now with ASP.Net MVC 2 RC for the scenario of Lists with Client-side validation?

  Thanks again.
  

  
  

  • Edited by ozmosis on Jan 27, 2010 04:48 PM
  • Edited by ozmosis on Jan 27, 2010 04:54 PM
  • Edited by ozmosis on Jan 27, 2010 04:54 PM
• • Reply
  

  bradwils

  Contributor

  5779 Points

  691 Posts

  Microsoft

  Re: MVC 2 RC: Does Client-side Validation using Data Annotations work with Lists?

  Jan 28, 2010 02:02 AM|LINK

  Yes, the model binding problem is fixed, too. We haven't announced when the next drop will be.

  • Marked as answer by ricka6 on Jan 29, 2010 02:35 AM
• • Reply
  

  ozmosis

  Member

  8 Points

  23 Posts

  Re: MVC 2 RC: Does Client-side Validation using Data Annotations work with Lists?

  Jan 28, 2010 03:50 PM|LINK

  Ok, sounds good. Thanks Brad.