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
17/11/2010 at 4:57 pm Permalink
Puedes colocar un ejemplo de uso mas especifico ?
27/12/2010 at 8:55 am Permalink
hola buenas la funcion es perfecta el unico problema es que lo envia ordenado y respeta el orden del array osea:
check1 = 1
check1 = 1
check1 = 0
check1 = 1
ahora lo hago jserialize()
y me lo envia de esta manera
check1 = 1
check1 = 1
check1 = 1
check1 = 0
eso quiere decir que toma mas importancia a los que esta checked
06/01/2011 at 3:25 pm Permalink
Luis Alberto, me parece que deberias renombrar las variables… aunque alomejor estás usando un array… realmente el algoritmo del jserialize no ordena nada, pero tal vez al hacer el select en jQuery sí tenga un orden a la hora de coger los elementos, y éste sea distinto… de todos modos seguro que sigue el orden en el que los elementos aparecen en el DOM.
Si el problema que tienes es el primero, te recomiendo renombrar las variables. Si estás usando check1[] en el formulario…. entonces tendrás que buscar otra solución, o renombrar las variables.
Suerte.
21/01/2011 at 11:26 am Permalink
bueno amigo ya me funciona hice este cambio
bueno lo hice para mi cambio
osea para que no lo ordene y lomande como tal
se puede publir y mejorar pero ahora no cuento con mucho tiempo
jQuery.fn.jserialize = function () {
var serialized = this.serialize();
serialized = serialized.replace(/status%5B%5D=1/g,”");
$(this).find(“:checkbox”).each (function() {
var tofind = $(this).attr(“name”) + “=” + $(this).val();
var toreplace = $(this).attr(“name”) + “=” + (this.checked ? “1″ : “0″);
serialized += “&” + toreplace;
// if (this.checked) {
// serialized = serialized.replace (tofind, toreplace); }
// else{ serialized += “&” + toreplace; }
});
return serialized;
}
espero que lo veas y me digas como va
21/02/2011 at 1:54 pm Permalink
Luis Alberto no lo he probado, pero seguramente se puede limpiar un poco y hacer genérico.
El concepto de lo que hace el algoritmo me gusta. Es sencillito pero hace el trabajo.