title: jquery datepicker throwing error in different browsers with mvc
body: <p>my view to display date from database</p>
  
  <pre><code>&lt;div class="input-group"&gt;
      @Html.TextBoxFor(model =&gt; model.domain_renew_date, "{0:dd/MMM/yyyy}", new { @type = "datetime", @class = "form-control" })
      @Html.ValidationMessageFor(model =&gt; model.domain_renew_date, "", new { @class = "text-danger" })
  &lt;/div&gt;
  </code></pre>
  
  <p>my javascript for datepicker</p>
  
  <pre><code> &lt;script type="text/javascript"&gt;
      $(document).ready(function () {
          $('input[type="datetime"]').datepicker({
              dateFormat: "dd/MM/yy",
              changeMonth: true,
              changeYear: true,
              yearRange: "c-10:c+10"
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>model where the property is declared</p>
  
  <pre><code>[Display(Name = "Date of Renewal")]
  [DataType(DataType.Date)]
  [RequiredIf("domain_flag", "1", ErrorMessage = "Enter Renew Date")]
  public DateTime? domain_renew_date { get; set; }
  </code></pre>
  
  <p>in web.config</p>
  
  <pre><code>&lt;system.web&gt;
    &lt;globalization uiCulture="en" culture="en-GB" /&gt;
  &lt;/system.web&gt;
  </code></pre>
  
  <p>This is working perfectly fine in chrome and Firefox. But gives the following error in IE and Safari</p>
  
  <blockquote>
    <p>The field Date of Renewal must be a date</p>
  </blockquote>
  
  <p>What changes can be done in the code to make it work perfectly fine in all the browsers? </p>