使用 spring mvc ModelAttribute 将元素绑定到列表答案

【问题标题】：Bind elements to a list with spring mvc ModelAttribute使用 spring mvc ModelAttribute 将元素绑定到列表
【发布时间】：2013-01-16 19:31:19
【问题描述】：

该问题基于getting a spring model attribute list element using an index from javascript，其中解释了 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 个用户，每个用户都有一个名字和一个姓氏。但是，当我们尝试删除用户时问题就来了[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 个用户，但用户 [1] 的姓名和姓氏将具有空值。

我知道我可以处理输入名称以始终具有“正确”的形式。但是还有其他解决方案吗？我认为像

这样的形式

<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怎么知道哪个姓哪个姓。

有更好的解决方案吗？

【问题讨论】：

如何删除这些字段？我的意思是隐藏/禁用或删除 HTML？
我也遇到了同样的问题，也许这对你有帮助：Spring 3 MVC: one-to-many within a dynamic form (add/remove on create/update)
嗨 Ajinkya，我正在使用 jquery 删除输入。它们用一些 div 和我省略的其他 html 代码包装。
谢谢 sp00m！这是个好主意。我想出的另一个解决方案是在提交表单之前动态设置输入的名称。使用 jquery.each 函数很容易做到这一点。
@gfournier 这也可能很有趣！如果您尝试过您的反馈，请告诉我您的反馈;)

标签： java html forms spring spring-mvc

【解决方案1】：

最后我添加了所有没有索引变量的输入（现在我将添加之前缺少的容器）：

<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 建议的解决方案更好的解决方案，但它也有效。

希望这对某人有所帮助！

【讨论】：