¿Cómo publicar un formulario con muchos campos con jQuery?

Question

Aunque $ .ajax () se puede usar para hacer cosas ajax, no creo que sea adecuado para publicar valores de una forma grande.

¿Cómo publicaría un formulario grande (muchos campos) sin ingresarlos todos a mano?

Answer 1

¿Cuál es su razonamiento detrás de esa suposición? POST está diseñado para transferir grandes cantidades de datos que GET. Una solicitud POST de AJAX es casi exactamente la misma que una " normal " La solicitud POST, solo se incluye en un paquete y se maneja internamente por un navegador de una manera ligeramente diferente. Un par de encabezados pueden ser ligeramente diferentes, pero los datos son todos iguales. ¿Por qué AJAX no puede manejar un " grande " forma?

¿Qué definirías incluso como " grande " forma de todos modos?

Editar: Gracias por la aclaración de tu pregunta. Entiendo lo que estás preguntando ahora, y veo de dónde vienes. Para un formulario con muchas entradas, podría ser un dolor agruparlo en una solicitud de Ajax todo el tiempo.

Ya que estás usando jQuery, hay una solución fácil para esto. Consulte el método serialize () . Le da un formulario y le devuelve una cadena de consulta de todos los elementos y valores de entrada del formulario que puede pasar directamente a una solicitud ajax. Hay un ejemplo en la página del manual que muestra cómo se hace.

Todo lo que tienes que hacer es esto:

$.ajax({
    data: $("form").serialize(),
    //etc.
});

donde " formulario " es el ID de tu formulario.

Answer 2

Probablemente desee utilizar serialize si no desea tratar manualmente cada elemento .

$.ajax({
   type: "POST",
   url: "form.php",
   data: $("#form_id").serialize()
   success: function(msg) {
     alert("Form Submitted: " + msg);
   }
 });

Answer 3

Puede usar jQuery.post (url, data, callback, tipo ) , como es más simple que jQuery.ajax (opciones) .

Al utilizar serialize , puede enviar el formulario completo automáticamente.

$.post("/post_handler/",
    $("form#my_form").serialize(),
    function(json){
        /*your success code*/
    }, "json");

Un ejemplo más completo:

<script>
$().ready(function(){
    $("form#my_form submit").click(function(){
        $.post("/post_handler/",
            $("form#my_form").serialize(),
            function(json){
                /*your success code*/
            }, "json");
        return false;
    });
}
</script>
<form id="my_form" action="/post_handler/" method="post">
  <input type="text" name="text1" value="my text 1" />
  <input type="text" name="text2" value="my text 2" />
  <input type="submit" name="submit_button" value="Send" />
</form>

Esto anularía el post predeterminado y lo haría con AJAX.

Answer 4

Si aún no lo has probado. Luego cree un formulario GRANDE (ahora como quiera que se refiera a eso) y use $ .ajax () o el complemento jQuery Forms para publicarlo. ¡Sabrás si es para este tipo de cosas o no!

EDITAR: - (después de su edición) Luego, complemento de formularios es para usted. Dale una oportunidad.

Answer 5

Pruebe el complemento de formulario jquery .

Probablemente hace exactamente lo que necesitas hacer fuera de la caja.

Answer 6

He enviado formularios bastante complejos (grandes) con $ .ajax () y no tuve ningún problema. No he enviado archivos a través de solicitudes ajax, pero lo he visto hacer y funciona mejor que las publicaciones tradicionales porque no bloquea el navegador mientras estás subiendo.

Según su comentario a @zombat, supongo que tiene una gran cantidad de entradas, la mayoría de las cuales estarán en blanco la mayor parte del tiempo. Dos sugerencias aquí 1) divide las entradas en formularios separados y solo envía cada una tan pronto como se toca / completa. 2) examine el estado de su formulario con JavaScript y envuelva la información en JSON o XML, y en lugar de publicar los datos del formulario, publique solo la estructura de datos.

" Grande " No debería ser un problema, quizás pueda encontrar un adjetivo mejor para describir sus datos que permita a todos saber por qué es difícil enviarlos.

Answer 7

Lo que estás pidiendo no es difícil. Todo lo que tiene que hacer es recopilar el contenido del formulario y pasarlo a su servidor (generalmente utilizando JSON).

Eche un vistazo a este howto:

http: //code.tutsplus.com/tutorials/submit-a-form-without-page-refresh-using-jquery--net-59