2015-07-01 74 views
5

我有一個這樣的形式:表單serializeArray獲取鍵:值如果鍵是在HTML中嵌套數組?

<select name="dog[0][name]">...</select> 
<select name="dog[0][color]">...</select> 
<select name="dog[0][height]">...</select> 
<select name="dog[0][weight]">...</select> 

<select name="dog[1][name]">...</select> 
<select name="dog[1][color]">...</select> 
<select name="dog[1][height]">...</select> 
<select name="dog[1][weight]">...</select> 
... 

現在,如果我叫$('form').serializeArray();這個輸出是這樣的:

[ 
    { 
     name: "dog[0][name]", 
     value: "ABC" 
    }, 
    { 
     name: "dog[0][color]", 
     value: "Blue" 
    }, 
    { 
     name: "dog[0][height]", 
     value: "41" 
    }, 
    { 
     name: "dog[0][weight]", 
     value: "10" 
    }, 
    { 
     name: "dog[1][name]", 
     value: "XYZ" 
    }, 
    { 
     name: "dog[1][color]", 
     value: "Pink" 
    }, 
    { 
     name: "dog[1][height]", 
     value: "27" 
    }, 
    { 
     name: "dog[1][weight]", 
     value: "7" 
    }, 
    // ... 
] 

我怎樣才能讓這個是這樣的:

{ 
    dog: [ 
     0: {"name": "ABC", "color": "Blue", "height": 41, "weight": "10"} 
     1: {"name": "XYZ", "color": "Pink", "height": 27, "weight": "7"} 
    ] 
} 

?有沒有一種方法不需要嵌套循環?

+0

回答在這裏http://stackoverflow.com/questions/19643310/jquery-serialize-form-data-to-associated-array –

+0

有一個插件,如果你不想建立你自己的:https:// github的.com/macek/jquery的序列化對象 –

回答

0

好的,我知道我的問題是特定於案例,但也許這也會幫助某人。我帶着我自己的簡單(我認爲)解決方案(這是在CoffeeScript中):

values = $('form').serializeArray() 

model = {} 
for val in values 
    matches = val.name.match /dog\[(.*)\]\[(.*)\]/ 
    model[matches[1]] = {} if !model[matches[1]] 
    model[matches[1]][matches[2]] = val.value 
console.log model 

翻譯成純JS應該是:

var values = $('form').serializeArray(); 

var model = {}; 
for (var i = 0, var len = values.length; i < len; i++) { 
    var val = values[i]; 
    var matches = val.name.match(/dog\[(.*)\]\[(.*)\]/); 
    if (!model[matches[1]]) { 
     model[matches[1]] = {}; 
    } 
    model[matches[1]][matches[2]] = val.value; 
} 
console.log(model); 

產生這樣的輸出:

{ 
    0: 
     { 
      "name": "ABC", 
      "color": "Blue", 
      "height": "41", 
      "weight": "10" 
     } 
    1: 
     { 
      "name": "XYZ", 
      "color": "Pink", 
      "height": "27", 
      "weight": "7" 
     } 
}