Utilizando el ajax de jQuery con formularios

En muchos casos se nos presenta la necesidad de trabajar con ajax, en esta entrada vamos a aprender de manera sencilla y suficiente la manera de hacerlo con jQuery.

El siguiente código nos permite enviar datos de un formulario a su respectivo action a través de ajax sin mayores complicaciones.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

// Capturamos el evento submit del formulario. $('#tuForm').submit(function(e) { // Obtenemos el atributo action del formulario var url = $(this).attr("action"); $.ajax({ type: "POST", url: url, // Asignamos la url capturada data: $(this).serialize(), //enviamos los campos serializados. dataType: "html", error: function(msg){ alert("Ha ocurrido un error!"); }, success: function(msg){ alert("Proceso Exitoso!"); } }); return false; });

Tal como se indica en la referencia, el campo CSRF Field debería ser enviado!, además si se dibujó el formulario con {{ form_widget() }} o {{ form_row() }} no olvides de añadir el {{ form_row(form._token) }} o {{ form_rest(form) }} en el template de su form, ya que debería generarse el campo CSRF para que el formulario se valide de manera correcta.

Referencia: http://stackoverflow.com/questions/9002489/symfony2-form-with-csrf-passed-through-jquery-ajax