簡體   English   中英

使用 spring mvc ModelAttribute 將元素綁定到列表

[英]Bind elements to a list with spring mvc ModelAttribute

該問題基於使用來自 javascript 的索引獲取 spring 模型屬性列表元素,該索引解釋了 html 元素的每個名稱必須包含一個索引。 示例用戶[0]

我有一個表單,允許用戶在提交之前從列表中動態添加或刪除元素。 讓我舉個例子:我們添加了 3 個用戶,所以表單現在將包含 3 個輸入:

<input name="user[0].name"    type="text" />
<input name="user[0].surname" type="text" />
<input name="user[1].name"    type="text" />
<input name="user[1].surname" type="text" />
<input name="user[2].name"    type="text" />
<input name="user[2].surname" type="text" />

如果我們提交這個,我們將有 3 個用戶,每個用戶都有一個名字和一個姓氏。 但是,當我們嘗試刪除 user[1] 時問題就出現了,因為我最終得到了這個 html:

<input name="user[0].name"    type="text" />
<input name="user[0].surname" type="text" />
<input name="user[2].name"    type="text" />
<input name="user[2].surname" type="text" />

如果我們提交此表單,springs 仍會創建 3 個用戶,但 user[1] 的 name 和 surname 將為空值。

我知道我可以處理輸入名稱以始終具有“正確”的形式。 但是還有其他解決方案嗎? 我認為像這樣的形式

<input name="user[].name"    type="text" />
<input name="user[].surname" type="text" />
<input name="user[].name"    type="text" />
<input name="user[].surname" type="text" />

可能會解決問題,但后來我意識到:spring 怎么知道哪個名字來自哪個姓氏。

關於更好的解決方案的任何想法?

最后,我添加了所有沒有索引變量的輸入(在下面的代碼中,我將添加之前丟失的容器):

<div class="container">
    <input name="name"    type="text" />
    <input name="surname" type="text" />
</div>
<div class="container">
    <input name="name"    type="text" />
    <input name="surname" type="text" />
</div>
<div class="container">
    <input name="name"    type="text" />
    <input name="surname" type="text" />
</div>

所以在提交表單之前我使用updateIndexedInputNames($(".container"), "user");

讓我分享 updateIndexedInputNames 的代碼:

function updateIndexedInputNames($container, name){
    $container.each(function(containerIndex, container){
        $(this).find("input,select").each(function(index, element){
            $(element).attr("name", name+"["+containerIndex+"]."+element.name);
        });
    });
}

我不認為這是比@sp00m 建議的更好的解決方案,但它也有效。

希望這對某人有幫助!

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM