A mensagem de CEP inválido não está aparecendo, apenas quando se volta e sai uma segunda vez do campo. Há alguma forma de resolver isso?
A mensagem de CEP inválido não está aparecendo, apenas quando se volta e sai uma segunda vez do campo. Há alguma forma de resolver isso?
Oi Alex, coloca teu código dentro </> para que possamos dar uma olhada e te ajudar.
Fico no aguardo...
Olá!
Segue o código abaixo:
function recuperarCEP(input) {
const cep = input.value.replace(/\D/g, '');
const url = `https://viacep.com.br/ws/${cep}/json/`;
const options = {
method: 'GET',
mode: 'cors',
headers: {
'content-type': 'application/json;charset=utf-8'
}
}
if (!input.validity.patternMismatch && !input.validity.valueMissing) {
fetch(url,options).then(
response => response.json()
).then(
data => {
if(data.erro) {
input.setCustomValidity('Não foi possível buscar o CEP');
return
}
input.setCustomValidity('');
preencheCamposComCEP(data);
return
}
)
}
}
function preencheCamposComCEP(data) {
const logradouro = document.querySelector('[data-tipo="logradouro"]');
const cidade = document.querySelector('[data-tipo="cidade"]');
const estado = document.querySelector('[data-tipo="estado"]');
logradouro.value = data.logradouro;
cidade.value = data.localidade;
estado.value = data.uf;
}
Agradeço o retorno =)
Olá Alex, tudo bem?
Me parece que seu código está tudo ok.
Essa mensagem de CEP inválido ela demora um tempo para aparecer, porque ele precisa fazer a requisição, buscar o erro nela e então mostrar que o CEP é inválido para o usuário.