如何在表單中保存「添加另一個」數據？

我有一個表單。在這種形式下，用戶可以填寫一些字段，然後點擊「添加」。數據變成一個HTML元素，然後表單得到（部分）清除，以便他可以鍵入更多的數據。如何在表單中保存「添加另一個」數據？

我想弄清楚如何存儲數據，當他點擊「添加」，以便它可以稍後提交。我應該序列化（JSON？還是有更緊湊的表示形式 - 不需要人類可讀），並將其存儲在隱藏域中？如果是這樣，當他添加第二個對象時會發生什麼？我對舊數據進行反序列化，然後將這兩個對象重新組合在一起？似乎效率低下。

難道我會以某種方式克隆表單，隱藏它，並更新所有name屬性，以免它們發生衝突，然後殺死自己試圖將這些愚蠢的東西解析到數組中？

什麼是最好的方法？

來源

2011-02-09 mpen

您是否必須提交表單或可以使用Ajax調用來發布數據？ –

@K Ivanov：我寧願按照正常的方式提交表單，不用JS。 – mpen

在名稱的某個位置創建一個帶有增量數字後綴的隱藏字段。

var fields = $('input[type=hidden][name^=foo_]', form).length; 
$('<input type="hidden" name="foo_' + (fields + 1) + '">').val(val).appendTo(form);

提交它通常的方式，jQuery.serialize()等。

最後在服務器端截取它（半僞）。

for (var i = 0; i < Integer.MAX_VALUE; i++) { 
    var value = request.getParameter("foo_" + i); 
    if (value == null) break; 
    // ... 
}

注意，與多個同名的隱藏字段也被允許的，但你是依賴於使用它們是否會從請求相同的順序收集，因爲它們出現在查詢字符串中的服務器端技術（HTTP/HTML規範已經要求它們必須在HTTP查詢字符串中以與它們各自的HTML輸入元素出現在DOM樹中相同的順序出現）。據我所知，PHP和Servlet正確地做到了這一點（即值在參數值數組中出現的順序與它們出現在HTTP查詢字符串中的順序相同）。

來源

2011-02-09 19:33:41 BalusC

另一個有趣的部分是我想讓用戶也刪除它們。那麼我將不得不循環所有這些隱藏的表單並對它們重新編號？ – mpen

@Mark：我會添加另一個表示Integer.MAX_VALUE的隱藏字段，並在每次添加時增加它，並將其用作隱藏字段的名稱後綴，並在服務器端用作循環的結束條件。如果value爲null/empty，那麼它已被刪除，但您可以忽略它並繼續。 – BalusC

@BalusC：聽起來不那麼痛苦。 – mpen

這在某種程度上取決於您的服務器如何預期數據，而這又取決於您使用的是服務器端的語言/框架。如果您的服務器可以輕鬆處理具有相同名稱的多個字段，則非常簡單。（這個例子用jQuery進行簡化。）

function onAddMore() { 
    var $form = $("#myForm"); 
    var $foo = $form.find("[name=foo]").eq(0); // the first (original) foo 

    $form.append($foo.clone()) 
    $foo.val(""); 
}

當用戶提交表單通常情況下，您的查詢看起來像foo=bar&foo=baz&foo=quux。

下面是如何遍歷Python CGI中的值的示例。

form = cgi.FieldStorage() 

for foo in form.getlist("foo"): 
    # do something with foo

還是在PHP（請注意，PHP，the field must be named foo[]）。

for ($_GET["foo"] as $foo) { // $_POST would work the same way, of course 
    // do something with $foo 
}

來源

2011-02-09 19:53:03

正如我向Yads解釋，這是行不通的。它不適用於複選框或單選按鈕，以及任何服務器端語言。 – mpen

如何在表單中保存「添加另一個」數據？

回答

相關問題