document.addEventListener('DOMContentLoaded', () => {
    const submitButton = document.getElementById('submit-button');
    const clearButton = document.getElementById('clear-button');
    const resultContainer = document.getElementById('result-container');
    const rReferencia = document.getElementById('rReferencia');
    const rRif = document.getElementById('rRif');

    submitButton.addEventListener('click', (event) => {
        event.preventDefault(); // Evitar el envío del formulario por defecto
        handleFormSubmission();
    });

    clearButton.addEventListener('click', clearForm);

    function handleFormSubmission() {
        const referencia = document.getElementById('referencia').value.trim();
        const rif = document.getElementById('rif').value.trim();
        const tipo = document.getElementById('tipo').value;

        // Validación
        let isValid = true;
        rReferencia.style.display = referencia === '' ? 'block' : 'none';
        rRif.style.display = rif === '' ? 'block' : 'none';

        if (referencia === '' || rif === '') {
            isValid = false;
        }

        // Si los campos son válidos, realizar la solicitud AJAX
        if (isValid) {
            sendAjaxRequest(referencia, rif, tipo);
        }
    }

    function sendAjaxRequest(referencia, rif, tipo) {
        const xhr = new XMLHttpRequest();
        xhr.open('POST', ajax_object.ajaxurl, true);
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

        xhr.onreadystatechange = () => {
            if (xhr.readyState === 4) {
                if (xhr.status === 200) {
                    resultContainer.innerHTML = xhr.responseText;
                    resultContainer.style.display = xhr.responseText.trim() !== '' ? 'block' : 'none';
                } else {
                    console.error(`Error en la solicitud: ${xhr.status}`);
                    resultContainer.innerHTML = '<p>Error al procesar la solicitud.</p>';
                    resultContainer.style.display = 'block';
                }
            }
        };

        // Usar plantillas literales para los parámetros
        xhr.send(`action=consultar_referencia_bancaria&referencia=${encodeURIComponent(referencia)}&rif=${encodeURIComponent(rif)}&tipo=${encodeURIComponent(tipo)}`);
    }

    function clearForm() {
        document.getElementById('referencia').value = '';
        document.getElementById('rif').value = '';
        document.getElementById('tipo').value = 'V';
        resultContainer.style.display = 'none';
    }
});

// Función para validar que solo se ingresen números
function isNumber(evt) {
    const charCode = evt.which || evt.keyCode;
    return (charCode >= 48 && charCode <= 57) || charCode === 0; // Permitir números y tecla "0"
}