title: Call MVC 3 Client Side Validation Manually for ajax posts
body: <p>I am creating an MVC 3 web application. I want to use Data Annotations on my entity class and then use unobtrusive client side validation before making a post back to the server. This works fine when making a regular post. I get validation and the validation summary if any of the fields are not valid. However, I want to post back the information via ajax and json. How can I 'manually' validate the form on the client side first then make my ajax post back to the server. Below is a summarized version of my code.</p>
  
  <pre><code>  public class Customer
      {
          [Required(ErrorMessage = "The customer's first name is required.")]
          public string FirstName { get; set; }
  
          [Required(ErrorMessage = "The customer's last name is required.")]
          public string LastName { get; set; }
      }
  
  
  
      &lt;% using (Html.BeginForm()) { %&gt;
  
      &lt;%: Html.LabelFor(model =&gt; model.FirstName, "First Name")%&gt;
      &lt;%: Html.TextBoxFor(model =&gt; model.FirstName, new { @class = "TextBox", id = "Customer.FirstName" })%&gt;
      &lt;%: Html.ValidationMessageFor(model =&gt; model.FirstName, "*")%&gt;
  
      &lt;%: Html.LabelFor(model =&gt; model.LastName, "Last Name")%&gt;
      &lt;%: Html.TextBoxFor(model =&gt; model.LastName, new { @class = "TextBox", id = "Customer.LastName" })%&gt;
      &lt;%: Html.ValidationMessageFor(model =&gt; model.LastName, "*")%&gt;
  
      &lt;div id="CustomerEditSave" class="Button CustomerEditButtons" style="margin-right:40px;"&gt;
         &lt;a href="#"&gt;Save&lt;/a&gt;
      &lt;/div&gt;
  
      &lt;%: Html.ValidationSummary(true) %&gt;
  
      &lt;% } %&gt;
  </code></pre>
  
  <p>I have tried this code but it only validates the first name and does not display the validation summary.</p>
  
  <pre><code>    $("#CustomerEditSave").click(function () {
          $(form).validate();
          //Ajax call here
      });
  </code></pre>