Botón de envío de JS haciendo clic continuamente

Resumen del Problema

El problema descrito ocurre en un formulario web donde, al hacer clic en el botón de "Enviar", el mensaje "Enviando…" se muestra continuamente y no se redirige a una acción de "Éxito" o "Error", a pesar de que los datos del formulario se reciben correctamente. Este comportamiento puede dar la impresión de que el botón se está activando de forma continua.

Análisis del Código

El código JavaScript proporcionado se basa en jQuery y realiza una petición AJAX al enviar el formulario. Hay dos situaciones que pueden estar causando que el mensaje "Enviando…" se muestre de forma continua:

1. No se restablece correctamente el botón: Si la respuesta del servidor no se gestiona adecuadamente dentro de la función after_form_submitted, el botón de envío nunca vuelve a su estado original.

2. Manejo de errores inadecuado: Si ocurre un error en la respuesta del formulario y la lógica para manejar los errores no se ejecuta correctamente, puede que el formulario no se reestablezca a su estado inicial.

Soluciones Propuestas

1. Verificar la respuesta del servidor: Asegurarse de que la respuesta desde handler.php sea correctamente formulada y contenga la clave "result" con el valor "success" en caso de éxito. Además, asegúrate de manejar todos los posibles errores que puedan surgir.

2. Restablecer el botón al finalizar el proceso: Modificar el código de la función after_form_submitted para asegurarse de que, sin importar la naturaleza de la respuesta (ya sea éxito o error), el botón de envío se restablezca a su estado original. Esto significa que deberías mover el bloque de código que restablece el botón a ambos casos en la función.

Código Modificado

Aquí hay un fragmento modificado de la función para incluir el restablecimiento del botón en ambas ramas:

function after_form_submitted(data) 
{
    var $btn = $('button[type="button"]', $form); // Definición del botón en el alcance adecuado
    if($.trim(data.result) == 'success') {
        $('form#reused_form').hide();
        $('#success_message').show();
        $('#error_message').hide();
    } else {
        $('#error_message').append('<ul></ul>');
        jQuery.each(data.errors, function(key, val) {
            $('#error_message ul').append('<li>' + key + ':' + val + '</li>');
        });
        $('#success_message').hide();
        $('#error_message').show();
    }

    // Restablecer el botón independientemente del resultado
    $btn.prop('type', 'submit'); 
    $btn.text($btn.prop('orig_label'));
    $btn.prop('orig_label', '');
}

Conclusión

Después de implementar estas modificaciones, el botón de envío debería volver a su estado original tanto en caso de éxito como de error, resolviendo así el problema de la visualización continua del mensaje "Enviando…". Se recomienda probar el comportamiento del formulario tras esos cambios para asegurar que funcione como se espera.