title: Starting client-side validation when using BeginForm helper
body: <p>I am working on a asp.net mvc 3 application and I have problem with getting my unobtrusive JS validation to work. I've asked very similar question but since I don't get any answers but think that I managed to define my problem better I write this question now.</p>
  
  <p>Searching for an answer for how to get the client-side validation working I saw that there must be some code attached to the click event of the submit button which will start the validation process. I'm not 100% sure that this is so, and this is in fact my problem, but if I'm correct could you help me with the JS I need to add so the validation process can be triggered.</p>
  
  <p>This is my form :</p>
  
  <pre><code>@using (Html.BeginForm("RecieveDataFromDocument", "Forms", FormMethod.Post))
  {
      @Html.ValidationSummary(true)
      &lt;table border="1"&gt;
          &lt;colgroup&gt;
              &lt;col span="1" style="width: 10%;" /&gt;
              &lt;col span="1" style="width: 40%;" /&gt;
              &lt;col span="1" style="width: 25%;" /&gt;
              &lt;col span="1" style="width: 25%;" /&gt;
          &lt;/colgroup&gt;
          @Html.Partial("_PartialHeader", Model)
          @Html.Partial("_PartialDrawing", Model)
          @Html.Partial("_PartialBody", Model)
          @Html.Partial("_PartialFooter", Model)
      &lt;/table&gt;
      if (ViewBag.Status == 1)
      {
          &lt;button type="submit" id="submitDocument"&gt;Save&lt;/button&gt;   
      }
      else
      { 
          @Html.ActionLink("Back", "Index")
      }
  }
  </code></pre>
  
  <p>and at the bottom of the same view I have this JS :</p>
  
  <pre><code>&lt;div&gt;
  &lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          $('#submitDocument').click(function () {
              window.alert('Hi');
              var test = ($("form").valid());
              window.alert('bye');
          })
      });
  &lt;/script&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>From what I've tested till now I can see the <code>Hi</code> message but even if I comment it I never get the <code>bye</code>. So any help would be appreciated.</p>
  
  <p>P.S</p>
  
  <p>I have this included in my <code>_Layout</code> page :</p>
  
  <pre><code>&lt;script src="@Url.Content("~/Scripts/jquery-1.8.3.min.js")" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="@Url.Content("~/Scripts/jquery-ui-1.10.3.custom.min.js")" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="@Url.Content("~/Scripts/plugins/jqGrid/jquery-ui-1.8.16.custom.min.js")" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="@Url.Content("~/Scripts/PageHelpers/jqDateTimePicker.js")" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="@Url.Content("~/Scripts/plugins/jquery.validate.unobtrusive.js")" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="@Url.Content("~/Scripts/plugins/jquery.validate.js")" type="text/javascript"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>and  I tried to explicitly include those :</p>
  
  <pre><code> &lt;script src="@Url.Content("~/Scripts/plugins/jquery.validate.unobtrusive.js")" type="text/javascript"&gt;&lt;/script&gt;
   &lt;script src="@Url.Content("~/Scripts/plugins/jquery.validate.js")" type="text/javascript"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>in my view. So with this set-up it's not working.</p>