File "script.js"

Full Path: /home/analogde/www/ONSEMI/Dev tableau/Improve/script.js
File size: 1.95 KB
MIME-type: text/plain
Charset: utf-8

$(document).ready(function() {
    let users = [];
    let userIdCounter = 1;

    function renderTable() {
        $('#tableBody').empty();
        users.forEach(user => {
            $('#tableBody').append(`
                <tr>
                    <td>${user.id}</td>
                    <td>${user.name}</td>
                    <td>${user.email}</td>
                    <td>
                        <button class="btn btn-warning btn-sm edit-btn" data-id="${user.id}">Modifier</button>
                        <button class="btn btn-danger btn-sm delete-btn" data-id="${user.id}">Supprimer</button>
                    </td>
                </tr>
            `);
        });
    }

    $('#addForm').on('submit', function(event) {
        event.preventDefault();
        const name = $('#addName').val();
        const email = $('#addEmail').val();
        const newUser = { id: userIdCounter++, name, email };
        users.push(newUser);
        renderTable();
        $('#addModal').modal('hide');
        $('#addForm')[0].reset();
    });

    $('#tableBody').on('click', '.edit-btn', function() {
        const id = $(this).data('id');
        const user = users.find(u => u.id === id);
        $('#editId').val(user.id);
        $('#editName').val(user.name);
        $('#editEmail').val(user.email);
        $('#editModal').modal('show');
    });

    $('#editForm').on('submit', function(event) {
        event.preventDefault();
        const id = $('#editId').val();
        const name = $('#editName').val();
        const email = $('#editEmail').val();
        const userIndex = users.findIndex(u => u.id === parseInt(id));
        users[userIndex] = { id, name, email };
        renderTable();
        $('#editModal').modal('hide');
    });

    $('#tableBody').on('click', '.delete-btn', function() {
        const id = $(this).data('id');
        users = users.filter(u => u.id !== id);
        renderTable();
    });
});