Duda sencilla con Ajax y Jquery

[AndreaEstrada]

Hola que tal! Una duda muy muy sencilla estoy empezando a enviar datos de un formulario mediante Jquery/Ajax ... lo que pasa es que no comprendo porque la variable "datos" dice "$(this).serialize();" ... ¿porque se tiene que serializar? ... ya que he visto en otros ejemplos que solo se toma el valor del input en cuestión.

Código:

      $(document).ready(function() { 
 
          $('#myForm').submit(function(){ //en el evento submit del fomulario
	          event.preventDefault();  //detenemos el comportamiento por default
 
			  var url = $(this).attr('action');  //la url del action del formulario
			  var datos = $(this).serialize(); // los datos del formulario
			  $.ajax({
				  type: 'POST',
				  url: url,
				  data: datos,
				  beforeSend: mostrarLoader, //funciones que definimos más abajo
				  success: mostrarRespuesta  //funciones que definimos más abajo
			   });
 
          });

[rottenp4nx]

Imagínate tienes 50 campos en un formulario, cogerías todos los valores con val() ?

En cambio con serialize() los agarra y los convierte en una cadena

campo1=suvalor&campo2=suvalor

así sucesivamente, lo único malo, que no puedes tener validación, ahí tendrías que hacerlo de a uno o utilizar HTML5

Saludos

[maycolalvarez]

serialize básicamente reemplaza el funcionamiento normal que haría el navegador al enviar el formulario, que es convertir los datos del form en una cadena válida para pasar por POST o GET según el caso.

Cuando usamos AJAX obviamente no utilizamos peticiones directas del navegador, por lo cual tenemos que recorrer el DOM y serializar manualmente, afortunadamente jQuery tiene dicha función para ello.

Con respecto a la validación, recuerden que pueden utilizarse plugins como jQueryValidate, pero tengan en cuenta que validar por el cliente es inseguro, así se use JS o HTML5, siempre deben de validar en el servidor, la validación HTML5 o con JS es opcional.