2
The function $.ajax
is working correctly, but the return of the data being entered inside the div <#exibeCep> is being duplicated when the user clicks several times on the button. I tried to use .remove()
, e.preventDefault();
, stopPropagation();
, bind()
and others, but nothing has prevented the duplicity of div
.
What can I put up to avoid doubling the div ?
<div id="exibeCep" class="conf_frete"> <h1>Escolha a opção do frete</h1> </div>
$('#buscafrete').click(function(e) {
e.preventDefault();
e.stopPropagation();
cep = $('#cep').val();
$.ajax({
type:'GET',
url: "{% url 'get_frete' %}",
dataType: "json",
data: {
data:cep,
csrfmiddlewaretoken:'{{csrf_token}}',
},
success: function(retorno){
if(retorno['sedex_cod_error'] == -3 || retorno['pac_cod_error'] == -3){
$('<label><input type="radio" name="zipcode" id='+'sedex'+' value='+'CEP de destino invalido'+'/>'+
'CEP de destino invalido.'+'</label>').appendTo('#exibeCep');
}else
{
$('<label><input type="radio" name="zipcode" checked id='+'sedex'+' value='+retorno['Sedex']+'/>'+
retorno['Sedex']+' ( '+'Sedex'+' ) '+'</label>').appendTo('#exibeCep');
$('<label><input type="radio" name="zipcode" id='+'sedex'+' value='+retorno['Pac']+'/>'+retorno['Pac']+' ( '+'Pac'+' ) '+'</label>').appendTo('#exibeCep');
}
},
error: function(jqXHR, textStatus, errorThrown){
//alert("FALHOU");
console.log('Error');
console.log(jqXHR);
console.log(textStatus);
console.log(errorThrown);
},
});
});
This will not prevent ajax from being sent multiple times.
– Guilherme Bernal
From what I understand the duplication is in the UI, anyway I will improve the answer now that I saw the HTML.
– Fabrício Matté
It worked at first !!! Thanks for the help. Thanks :) I’ll study what you put in the code because I need to learn it there. Thanks even
– Ricardo
@Ricardo without problems, can mark the answer as accepted? Thanks.
=]
– Fabrício Matté