嵌套表單（設計問題）

Question

我有一個項目列表顯示在我的頁面上。

1. 項目A [編輯]
2. 項目B [編輯]
3. 項目C [編輯]

當你點擊編輯圖標的每個項目都是可編輯的。 編輯表單與ajax調用一起顯示，控制器返回表單。

1. 編輯形式項A [保存]
2. 項目B [編輯]
3. 項C [編輯]

但是，所有的列表是散裝編輯等的每個項目也具有複選框旁邊。

1. [CB]項目A [編輯]
2. [CB]項目B [編輯]
3. [CB]項目C [編輯]

而一個形式是圍繞列表。

的form_tag 1. [CB]項目A [編輯] 2. [CB]項目B [編輯] 3. [CB]項目C [編輯] 操作：選擇動作[批量編輯] 端

所以當我點擊一個項目編輯按鈕，因爲表單被返回，我有2個表單嵌套。 並且所有代碼都會中斷。

我該怎麼做，所以我沒有圍繞所有項目的批量編輯表單，並以2個嵌套表單結束？

謝謝， Mickael。

Answer 1

我使用javascript解決了我的問題。加載編輯表單時，提交按鈕不提交表單，而是調用將表單參數發送到正確URL的Ajax請求。

Answer 2

你不能嵌套窗體......事實上，如果你嘗試驗證，你將會有一個大而醜陋的html錯誤。

問題的解決方案我認爲是這樣的：當您發出ajax請求並返回編輯表單時，您可以將代碼注入到html的末尾並將其顯示到模式窗口中（我這樣做了幾個月前在一個項目上）。

但是，我不知道回報率如何工作的，它只是一個想法：P

Answer 3

您可以通過CSS的功率可能解決它，使它看起來雖然形式是嵌套...雖然在實際上，他們不是。

從我最有限的CSS知識留給前端工程師或Google。

Answer 4

您可以突出顯示選定的行並在其上綁定「單擊」事件，以便您可以將行切換爲選定/未選中。然後，當點擊提交時，您只需提交具有類「hilight」的行。

你可以離開過該複選框，使結構是這樣的： ... ... ..等

然後使用jQuery，你可以綁定點擊它們的事件，如：

$('.checked').click(function(e) { 
    $(this).toggleClass('hilight'); 
});