// Obtener referencias a los elementos select
var id_gerencia = document.getElementById('id_gerencia');
var id_area = document.getElementById('id_area');

// Agregar un evento de cambio al primer select
id_gerencia.addEventListener('change', function() {
    var gerencia = id_gerencia.value;

    // Realizar una solicitud AJAX para obtener las subcategorías según la categoría
    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'data/data_add.php?gerencia=' + gerencia, true);
    xhr.onload = function() {
        if (xhr.status === 200) {
            // Limpiar opciones anteriores del segundo select
            id_area.innerHTML = '';

            // Obtener las subcategorías desde la respuesta de la solicitud
            var areas = JSON.parse(xhr.responseText);

            // Agregar las subcategorías como opciones al segundo select
            areas.forEach(function(area) {
                var option = document.createElement('option');
                option.value = area.id;
                option.text = area.NOMB_AREA;
                id_area.appendChild(option);
            });
        }
    };
    xhr.send();
});