JQuery autosubmit

Question

I have a form with three input elements. I want to run my validate function when the last input element is not equal to null. Any ideas please. Here's the code :

$(document).ready(function () {

 $("#number input").keyup(function () {
    if (this.value.length == this.maxLength) {
      $(this).next('#number input').focus();     
    }
 });

})

Here's the HTML :

 <div id="number">
      <form action="" id="myform">
        <input placeholder="hr" maxlength="2" type="number" id="uHrs" pattern="[1-12]" autofocus></input>
        <input placeholder="min" maxlength="2" type="number" id="uMins" pattern="[0-59]"></input>
        <input placeholder="sec" maxlength="2" type="number" id="uSecs" pattern="[0=50]"></input>
        <button type="submit" id="subtime" value="submit" onclick="checkInput()">Submit</button>
      </form>

Answer 1

You can try filter, also I use the input event so we can paste. We could even split a too long number and spread it to the next fields if we want to support pasting the complete set of values

Full solution: https://jsfiddle.net/mplungjan/3mbqw80h/

$(function() {
  const $inputs = $("#number input"),
    $form = $("#number");
  $inputs.on("input", function() {
    if (this.value.length == this.maxLength) {
      const $next = $(this).next('#number input');
      if ($next.length) $next.select().focus();
      if ($inputs.filter(function() {
          return this.value.trim() !== ""
        }).length === $inputs.length) {
        checkInput();
      }
    }
  });
})