Change field after filling the zip code - Html/Js

Asked

Viewed 57 times

-2

Personal have a form with the zip code field it after filling it should jump to the number field automatically.

</div>
                <div class="form-row">
                    <div class="form-group col-md-2">
                        <label for="cidade">CEP</label> <input type="text"
                        title="Preencha o campo Cep" required name=cep
                        maxlength="9"
                            class="form-control" id="cep" 
                            onkeypress="$(this).mask('00000-000')"
                            th:field="*{cep}" />
                        <div class="invalid-feedback"></div>
                    </div>
javascript html

  • Well, I would recommend inserting your text fields into an array, then adding to it an event, every time you go through some change in value (onchange), call a function that checks if the field is filled, and if so, change the style.focus for the next field, with the next index in the matrix.

1 answer

1

When it reaches the maximum number of characters in the input of the CEP he loses focus with the blur() and the input number wins focus with a focus().

Example:

function foco() {


var cep = document.getElementById('cep')
var num = document.getElementById('numero')

    if (cep.value.length == 9 ) {
        cep.blur()
        num.focus()

}
}
<label for="cep">CEP: </label> <input onkeyup="foco()" id="cep" type"txt" maxlength="9" minlength="9" required>
<label for="number">NÚMERO: </label> <input id="numero" type="text" minlength="9"
maxlength="11" >

Browser other questions tagged javascript html

You are not signed in. Login or sign up in order to post.