newosinadjango/osinaweb/static/js/add-staffs-position-in-staffs-details.js

document.addEventListener('DOMContentLoaded', function () {
    function updateSubmitButtonVisibility() {
        const containers = document.querySelectorAll('.initialPositionContainer:not([style*="display: none"])');
        const submitButton = document.getElementById('submitButton');
        if (containers.length > 0) {
            submitButton.classList.remove('hidden');
            submitButton.style.display = 'flex';
        } else {
            submitButton.classList.add('hidden');
            submitButton.style.display = 'none';
        }
    }

    function removePositionContainer(event) {
        event.preventDefault();
        const container = event.target.closest('.initialPositionContainer');
        container.remove();
        updateSubmitButtonVisibility();
    }

    document.getElementById('addNewPosition').addEventListener('click', function () {
        const container = document.getElementById('positionsContainer');
        const initialPositionContainer = document.querySelector('.initialPositionContainer');

        const newPositionContainer = initialPositionContainer.cloneNode(true);
        newPositionContainer.classList.remove('hidden');
        newPositionContainer.style.display = 'flex';

        const selectElement = newPositionContainer.querySelector('select');
        selectElement.name = 'position[]';

        const dateInputElements = newPositionContainer.querySelectorAll('input[type="date"]');
        dateInputElements.forEach((input, index) => {
            if (index === 0) {
                input.name = 'start_date[]';
            } else {
                input.name = 'end_date[]';
            }
        });

        const removeButton = newPositionContainer.querySelector('.removePositionOption');
        removeButton.addEventListener('click', removePositionContainer);

        container.appendChild(newPositionContainer);
        updateSubmitButtonVisibility();
    });

    document.querySelectorAll('.removePositionOption').forEach(button => {
        button.addEventListener('click', removePositionContainer);
    });

    updateSubmitButtonVisibility();
});