1

Tenho as seguints funções:

Pega dados do servidor por ajax e salva em um Array de objetos:

function carregaPesquisaTabela(){
	controlLoading();
	$.ajax({
	url: "header.php",
	type: "POST",
	dataType:"json",
	data: {
		'procuraPesquisa' : null
	}
	
}).done(function(data){
		pesquisaObj = data;
		controlLoading();
});

}

Pega o Array de Objetos e monta uma tabela. (Não vou colocar todo o código porque não é necessário)

function montaTabela(){
	$("#tablePesquisas").empty();
	var linha = "";
	for(i = 0; i<pesquisaObj.length; i++){
  //Monta dados e insere em uma tabela 
	$("#tablePesquisas").html(linha);
  }
}

Chamo as duas da seguinte maneira:

$("#viewPesquisa").submit(function(e){
e.preventDefault();
carregaPesquisaTabela();
montaTabela();
});

O problema é que a ação montaTabela(); está acontecendo antes da função carregaPesquisaTabela(); estar finalizada, e por isso o resultado não está sendo real.

Vi algo sobre callback mas não consegui implementar. O que fazer?

1 Resposta 1

0

Está vendo aquela função que você declara no .done() do jQuery? Aquilo é o callback, a função que você passa para o jQuery invocar quando ele obter o resultado.

O que você quer é chamar montaTabela via done, ou seja:

function carregaPesquisaTabela(){
    controlLoading();
    $.ajax({
        url: "header.php",
        type: "POST",
        dataType:"json",
        data: {
            'procuraPesquisa' : null
        }

    }).done(function(data){
        pesquisaObj = data;
        controlLoading();
        montaTabela();
    });
}

Vou aproveitar para mencionar um detalhe: em montaTabela você está usando .html() para anexar mais linhas a sua tabela, mas .html() substitui todo o conteúdo já existente, o que você precisa é .append().

--Edit--

Enviando seu próprio callback:

Em resposta ao comentário, também o possível enviar sua própria função para ser chamada ao término do AJAX.

function carregaPesquisaTabela(callback){
    controlLoading();
    $.ajax({
        url: "header.php",
        type: "POST",
        dataType:"json",
        data: {
            'procuraPesquisa' : null
        }

    }).done(function(data){
        pesquisaObj = data;
        controlLoading();
        if (callback) { /*se nada for enviado, esse if não é executado*/
            callback();
        }
    });
}

$("#viewPesquisa").submit(function(e){
    e.preventDefault();
    carregaPesquisaTabela(montaTabela);
});
3
  • Então, oq eue acontece é que queria que a minha função carregaPesquisaTabela(), pudesse ser chamada para buscar os dados e uma outra função para trata los, por exemplo, coloca-los em uma tabela ou em um option de um select. E evitar ter que duplicar o código de busca no servidor. Commented 2/11/2018 às 23:55
  • Ok, tente a correção que eu fiz.
    – user130117
    Commented 3/11/2018 às 0:07
  • Great! Exatamente o que eu precisava. Funcionando perfeitamente! Obrigado! Commented 3/11/2018 às 0:14

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .