jQuery ya dispone de un método llamado serialize, que básicamente transforma un formulario en una cadena típica de un POST o un GET, bastante útil para enviar un formulario con una petición al más puro estilo AJAX tal cual lo hace el navegador.
El problema es que a mi no me gusta lo que hace el navegador con los “checkboxes”.
Como cualquier otro input, los checkboxes tienen un valor asociado (por defecto “on”, aunque no estoy seguro de si esto varía según el navegador). Lo que uno esperaría de value, es que sea “on” si está checked y “off” si está unchecked. Pero no señores, no se confundan, siempre es “on”, igual que si le dices que value=”pepito”, value siempre será “pepito” independientemente de si el checkbox está checkeado o no.
Entonces (se preguntará el lector avispado que aún no haya tenido el placer de programar en HTML), ¿como sabe el servidor si el checkbox está checked o unchecked? Elemental mi querido Watson. El navegador sólo envia esa información si está checked y no la envia si está unchecked. ¿Que putada, no? Porque hay veces que parece que esto rompe algunos flujos típicos con otros datos.
No es que este comportamiento de los navegadores sea muy problematico, pero a veces a uno le interesa que funcione de otra manera.
Sea como fuere, aquí pongo una extensión para jQuery, que básicamente lo que hace es lo mismo que “serialize” pero pone siempre los checkboxes, de tal forma que pone “nombre=1” cuando el checkbox está activado, y “nombre=0” cuando no está activado.
jQuery.fn.jserialize = function () {
var serialized = this.serialize();
$(this).find(':checkbox').each (function() {
var tofind = $(this).attr('name') + "=" + $(this).val();
var toreplace = $(this).attr('name') + "=" + (this.checked ? '1' : '0');
if (this.checked) { serialized = serialized.replace (tofind, toreplace); }
else { serialized += "&" + toreplace; }
});
return serialized;
}
Enlaces de interés:
English
6 Comments on "Extensión jQuery para serializar formularios"