Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

376
Vistas
jquery deshabilita el botón de envío en el envío del formulario

Por alguna razón, aunque este código actualiza la página, no se publican campos...

 $('form').submit(function(){ $('input[type=submit]', this).attr('disabled', 'disabled'); });

¿Hay una mejor manera de codificar esto?

over 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

Su código está cambiando la acción de envío del formulario. En lugar de enviar, cambia el atributo del botón.

Prueba esto:

 $('input[type=submit]').click(function() { $(this).attr('disabled', 'disabled'); $(this).parents('form').submit(); });
over 4 years ago · Santiago Trujillo Denunciar

0

He visto algunas maneras de hacer esto:

  • Deshabilitar botones al hacer clic
  • Deshabilitar botones al enviar
  • Deshabilitar formulario al enviar

Pero ninguno parece funcionar como se esperaba, así que creé mi propio método.

Agregue una clase a su formulario llamada submit-once y use el siguiente jQuery:

 $('form.submit-once').submit(function(e){ if( $(this).hasClass('form-submitted') ){ e.preventDefault(); return; } $(this).addClass('form-submitted'); });

Esto agrega otra clase a su formulario: form-submitted . Luego, si intenta enviar el formulario nuevamente y tiene esta clase, jQuery evitará que el formulario se envíe y saldrá de la función al return; y por lo tanto, nada se vuelve a enviar.

Elegí usar $('form.submit-once') en lugar de $('form') porque algunos de mis formularios usan Ajax, que debería poder enviarse varias veces.

Puedes probarlo en este jsFiddle . Agregué target="_blank" al formulario para que pueda probar enviar el formulario varias veces.

Nota al margen: es posible que desee considerar a los usuarios que no son JS evitando también los envíos dobles del lado del servidor. Por ejemplo, tenga una variable de sesión que almacene la última fecha/hora de envío e ignore cualquier envío adicional dentro de los 3 segundos.

over 4 years ago · Santiago Trujillo Denunciar

0

No sé por qué el código en cuestión no funciona. Aquí hay un fragmento de código similar y sencillo y le aconsejo que no complique demasiado las cosas.

 $("form").submit(function () { // prevent duplicate form submissions $(this).find(":submit").attr('disabled', 'disabled'); });

ventajas:

  • funciona bien con la validación de formularios HTML5;
  • está escrito de forma genérica para que pueda reutilizarse "tal cual";
  • funciona si el formulario se envía haciendo clic en el botón Enviar, así como si el formulario se envía por otros medios (como presionar Entrar dentro de una entrada de texto).
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda