Formulario de envío jQuery AJAX

Tengo un formulario con nombre orderproductForm y un número indefinido de entradas.

Quiero hacer algún tipo de jQuery.get o ajax o algo así que llame a una página a través de Ajax, y envíe todas las entradas del formulario orderproductForm.

Supongo que una forma sería hacer algo como

jQuery.get("myurl",
          {action : document.orderproductForm.action.value,
           cartproductid : document.orderproductForm.cartproductid.value,
           productid : document.orderproductForm.productid.value,
           ...

Sin embargo, no sé exactamente todas las entradas del formulario. ¿Hay alguna característica, función o algo que simplemente envíe TODAS las entradas del formulario?

abhinav3414
Pregunta editada 30º abril 2018 в 12:46
Programación
javascript forms jquery ajax submit
25º diciembre 2009 в 1:31
22 vistas

Esta es una simple referencia:

// this is the id of the form
$("#idForm").submit(function(e) {

    e.preventDefault(); // avoid to execute the actual submit of the form.

    var form = $(this);
    var url = form.attr('action');

    $.ajax({
           type: "POST",
           url: url,
           data: form.serialize(), // serializes the form's elements.
           success: function(data)
           {
               alert(data); // show response from the php script.
           }
         });

});

Espero que te ayude.

Community
Respuesta editada 2º marzo 2019 в 5:30
Comentarios (20)
Solución

Puedes utilizar las funciones ajaxForm/ajaxSubmit del Ajax Form Plugin o la función jQuery serialize.

AjaxForm:

$("#theForm").ajaxForm({url: 'server.php', type: 'post'})

o

$("#theForm").ajaxSubmit({url: 'server.php', type: 'post'})

ajaxForm enviará cuando se pulse el botón de envío. ajaxSubmit envía inmediatamente.

Serializar:

$.get('server.php?' + $('#theForm').serialize())

$.post('server.php', $('#theForm').serialize())

La documentación de serialización de AJAX está aquí.

K DawG
Respuesta editada 18º marzo 2017 в 1:31
Comentarios (9)

También existe el evento submit, que puede ser activado así $("#form_id").submit(). Usted'usaría este método si el formulario ya está bien representado en HTML. Sólo tiene que leer la página, rellenar las entradas del formulario con cosas, y luego llamar a .submit(). Utilizará el método y la acción definidos en la declaración del formulario, por lo que no tendrá que copiarlos en su javascript.

ejemplos

Souad
Respuesta editada 4º junio 2013 в 5:48
Comentarios (3)