0
Speak personal, I am developing an edition page where on this screen contains the user data, in the same, we have a new address button, when clicking it opens a modal with the address fields (zip, street, neighborhood etc)but this modal is formed in jquery by clicking the new address button:
$('#add-row-address').click(function (e) {
e.preventDefault();
var codigo = $(this).data("codigo");
var title = "Cadastro de endereço";
var body = '<form autocomplete="on" class="form-address" id="form-address" action="ctb-address"> <div class="row-f">\
<div class="row-f">\
<label>\
Rua\
</label>\
<input id="logradouro" class="inpt-null" name="rua_end" type="text"/>\
</div>\
<div class="row-f">\
<div class="row-m">\
<label>\
Cep\
</label>\
<input id="cep" class="inpt-null" name="cep_end" type="text"/>\
</div>\
<div class="row-m">\
<label>\
Estato\
</label>\
<input value="SP" id="uf" class="inpt-null" name="estado_end" type="text"/>\
</div>\
</div>\
<div class="row-f">\
<div class="row-m">\
<label>\
Cidade\
</label>\
<input value="São Paulo" id="localidade" class="inpt-null" name="cidade_end" type="text"/>\
</div>\
<div class="row-m">\
<label>\
Bairro\
</label>\
<input id="bairro" class="inpt-null" name="bairro_end" type="text"/>\
</div>\
</div>\
<div class="row-f">\
<div class="row-m">\
<label>\
N° Casa\
</label>\
<input id="numero" class="inpt-null" name="num_end" type="number"/>\
</div>\
<div class="row-m">\
<label>\
Complemento\
</label>\
<input class="inpt-null" name="complemento_end" type="text"/>\
</div>\
</div>\
<div class="footer-box">\
<input name="id_cont_end" value="' + codigo + '" type="hidden"/>\
<button id="btn-form-address" class="btn-green btn-default" type="submit"><span class="lnr lnr-checkmark-circle"></span> Salvar endereço</button>\
</div>\
</div></form>';
ModalForm(title, body);
});
I do not know if this is why the search does not work, I put the zip code and not search, I put the street and also not search, but in the registration form that is on another page works perfectly, I am using a code via ZIP adapted by a member of the forum:
var inputsCEP = $('#logradouro, #bairro, #localidade, #uf, #ibge');
var inputsRUA = $('#cep, #bairro, #ibge');
var validacep = /^[0-9]{8}$/;
function limpa_formulario_cep(alerta) {
if (alerta !== undefined) {
alert(alerta);
}
inputsCEP.val('');
}
function get(url) {
$.get(url, function (data) {
if (!("erro" in data)) {
if (Object.prototype.toString.call(data) === '[object Array]') {
var data = data[0];
}
$.each(data, function (nome, info) {
$('#' + nome).val(nome === 'cep' ? info.replace(/\D/g, '') : info).attr('info', nome === 'cep' ? info.replace(/\D/g, '') : info);
});
} else {
limpa_formulario_cep("CEP não encontrado.");
}
});
}
$('#logradouro, #localidade, #uf').on('blur', function (e) {
if ($('#logradouro').val() !== '' && $('#logradouro').val() !== $('#logradouro').attr('info') && $('#localidade').val() !== '' && $('#localidade').val() !== $('#localidade').attr('info') && $('#uf').val() !== '' && $('#uf').val() !== $('#uf').attr('info')) {
inputsRUA.val('...');
get('https://viacep.com.br/ws/' + $('#uf').val() + '/' + $('#localidade').val() + '/' + $('#logradouro').val() + '/json/');
}
});
$('#cep').on('blur', function (e) {
var cep = $('#cep').val().replace(/\D/g, '');
if (cep !== "" && validacep.test(cep)) {
inputsCEP.val('...');
get('https://viacep.com.br/ws/' + cep + '/json/');
} else {
limpa_formulario_cep(cep === "" ? undefined : "Formato de CEP inválido.");
}
});
Anyone there? Help!!
You’ve seen this example: https://viacep.com.br/exemplo/jquery/
– Laércio Lopes
In the same, the function I use is just an adaptation to search by street also, in the first form that is in html, works perfectly, now in the second not, if you want to give some kind of error!
– JASL
You checked if you’re not duplicating the
id
in theDOM
? Exmeplo: has more than one $("#locality"), $("#patio") and etc...– Leandro Angelo
has, but on different pages, it implies?
– JASL