title: How to check datetime-local input field is not less than other datetime-local field
body: <p>I am creating a form, where i am using <code>datetime-local</code> for 2 input fields - StartDate and EndDate. </p>
  
  <p>How can I ensure EndDate is not less than StartDate. I wrote below JS, but it is not working on selecting date / or even onclick on submit button of the page.</p>
  
  <p>Please advise, and thanks for taking your time to read through this :)</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function checkDate() {
    var dateString = document.getElementById('StartDate').value;
    var dateString2 = document.getElementById('EndDate').value;
    var DateStart = new Date(dateString);
    var DateEnd = new Date(dateString2);
    if (DateEnd &gt; DateStart) {
      alert("End date cannot be less than Start date.");
      return false;
    }
    return true;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input type="datetime-local" class="form-control name_list" name="StartDate" id="StartDate" required="required" onclick="checkDate()" /&gt;
  &lt;/div&gt;
  &lt;div class="col-lg-1 mb-0"&gt;
    &lt;h6&gt;Deployment End *&lt;/h6&gt;
  &lt;/div&gt;
  &lt;div class="col-lg-3 mb-0"&gt;
    &lt;input type="datetime-local" class="form-control name_list" name="EndDate" id="EndDate" required="required" onclick="checkDate()" /&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>