A veces siempre he necesitado serializar los datos de un formulario y convertirlos en un objeto en javascript para usarlos de maneras perversas :)
Asi se me ocurrio que talvez alguien puede necesitar esta informacion tambien asi que aqui va :
ponemos nuestro formulario por ejemplo algo asi :
<form>
<div><input type="text" name="a" value="1" id="a" /></div>
<div><input type="text" name="b" value="2" id="b" /></div>
<div><input type="hidden" name="c" value="3" id="c" /></div>
<div>
<textarea name="d" rows="8" cols="40">4</textarea>
</div>
<div><select name="e">
<option value="5" selected="selected">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select></div>
<div>
<input type="checkbox" name="f" value="8" id="f" />
</div>
<div>
<input type="submit" name="g" value="Submit" id="g" />
</div>
</form>
Despues si queremos serializar los datos en un objeto tenemos el metodo de jquery llamado : $(formulario).serializeArray() que crea un array de objetos con el nombre y el valor de los input de esta manera :
[ { name: "a", value: "1" }, { name: "b", value: "2" }, { name: "c", value: "3" }, { name: "d", value: "4"
}, { name: "e", value: "5" } ]
El problema con esto es que tenemos que acceder a cada valor de cada input de esta manera :
array[0].name , array[0].value Siendo el indice del arreglo el orden de los input en el formulario de arriba hacia abajo. Entonces si tienes algun metodo que haga alguna validacion se puede romper caso de que agregues otro input , por que el orden no seria el mismo.
Seria una mejor solucion pasar los datos a un obj simple donde puedas acceder de esta manera : data.['nombreatributonamedelinput'] de esta manera aunque agregues mas input no se rompe el codigo por que siempre estas haciendo referencia al valor del atributo name del input que es el que tiene el valor del input .
bueno para hacer esto tenemos que usar un metodo que encontre en stackoverflow en este
link
hay un metodo para pasar el array de objetos generados por $(formulario).serializeArray() a un objeto simple de esta manera tu objeto quedaria de esta manera :
{ "a": "1" , "b": "2" , "c": "3" ,"d": "4", "e": "5" }
Asi podemos acceder de manera mas comoda a nuestros valores del formulario.
El metodo que hace esto es este :
function ArrayObjToObjSimple(arrayObj)
{
var objectData = {};
var a = arrayObj;
$.each(a, function() {
if (objectData[this.name] !== undefined) {
if (!objectData[this.name].push) {
objectData[this.name] = [objectData[this.name]];
}
objectData[this.name].push(this.value || '');
} else {
objectData[this.name] = this.value || '';
}
});
return objectData;
};
Espero le sirva a alguien mas .
