Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery validation fails when putting step="1" in a "datetime-local" input type

I'm using https://jqueryvalidation.org/ form validation plugin

When I put step="1" in a datetime-local input field to show seconds, if I'm validating that field with the plugin (just "required", for example), I get a javascript error saying "Step attribute on input type datetime-local is not supported". If I put this step="1" in a field that is not being validated, it works without problems.

$("#testingform").validate();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.validate.min.js"></script>
<form id="testingform">
    <input type="datetime-local" step="1" name="date1" required>
    <button type="submit">Send</button>
</form>

... just put a date and time WITH SECONDS, and click 'Send' button. You can see the error in the console.

I've already opened a bug in the github page of the project, but maybe any of you had the same problem and have found a way to solve it or at least avoid it for the moment until they fix it.

like image 473
A. Iglesias Avatar asked Sep 29 '17 08:09

A. Iglesias


1 Answers

jQuery validate automatically apply rules on input type, so step cannot be validated.

This will help you:

$("#testingform").validate({
  rules: {
    date1: {step: false}
  }
});
<form id="testingform">
    <input type="datetime-local" step="1" name="date1" required>
    <button type="submit">Send</button>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.validate.min.js"></script>
like image 152
Vixed Avatar answered Sep 22 '22 22:09

Vixed