如何將複雜的HTML表單作爲JSON發佈？

Question

我在網頁中有一個非常複雜的表單。用戶實際上構建了一個複雜的對象。 UI是使用jQuery處理的（顯示，隱藏部分，複製和刪除子表單，...）。

只要在用戶提交時發佈表單（儘管可能），似乎並不是最好的解決方案：很難爲字段組成唯一的名稱（可以是對象數組），並且可以解碼服務器端的所有信息。

我想我應該發佈對象的JSON表示。我怎麼做？

我不是想要做一個ajax調用。我想提交表單，但使用JSON而不是通常的應用程序/ x-www-form-urlencoded表單。

FWIW，後端是ASP.NET MVC。

TIA，

Answer 1

連載使用腳本爲JSON ...

雖然這個答案使用Ajax，你可以寫，而不是序列化的字符串到輸入[類型=隱藏在你的形式

Serializing to JSON in jQuery

Answer 2

你可以試試這個：

$("form").submit(function() 
{ 
    //Checking data here: 
    $("input").each(function(i, obj) 
    { 
    }); 
    alert($(this).serialize()); 
    alert(toJSON($(this).serializeArray())); 
    //return false; 
}); 

function toJSON(obj) 
{ 
    var json = '({'; 
    $.each(obj, function(k,v){ 
    var q = typeof v == 'string' ? ~v.indexOf("'") ? '"' : "'" : ''; 
    if (typeof v == 'object') 
    v = toJSON(v).slice(0,-1).substr(1); 
    json+= k + ':'+ q + v + q + ','; 
    }); 
    return json.slice(0,-1)+'})'; 
}; 

我的小提琴：http://jsfiddle.net/Achilleterzo/6Zj6n/

Answer 3

使用jquery form plugin通過AJAX提交表單。 對於重複的字段名稱，默認方式通常在名稱後面加上[] - 大多數服務器端語言會創建一個包含所有提交值的數組。根據不同的語言，它可能會在沒有[]的情況下發生，但我確定MSDN將幫助您，因爲您正在爲後端使用ASP.NET。

Answer 4

如果您正在使用jQuery你可以看看這兩個功能.serialize（）和.serializeArray（）

這些功能將幫助您獲得表單數據，無需你手動循環。