6
respostas

Limpar conteúdo página javascript

Bom dia pessoal.

Sou iniciante na área e estou precisando de uma ajudinha: Tenho uma combobox que ao selecionar um item é exibido um relatório com os dados correspondentes. Ao trocar o item da combobox preciso limpar o conteúdo para exibir os dados do outro item.Alguém saberia?

Meu código:

function retornaTabelaComIndicadoresMaterialidade(element) { let empresa = $(element).val(); // Pega o elemento selecionado na combo

    $.ajax({

        type: 'POST',
        url: document.URL + '/montarTabela',
        contentType: "application/json; charset=utf-8",
        data: "{ 'codEmpresa': '" + empresa + "'}",
        async: false,
        dataType: 'json',
        success: function (results) {

            // document.getElementById("lblRelatorioMaterialidade").innerHTML = results.d

            $('#lblRelatorioMaterialidade').html(results.d); // Carrego os dados do relatório 
            document.getElementById("lblRelatorioMaterialidade").innerHTML = ""; // Tentando limpar os dados


        },

        error: function (results) { }

    });

}

Tentei limpar desta forma que está no código mas não funcionou.

Obrigada. Flávia

6 respostas

Pelo que eu consegui entender do seu código, quando ocorre um sucesso você está fazendo isso

$('#"lblRelatorioMaterialidade"').html(results.d); // Carrego os dados do relatório 
document.getElementById("lblRelatorioMaterialidade").innerHTML = ""; // Tentando limpar os dados

A primeira linha copia os resultados para o elemento com o id "lblRelatorioMaterialidade", e a segunda linha apaga o conteudo do mesmo elemento. Então qualquer consulta não mostraria resultados.

No caso do sucesso, bastaria manter a linha

$('#"lblRelatorioMaterialidade"').html(results.d); // Carrego os dados do relatório 

Já que qualquer sucesso vai retornar resultados novos (ou vazios, no caso de não achar nada)

Porem, se houver erro na comunicação, ele vai manter na tela os resultados da consulta anterior. Então para o caso do erro, você poderia colocar esta linha:

document.getElementById("lblRelatorioMaterialidade").innerHTML = ""; // Tentando limpar os dados

Oi Daniel. Agradeço muito sua ajuda. Sendo que esta linha:

document.getElementById("lblRelatorioMaterialidade").innerHTML = "";

Não está fazendo nada. A minha idéia seria apagar o conteúdo ao selecionar outro item na combo, para ficar claro que os dados são de uma outra consulta.

Não sei se fui clara, por exemplo, uma combo com os nomes de pessoas que ao clicar em Flavia aparece uma tabela com as características de Flávia, depois troco de Flavia para Daniel na combo- neste ponto gostaria de excluir a tabela com dados de Flávia e carregar uma nova tabela com os dados de Daniel.

O que está ocorrendo é o seguinte: Seleciono Flavia - aparece os dados de Flavia na tabela. Vou na combo e escolho Daniel - permanece os dados de Flavia e quando acaba a busca recarrega de Daniel, refrescando a página. Ficou mais claro?

Obrigada. Flávia

Neste caso, o que você quer é limpar o elemento de resultados enquanto a busca é efetuada.

Sendo assim, você precisa executar a limpeza antes de executar o comando ajax. Ficaria assim:

function retornaTabelaComIndicadoresMaterialidade(element) { 
let empresa = $(element).val(); // Pega o elemento selecionado na combo
$('#lblRelatorioMaterialidade').html(""); //Limpar os resultados
$.ajax({
    //Fazer a consulta e carregar novos dados
});
}

Oi Daniel. Tinha tentado desta forma mas também não funcionou. Não entendi porque. Se tiver alguma outra sugestão ficarei grata.

Obrigada. Flavia

Também estou iniciando no JavaScript, mas você já tentou usar o reset? No curso ele usa pra limpar o form após a inserção. Então pode dar certo pra limpar seu label também.

document.getElementById("lblRelatorioMaterialidade").reset();

Oi Vinícius. Agradeço a sua ajuda. Neste caso não estou trabalhando com form e sim com páginas aspx, sendo assim não tenho esta opção de reset. Ainda não consegui uma solução, se alguém puder ajudar.

Obrigada. Flávia