title: Validation in jquery for bootstrap popup
body: <p>Here is my View:</p>
  
  <pre><code>@using (Html.BeginForm("SaveNewCustomer", "Dealer", FormMethod.Post, new { id = "myForm" }))
  {
      &lt;div class="form-horizontal"&gt;
                          &lt;div class="row"&gt;
  
                              &lt;div class="form-group-1"&gt;
                                  @Html.LabelFor(model =&gt; model.device.MotorType, htmlAttributes: new { @class = "control-label col-lg-4" })
                                  @Html.EditorFor(model =&gt; model.device.MotorType, new { htmlAttributes = new { @class = "form-control required", placeholder = "Motor Type", required = "required" } })
                              &lt;/div&gt;
                              &lt;div class="form-group-1"&gt;
                                  @Html.LabelFor(model =&gt; model.device.PowerRating, htmlAttributes: new { @class = "control-label col-lg-4" })
                                  @Html.EditorFor(model =&gt; model.device.PowerRating, new { htmlAttributes = new { @class = "form-control required", placeholder = "Power Rating", required = "required" } })
                              &lt;/div&gt;
                              &lt;div class="form-group-1"&gt;
                                  @Html.LabelFor(model =&gt; model.device.InstallationDate, htmlAttributes: new { @class = "control-label col-lg-4" })
                                  @Html.EditorFor(model =&gt; model.device.InstallationDate, new { htmlAttributes = new { @class = "form-control datepicker required", placeholder = "Installation Date(MM/dd/yyyy)", required = "required" } })
                              &lt;/div&gt;
                              &lt;div class="form-group-1"&gt;
                                  @Html.LabelFor(model =&gt; model.device.ActivationDate, htmlAttributes: new { @class = "control-label col-lg-4" })
                                  @Html.EditorFor(model =&gt; model.device.ActivationDate, new { htmlAttributes = new { @class = "form-control datepicker required", placeholder = "Activation Date(MM/dd/yyyy)", required = "required" } })
                              &lt;/div&gt;
                              &lt;div class="form-group-1"&gt;
                                  @Html.LabelFor(model =&gt; model.device.DataReceiveInterval, htmlAttributes: new { @class = "control-label col-lg-4" })
                                  @Html.EditorFor(model =&gt; model.device.DataReceiveInterval, new { htmlAttributes = new { @class = "form-control required", placeholder = "Data receive Interval", required = "required" } })
                              &lt;/div&gt;
                              &lt;div class="form-group-1"&gt;
                                  @Html.LabelFor(model =&gt; model.device.HasAMC, htmlAttributes: new { @class = "control-label col-lg-4" })
                                  @Html.EditorFor(model =&gt; model.device.HasAMC, new { htmlAttributes = new { @class = "form-control required", @onchange = "OnChange();" } })
                              &lt;/div&gt;
                              &lt;div class="form-group-1" id="HasDate"&gt;
                                  @Html.LabelFor(model =&gt; model.device.AMCExpiredDate, htmlAttributes: new { @class = "control-label col-lg-4" })
                                  @Html.EditorFor(model =&gt; model.device.AMCExpiredDate, new { htmlAttributes = new { @class = "form-control required", placeholder = "AMCExpireDate(MM/dd/yyyy)", required = "required", title = "Enter AMC Expire Date" } })
                              &lt;/div&gt;
                              &lt;button style="margin-left:33%;" id="action" class="btn btn-sm btn-primary col-lg-2 " type="button" name="action" value="SaveDeviceInfo"&gt;&lt;strong&gt;Save&lt;/strong&gt;&lt;/button&gt;
  
                          &lt;/div&gt;
                      &lt;/div&gt;
  }
  </code></pre>
  
  <p>My javascript script is</p>
  
  <pre><code> &lt;script type="text/javascript"&gt;
          $(document).ready(function () {
              jQuery.validator.setDefaults({
                  debug: true,
                  success: "valid"
              });
              $( "#myForm" ).validate({
                  rules: {
                      "client.ContactNo": {
                          required: true
                      }
                  }
              });
  
              $("#action").click(function () {               
                  if (!$("#myForm").validate()) { // Not Valid
                      return false;
                  } else {
                      Save();
                  }
              });
     function Save() {
  
              var frm = $("#myForm").serialize();
              $.ajax({
                  url: "/Dealer/SaveNewCustomer",
                  data: frm,
                  type: "POST",
                  success: function (result) {
                      if (result == "true") {
                          //alert(result);
                          window.location.href = "/Dealer/Customers?Success=true&amp;Message=Customer updated successfully.";
                      }
                      else
                          toastr.error(result);
                  }
              });
          }
   &lt;/script&gt;
  </code></pre>
  
  <p>Problem is Validation not fire. In If else condition it is showing false and direct store the value in database. Could you please help me? 
  Is anything wrong in my code? Give me suggestions please.
  Thanks in advance.</p>