title: Client Side Validation fails when moving to viewmodel
body: <p>This seems to a common question for lots of reasons that do not <em>seem</em> to apply to this situation.  I have create page using ASP.NET MVC 2 and I was using a strongly typed view to a class generated from DataEnities framework.</p>
  
  <pre><code>  &lt;%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master"     Inherits="System.Web.Mvc.ViewPage&lt;MVC_EDI.Models.wysCustomerEndPoint&gt;"" %&gt;
  </code></pre>
  
  <p>I made validation class that I bound back to the the data class. </p>
  
  <pre><code>[MetadataType(typeof(EndPointValidation))]
  public partial class wysCustomerEndPoint
  {        
  }
  
  [Bind()]
  public class EndPointValidation
  {
      [Required(ErrorMessage = "Please enter the end point name")]
      public string CustName { get; set; }
  </code></pre>
  
  <p>And I was able to use client side validation on my create page.  I had a requirement to add a dropdown list box on the create page, so I switched my view to use a viewmodel instead of the data class I was using.</p>
  
  <pre><code> public class CreateEditCustomerEndPointsViewModel
  {
      public wysCustomerEndPoint CustomerEndPoint {get; set;}
      public List&lt;SelectListItem&gt; DefaultLocationList { get; set; } 
  }
  </code></pre>
  
  <p>and here is the view header using the new viewmodel.</p>
  
  <pre><code>&lt;%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage&lt;MVC_EDI.ViewModles.CreateEditCustomerEndPointsViewModel&gt;" %&gt;
  </code></pre>
  
  <p>But now when this view gets loaded I am getting an error that my formElement is null when it tries to set a value ?  I error out here inteh MicrosofyMvcValidation.js file and the formElement array is null. </p>
  
  <pre><code>formElement['__MVC_FormValidation'] = this
  </code></pre>
  
  <p>I suspect I need to add some sort of data annotation or attribute to either my view model or something like that.  But I am not sure where? And surprisingly it seems to work out just fine in FireFox 5 but bombs in IE9?</p>
  
  <p>Edit: thanks for the reply. Yes I believe I am instantiating the object before adding to the ViewModel and using the Html.Helper objects?  Here is the code.</p>
  
  <pre><code> wysCustomerEndPoint ep = new wysCustomerEndPoint();
   ep.BuyerID = id;
   var viewModel = new CreateEditCustomerEndPointsViewModel()
   {
      CustomerEndPoint = ep
   };
   return View(viewModel);
  </code></pre>
  
  <p>and in the view</p>
  
  <pre><code>&lt;div class="editor-label"&gt;
      &lt;%: Html.Label("Name") %&gt;
  &lt;/div&gt;
  &lt;div class="editor-field"&gt;
      &lt;%: Html.TextBoxFor(model =&gt; model.CustomerEndPoint.CustName) %&gt;
      &lt;%: Html.ValidationMessageFor(model =&gt; model.CustomerEndPoint.CustName) %&gt;
  &lt;/div&gt;  
  </code></pre>
  
  <p>cheers</p>
  
  <p>bob</p>