Ouvinte no HTML não esta funcionando.

[fernandoalexandrefernandes]

Botton não funciona, acredito que não estou conseguindo atribuir o ouvinte:
 

// Seleciona o botão "Cadastrar" corretamente

const cadastrarButton = document.querySelector('#Cadastrar');



// Adiciona um ouvinte de evento ao botão "Cadastrar"

cadastrarButton.addEventListener('click', function() {

    // Chama a função exportToExcel(), que vai coletar os dados do formulário, criar o arquivo Excel e baixá-lo

    exportToExcel();

});



// Função para adicionar cadastro na tabela

function adicionarCadastroNaTabela(Cadastrar) {

    var tabela = document.getElementById("ultimas-inscricoes");

    var row = tabela.insertRow(1); // Insere na segunda linha (após o cabeçalho)

    var cell1 = row.insertCell(0);

    var cell2 = row.insertCell(1);

    var cell3 = row.insertCell(2);

    cell1.textContent = Cadastrar.nome;

    cell2.textContent = Cadastrar.idade;

    cell3.textContent = Cadastrar.email;



    // Chamada para o módulo PHP que salva os dados do cadastro

    // Substitua 'caminho_do_modulo_php' pelo caminho correto do seu módulo PHP

    fetch('salvar_planilha.php', {

        method: 'POST',

        body: JSON.stringify(Cadastrar),

        headers: {

            'Content-Type': 'application/json'

        }

    })

    .then(response => {

        if (!response.ok) {

            throw new Error('Erro ao salvar cadastro.');

        }

        return response.json();

    })

    .then(data => {

        console.log('Cadastro salvo com sucesso:', data);

    })

    .catch(error => {

        console.error('Erro ao salvar cadastro:', error);

    });

}



// Collect form data

// Coleta dados do formulário

function getFormData() {

    const formData = new FormData(document.querySelector('form'));

    const data = {};

    formData.forEach((value, key) => {

        data[key] = value;

    });

    return data;

}



// Create an Excel file from the form data

// Cria um arquivo Excel a partir dos dados do formulário

function createExcelFile(data) {

    const workbook = XLSX.utils.book_new();

    const worksheet = XLSX.utils.aoa_to_sheet(data);

    XLSX.utils.book_append_sheet(workbook, worksheet, "dados_membros.csv");

    const excelBuffer = XLSX.write(workbook, { bookType: 'xlsx', type: 'array' });

    return excelBuffer;

}



// Download the Excel file

// Baixa o arquivo Excel

function downloadExcelFile(excelBuffer) {

    const fileName = "dados_membros.csv.xlsx";

    const blob = new Blob([excelBuffer], { type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" });

    const url = URL.createObjectURL(blob);

    const link = document.createElement("a");

    link.href = url;

    link.download = fileName;

    document.body.appendChild(link);

    link.click();

    URL.revokeObjectURL(url);

}



// Export to Excel function

// Exportar para função Excel

function exportToExcel() {

    try {

        const data = getFormData();

       

        // Verifica se existem dados no formulário

        if (Object.keys(data).length === 0) {

            // Se não houver dados, exibe uma mensagem de alerta

            alert("Nenhum cadastro foi realizado. Por favor, preencha o formulário antes de exportar para o Excel.");

            return false;

        }

       

        const excelBuffer = createExcelFile(data);

        downloadExcelFile(excelBuffer);



        // Chamada para o módulo PHP que exporta os dados do formulário para um arquivo CSV no servidor

        // Substitua 'caminho_do_modulo_php' pelo caminho correto do seu módulo PHP

        fetch('c://Desenvolvimento//comudFHub//Descktop//cadMem//salvar_planilha.php', {

            method: 'POST',

            body: JSON.stringify(data),

            headers: {

                'Content-Type': 'application/json'

            }

        })

        .then(response => {

            if (!response.ok) {

                throw new Error('Erro ao exportar dados para CSV.');

            }

            return response.json();

        })

        .then(data => {

            console.log('Dados exportados com sucesso:', data);

        })

        .catch(error => {

            console.error('Erro ao exportar dados para CSV:', error);

        });



        return true;

    } catch (error) {

        console.error('Erro ao salvar planilha:', error);

        return false;

    }

}

 

[JoaoMadeiraxyz]

Olá @fernandoalexandrefernandes.

Eu precisaria ver seu código HTML para ter uma noção melhor do possível motivo disso estar acontecendo, mas consigo imaginar que talvez esteja relacionado ao carregamento do DOM. Eu sugeriria você criar um outro evento para poder identificar se o DOM já foi carregado, e então executar o seu código, para isso, basta colocar seu código dentro do seguinte evento:

addEventListener("DOMContentLoaded", (event) => {});

Espero ter ajudado, caso não funcione, envie aqui o seu código HTML também, para podermos analisar melhor o erro.