document.getElementById('addSchoolButton').addEventListener('click', function() {
    const schoolName = document.getElementById('schoolName').value.trim();
    const district = document.getElementById('districtSelect').value;

    if (schoolName && district) {
        addSchoolToTable(schoolName, district);
        clearInputs();
    } else {
        alert('Please fill in all fields.');
    }
});

// Function to add a new school to the table
function addSchoolToTable(schoolName, district) {
    const tableBody = document.getElementById('schoolsTable').getElementsByTagName('tbody')[0];
    const newRow = tableBody.insertRow();

    const nameCell = newRow.insertCell(0);
    const districtCell = newRow.insertCell(1);
    const actionCell = newRow.insertCell(2);

    nameCell.textContent = schoolName;
    districtCell.textContent = district;

    const editButton = document.createElement('button');
    editButton.textContent = 'Edit';
    editButton.className = 'edit';
    editButton.onclick = function () {
        // Logic for editing the school entry
        const newSchoolName = prompt("Edit School Name:", schoolName);
        const newDistrict = prompt("Edit District:", district);
        if (newSchoolName && newDistrict) {
            nameCell.textContent = newSchoolName;
            districtCell.textContent = newDistrict;
        }
    };

    const deleteButton = document.createElement('button');
    deleteButton.textContent = 'Delete';
    deleteButton.className = 'delete';
    deleteButton.onclick = function() {
        tableBody.deleteRow(newRow.rowIndex - 1); // Adjust for header row
    };

    actionCell.appendChild(editButton);
    actionCell.appendChild(deleteButton);
}

// Function to clear input fields
function clearInputs() {
    document.getElementById('schoolName').value = '';
    document.getElementById('districtSelect').selectedIndex = 0; // Reset to default
}

// Add event listeners to existing edit and delete buttons in dummy data
document.querySelectorAll('.edit').forEach((button, index) => {
    button.onclick = function() {
        const row = button.closest('tr');
        const schoolName = row.cells[0].textContent;
        const district = row.cells[1].textContent;
        const newSchoolName = prompt("Edit School Name:", schoolName);
        const newDistrict = prompt("Edit District:", district);
        if (newSchoolName && newDistrict) {
            row.cells[0].textContent = newSchoolName;
            row.cells[1].textContent = newDistrict;
        }
    };
});

document.querySelectorAll('.delete').forEach((button) => {
    button.onclick = function() {
        const row = button.closest('tr');
        row.parentNode.removeChild(row);
    };
});