There’s a box with six entries. If the desired number is directly pasted into the boxes..
123456
How do I distribute the numbers to the other boxes when they are pasted into the first box?
on JSfiddle
Javascript:
var $inp = $(".passInput");
$inp.on({
input: function(ev) {
if(this.value) {
$inp.eq($inp.index(this) + 1).focus();
}
},
keydown: function(ev) {
var i = $inp.index(this);
if(ev.which===8 && !this.value && i) {
$inp.eq(i - 1).focus();
}
}
});
HTML:
<form action="" role="form" method="post" id="passForm">
<input type="text" class="passInput" name="pass[]" maxLength="1" size="1" autocomplete="off" min="0" max="9" required pattern="\d{1}" autofocus>
<input type="text" class="passInput" name="pass[]" maxLength="1" size="1" autocomplete="off" min="0" max="9" required pattern="\d{1}">
<input type="text" class="passInput" name="pass[]" maxLength="1" size="1" autocomplete="off" min="0" max="9" required pattern="\d{1}">
<input type="text" class="passInput" name="pass[]" maxLength="1" size="1" autocomplete="off" min="0" max="9" required pattern="\d{1}">
<input type="text" class="passInput" name="pass[]" maxLength="1" size="1" autocomplete="off" min="0" max="9" required pattern="\d{1}">
<input type="text" class="passInput" name="pass[]" maxLength="1" size="1" autocomplete="off" min="0" max="9" pattern="\d{1}">
<button type="submit" class="btn btn-lg btn-primary">SUBMIT</button>
</form>