Como faço para acessar os valores criados pela Serializearray no jQuery?

Question

Eu tenho este html:

<form id='myform'>
<input name='title' value='foo'/>
</form>

E eu crio uma matriz de objetos assim:

var dataArray = $("#myform").serializeArray();

Agora, como faço para acessar o 'título' em DataArray? Isso não funciona:

alert(dataArray['title']);
alert(dataArray['title'].val());

Answer 1

Semelhante ao que Nick postou, mas um pouco de limpeza

var dataArray = $("#myform").serializeArray(),
    dataObj = {};

$(dataArray).each(function(i, field){
  dataObj[field.name] = field.value;
});

Em seguida, acesse a mesma maneira

alert(dataObj['title']);

Answer 2

Você pode fazer um loop, como @tom tem... ou se você estiver acessando mais de um, seja um pouco mais eficiente e loop uma vez, criando um objeto como este:

var dataArray = $("#myform").serializeArray(),
    len = dataArray.length,
    dataObj = {};

for (i=0; i<len; i++) {
  dataObj[dataArray[i].name] = dataArray[i].value;
}

Então você pode acessá -lo como desejar, por exemplo:

alert(dataObj['title']); //or alert(dataObj.title);

Você pode testá -lo aqui.

Answer 3

alert(dataArray[0].name);
alert(dataArray[0].value);

Então:

for (i=0; i<dataArray.length; i += 1) {
    if (dataArray[i].name === "title") {
        // do something here...
    }
}

Answer 4

Corre console.log(dataArray);, depois abra o inspetor da propriedade e verifique o console. No Chrome, você clicava com o botão direito do mouse e seleciona "Inspecione o elemento" e clique no ícone "> =" no canto inferior esquerdo, é o segundo da esquerda.

No Firefox, você instalaria o Firebug e há uma guia chamada "Console"

Não tenho certeza se está disponível no IE, provavelmente algo nas ferramentas do desenvolvedor (pressione F12) Mas eu não recomendaria o desenvolvimento no IE.

De qualquer forma, isso listará o objeto de uma maneira que permita navegar e ver os valores de cada item. Dessa forma, você pode usar isso para decifrar como acessar os valores :)

Boa sorte

Answer 5

Adicionando isso de qualquer maneira para ajudar os outros no futuro. Boa maneira de inspecionar rapidamente todos os valores.

var formdata = $( "#myform" ).serializeArray();
var formdata = JSON.stringify(formdata);
alert (formdata);

Answer 6

anexar/echo/imprimir dataArray[0].name para uma div lhe dará 'título'

Answer 7

Alertando a serializaarray de insumos no mydiv (Nota: o :input O seletor incluirá etiquetas selecionadas e textarea também!):

//alert(fData.length) // how many inputs got picked up 
var fData=$("#myDiv :input").serializeArray();
var msg=""; 
for(var i=0;i<fData.length;i++){
    var raKy=Object.keys(fData[i]); 
    msg+="\n"+raKy[0]+":"+eval("fData[i]."+raKy[0])+" "+raKy[1]+":"+eval("fData[i]."+raKy[1]); 
}
alert(msg);

Answer 8

Com uderscore.js, é assim que podemos fazer isso:

var serializedArray = $('form#spiderman-application').serializeArray();

var serializedObject = _.object(
  _.pluck(serializedArray, 'name'), 
  _.pluck(serializedArray, 'value')
)

console.log(serializedObject);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js"></script>

<form id="spiderman-application">
  <legend>Application Form</legend>
  <input name="./fname" value="Peter" />
  <input name="./lname" value="Parker" />
</form>

Boa sorte...