Eu possuo uma página de pesquisa feita em ASP.NET MVC que possui os dados carregados em uma tabela usando AJAX e jQuery Template, para não precisar recarregar a pagina após a pesquisa. Segue o exemplo abaixo:
function CarregaTabela() {
idFiltro = $("#idFiltro").val();
pesquisa = $("#campoPesquisa").val();
var url = "http://servidorTeste/api/precos/";
$.ajax({
url: url,
type: "POST",
data: {
"idLoja": $("#idLoja").val(),
"idFiltro": idFiltro,
"Pesquisa": pesquisa,
"TotalProdutos": $("#TotalProdutos").val()
},
success: function (retorno) {
if (retorno.mensagemErro == null) {
//Aqui vai pra tabela de genéricos
if (retorno.listaPrecos.length > 0) {
$.notify(retorno.listaPrecos.length + " Produtos encontrados.");
//Oculto a tabela de genéricos.
$("#tabelaProdutos").hide();
//Removo todos os tr filhos do tbody
$("#corpoProdutos tr").remove();
//Oculto a tabela de genéricos.
$("#tabelaEquivalentes").hide();
//Removo todos os tr filhos do tbody
$("#corpoEquivalentes tr").remove();
//Foreach
$.each(retorno.listaPrecos, function (i, item) {
//Formando o preço no formato 00.00
item.descontoPercentagemStandard = CalcularPercentagem(item.Referencia, item.Standard).toFixed(2);
item.descontoPercentagemPreferencial = CalcularPercentagem(item.Referencia, item.Preferencial).toFixed(2);
item.descontoPercentagemAposentado = CalcularPercentagem(item.Referencia, item.Aposentado).toFixed(2);
item.descontoPercentagemMedico = CalcularPercentagem(item.Referencia, item.Medico).toFixed(2);
item.PercentagemPMC *= 100;
item.PercentagemPMC = item.PercentagemPMC.toFixed(2);
item.Referencia = item.Referencia.toFixed(2);
item.Standard = item.Standard.toFixed(2);
item.Preferencial = item.Preferencial.toFixed(2);
item.Aposentado = item.Aposentado.toFixed(2);
item.Medico = item.Medico.toFixed(2);
if (item.Condicao == "VENDA") {
item.Valor = item.Standard - item.VmsPDV;
item.Valor = item.Valor.toFixed(2);
}
});
//Adiciono todos os items a tabela de produtos.
$("#tmplProdutos").tmpl(retorno.listaPrecos).appendTo("#corpoProdutos");
$("#tabelaProdutos").show();
else {
$.notify(retorno.listaPrecos.length + " Produtos encontrados.");
//Oculto a tabela de genéricos.
$("#tabelaProdutos").hide();
//Removo todos os tr filhos do tbody
$("#corpoProdutos tr").remove();
}
}
}
else {
$("#tabelaProdutos").hide();
$.notify(retorno.mensagemErro, { status: "danger" });
}
},
error: function () {
bootbox.alert("Falha ao pesquisar produtos.");
},
complete: function () {
loading.stop();
}
});
};
Recententemente implementei o jQuery Datatable nesta página de pesquisa. A primeira pesquisa ela funciona bem, mas da segunda em diante, além de exibir toda a pesquisa (sendo que deveria aparecer apenas 10 itens de cada vez), quando eu vou filtrar na barra de pesquisa em todas as colunas ele mostra os dados da pesquisa anterior.
Lembrando que o Datatable é inicializado junto com a página, mas os dados são recarregados a cada pesquisa pelo pesquisar.
Alguém poderia me ajudar?