title: MVC3 Client side validation erratic/inconsistent
body: <p>Server side validation works great but client side will not work on some fields.</p>
  
  <p>Using :</p>
  
  <pre><code>"jquery-1.5.1.min.js"  
  "modernizr-1.7.min.js"  
  "jquery.validate.min.js"  
  "jquery.validate.unobtrusive.min.js". 
  </code></pre>
  
  <p>HTML5 semantic markup</p>
  
  <p>MVC3, Razor, Code First</p>
  
  <p>Class Data Annotations:</p>
  
  <pre><code>using System.ComponentModel.DataAnnotations;
  
  [Required, MaxLength(30, ErrorMessage = "First Name must be {1} characters or less")]
  public string FirstName { get; set; }
  
  [Range(20, 50, ErrorMessage = "{0} must be between {1} and {2}")]
  public double Waist { get; set; }
  </code></pre>
  
  <p>View:</p>
  
  <p>The view is strongly typed.</p>
  
  <pre><code>@using (Html.BeginForm()) { @Html.ValidationSummary(true)
  
      &lt;span class="editor-label"&gt;  First Name &lt;/span&gt;
  
      &lt;span class="editor-field"&gt;
  
      @Html.EditorFor(model =&gt; model.FirstName)
  
      @Html.ValidationMessageFor(model =&gt; model.FirstName)
  
      &lt;/span&gt;&lt;br /&gt;&lt;br /&gt;
  
      &lt;span class="editor-label"&gt;@Html.LabelFor(model =&gt; model.Waist): 20 to 50&lt;/span&gt;
  
      &lt;span class="editor-field"&gt;
  
      @Html.EditorFor(model =&gt; model.Waist)
  
      @Html.ValidationMessageFor(model =&gt; model.Waist)
  
      &lt;/span&gt;&lt;br /&gt;&lt;br /&gt;
  </code></pre>
  
  <p>Client side validation works for Waist but not FirstName.  Server side works for both.</p>
  
  <p>When I look at the source code Waist has a data-val-range.</p>
  
  <p>data-val-range = "Waist must be between 20 and 50"</p>
  
  <p>There is no data-val-range for FirstName.</p>
  
  <p>Any help greatly appreciated.</p>
  
  <p>Thank you,</p>
  
  <p>Joe</p>
  
  <p>I'm using IE9 64 bit.</p>
  
  <p>Upon further investigation Required and String Length partially work.  I changed the Dataannotation attributes to this.</p>
  
  <pre><code>  [Required(ErrorMessage = "First Name is required")]       [StringLength(30, MinimumLength = 2, ErrorMessage = "First Name must be {2} to {1} characters")]     public string FirstName { get; set; }
  </code></pre>
  
  <p>Now when I go to my edit view and clear the FirstName textbox and tab to the next I get no validation error.  If I then enter one character I get the StringLength message, when I subsequently clear the field I then get the Required message.  Getting closer but it is still not working correctly.</p>
  
  <p>data-val-length= gets added to the source when I use StringLength</p>