title: How can I implement jQuery validation like MVC data annotation?
body: <p>I am using MVC and have a master/details view page. Details is actually a partial view with some input fields an a save button as shown below. </p>
  
  <pre><code>&lt;button type="button" id="btnAddDetails" class="btn btn-primary"&gt;Add Details &lt;span class="glyphicon glyphicon-plus"&gt;&lt;/span&gt;&lt;/button&gt;
  </code></pre>
  
  <p>The save button will save the details  data temporarily. </p>
  
  <p>There is a submit button in the main view. When I click on the submit button it saves master and details data in the respective tables. I want to validate master and details fields individually. When I click on the button in details view (partial view) it will validate the data with the details model and final submit will check the master data with the master model. Master data validation can be done easily by using data annotation. But how can I validate details. Because both master and details are placed in a single <code>Html.BeginForm()</code>. I am trying jQuery to validate details on button click event :</p>
  
  <pre><code>if ($('#Disc').val() == '')
  {
      $('data-valmsg-for="Disc"').val("Please enter Diacount");
      return false;
  }
  </code></pre>
  
  <p>I use <code>data-valmsg-for</code> because in the view source page HTML is like:</p>
  
  <pre><code>&lt;input class="form-control text-box single-line" data-val="true" data-val-number="The field Discount must be a number." id="Disc" name="Disc" type="text" value=""&gt;
  
  &lt;span class="field-validation-valid text-danger" data-valmsg-for="Disc" data-valmsg-replace="true"&gt;&lt;/span&gt;
  </code></pre>
  
  <p>And I am getting an error like </p>
  
  <p><code>Uncaught Error: Syntax error, unrecognized expression: data-valmsg-for="Disc"</code></p>
  
  <p>How can I validate details part like data annotation in master.</p>