I am having doubts about using AJAX, I am making a function to build a list according to some filters.
Everything is working perfectly, I return the JSON and I mount the table. The problem is when my return contains a lot of data.
It seems that I have not received the entire data package yet, and AJAX already enters success:
So the table is assembled in half.
I have tried to use callbacks, .done () ... Nothing solved this problem for me.
Follow my code ...
$.ajax({
url: 'php/ficha_cadastral_function.php',
data:{ action: 'pesquisaCliente'
, cnpj: cnpj
, razaoSocial: razaoSocial
, telefone: telefone
, nomeFantasia: nomeFantasia
, email: email
, representante: representante
, iniScore: iniScore
, fimScore: fimScore
, situacao: situacao },
dataType: 'JSON',
type: 'POST',
async: false,
success: function(DATA){
if(DATA.STATUS == 200){
tabela += ' <form method="post" action="ficha_cliente.php"> ';
tabela += ' <hr/> ' +
' <div class="col-xs-12" id="lista_cliente"> ' +
' <table class="table table-bordered small" > ' +
' <thead> ' +
' <tr> ' +
' <th class="text-center">CNPJ</th> ' +
' <th class="text-center">Razão Social</th> ' +
' <th class="text-center">Nome Fantasia</th> ' +
' <th class="text-center">Telefone</th> ' +
' <th class="text-center">E-mail</th> ' +
' <th class="text-center">Representante</th> ' +
' <th class="text-center">Score</th> ' +
' <th class="text-center">Situação</th> ' +
' <th class="text-center">Ação</th> ' +
' </tr> ' +
' </thead> ' +
' <tbody id="trListaCliente"> ' ;
for($i=0; $i < DATA.LINHAS; $i++){
tabela += '<tr>' +
'<td class="text-center" id="tdCNPJ">' + DATA.DADOS[$i].CNPJ_TITULO + '</td>' +
'<td class="text-center" id="tdRazaoSocial">' + DATA.DADOS[$i].RAZAO_SOCIAL + '</td>' +
'<td class="text-center" id="tdNomeFantasia">' + DATA.DADOS[$i].NOME_FANTASIA + '</td>' +
'<td class="text-center" id="tdTelefone">' + DATA.DADOS[$i].TELEFONE + '</td>' +
'<td class="text-center" id="tdEmail">' + DATA.DADOS[$i].EMAIL + '</td>' +
'<td class="text-center" id="tdRepresentante">' + DATA.DADOS[$i].REPRESENTANTE + '</td>' +
'<td class="text-center" id="tdScore">' + DATA.DADOS[$i].SCORE + '</td>' +
'<td class="text-center" id="tdSituacao">' + DATA.DADOS[$i].DESC_SITUACAO + '</td>' +
'<td class="text-center" id="tdAcao">' ;
if(DATA.DADOS[$i].CADASTRADO == false) {
tabela += '<button type="submit" class="btn btn-primary btn-xs" name="btValor" value="'+DATA.DADOS[$i].CNPJ+'"><span class="glyphicon glyphicon-search"></span></button>';
} else {
tabela += '<button type="submit" class="btn btn-success btn-xs" name="btValor" value="'+DATA.DADOS[$i].CNPJ+'"><span class="glyphicon glyphicon-search"></span></button>';
}
'</td>' +
'</tr>';
}
tabela += ' </tbody> ' +
' </table> ' +
' </div> ';
tabela += ' </form> ';
$('#listaCliente').html(tabela);
} else {
tabela += ' <hr/> ' +
' <div class="row"> ' +
' <div class="col-md-12 text-center"> ' +
' <h3>Sem dados cadastrados!</h3> ' +
' </div> ' +
' </div> ';
$('#listaCliente').html(tabela);
}
},
error: function(DATA) {
alerta('Ocorreu um erro ao carregar o cliente! (ERRO - fncPesquisaCliente)', 'danger');
limpaLista();
}
});
Would anyone have a hint of how I could solve this?