2
respostas

evitar remoções

como evitar a remoção do cabeçalho

da tabela e de remover a tabela inteira clicando no canto da tabela?

eu tentei implementando o * remover-paciente.js* assim, mas não funciona

var pacientes = document.querySelectorAll(".paciente");

var tabela = document.querySelector("table");

const linhas = document.querySelectorAll('table tbody tr') // linhas, imposibilita a tabela inteira ser removida
const colunas = document.querySelectorAll('table tbody tr td') // colunas, imposibilita a tabela inteira ser removida
const cabecalho = document.querySelectorAll('table thead tr th') // thead, imposibilita a tabela inteira ser removida

tabela.addEventListener("dblclick", function(event) {
    if(tabela != linhas && tabela != colunas && tabela != cabecalho){
        event.target.parentNode.classList.add("fadeOut");

        setTimeout(function() {
            event.target.parentNode.remove();
        }, 500); //faz a função remove aguardar 0,5s para dar para ver a animação
    }
});
2 respostas

Fala Leonardo, tudo bem? Espero que sim!

Você deve verificar se o elemento que esta sendo clicado é igual a esse elementos, não a tabela, então faça assim:

var pacientes = document.querySelectorAll(".paciente");

var tabela = document.querySelector("table");

const linhas = document.querySelectorAll('table tbody tr') // linhas, imposibilita a tabela inteira ser removida
const colunas = document.querySelectorAll('table tbody tr td') // colunas, imposibilita a tabela inteira ser removida
const cabecalho = document.querySelectorAll('table thead tr th') // thead, imposibilita a tabela inteira ser removida

tabela.addEventListener("dblclick", function(event) {
    const elementoClicado = event.target

    if(elementoClicado != linhas && elementoClicado != colunas && elementoClicado != cabecalho){
        event.target.parentNode.classList.add("fadeOut");

        setTimeout(function() {
            event.target.parentNode.remove();
        }, 500); //faz a função remove aguardar 0,5s para dar para ver a animação
    }
});

Criamos uma variavel elementoClicado que se refere a onde clicamos. Ou seja, se clicarmos no cabeçalho, irá verificar se cabeçalho é diferente de cabeçalho, ou seja, não vai entrar na condição e não vai remove-lo.

Testa ai e fala pra gente se funcionou, ta bom?

Abraços e bons estudos :D