Switch to function typescript html code

0

I have a code that passes me from input to input automatically when it reaches maxlength and what I wanted was to pass it to a function, my little knowledge of ts or js makes me not know where to throw, I leave what I have

<input type="text" id="input10" class="input" placeholder="code" maxlength="4" onkeyup="if (this.value.length == this.getAttribute('maxlength')) input20.focus()" />

<input type="text" id="input20" class="input" placeholder="code" maxlength="4" onkeyup="if (this.value.length == this.getAttribute('maxlength')) input30.focus()" />

<input type="text" id="input30" class="input" placeholder="code" maxlength="4" onkeyup="if (this.value.length == this.getAttribute('maxlength'))" />

and in ts

inputPass(value) {
  value;

  if (value.length == document.getElementById('input1').getAttribute('maxlength')){
      document.getElementById("input2").focus();

  }

  if (value.length == document.getElementById("input2").getAttribute('maxlength')){
      document.getElementById("input3").focus();

  }

  if (value.length == document.getElementById("input3").getAttribute('maxlength')) {
      document.getElementById("input1").focus();

  }

}

I understand that when I have the function I will have to change it by the existing code in an onchange

    
asked by Carlos 20.07.2018 в 10:50
source

1 answer

1

In the end it worked for me doing it this way, I hope it works for some more

inputPass(value) {

    if (value.length == document.getElementById('input' + this.value1).getAttribute('maxlength')) {
        if (this.value1 != 3) {

            this.value1++;
            document.getElementById("input" + this.value1).focus();
        }
        else {
            this.value1 = 1;
        }
    }

}
    
answered by 20.07.2018 в 13:11