foreach 中的 mvc 单选按钮 [英] mvc radiobuttons in foreach

问题描述

我正在使用 MVC，并且我在 foreach 中有一些 RadioButtons:

I'm using MVC and I have some RadioButtons in a foreach:

    foreach (var item in group) {
                    <tr>
                        <td>
                            @Html.RadioButtonFor(modelItem => item.CheckerApproved, true)
                            @Html.RadioButtonFor(modelItem => item.CheckerApproved, false)
                        </td>
                    </tr>
}

因此对于组中的每个项目都应该有一个单选按钮来表示真假.

So for every item in the group there should be a radiobutton for true and false.

问题是当组中有多个项目时，您最终可能会得到两个项目:

The problem is when there are multiple items in the group you might end up with for two items:

<tr>
   <td>
      <input id="item_CheckerApproved" type="radio" value="True" name="item.CheckerApproved">
      <input id="item_CheckerApproved" type="radio" value="False" name="item.CheckerApproved 
         checked="checked">
   </td>
</tr>

<tr>
   <td>
      <input id="item_CheckerApproved" type="radio" value="True" name="item.CheckerApproved">
      <input id="item_CheckerApproved" type="radio" value="False" name="item.CheckerApproved 
         checked="checked">
   </td>
</tr>

我想要的是将 radiobuttons 组分开.因此更改第一行中的值不会影响第二行中的值.但是，如果您在第一行设置了 say true，则在第二行中选择任一值，第一行中的 true 将被取消.

What I wanted was for the radiobuttons groups to be seperate. So changing the value in the first row won't effect the value in the second row. However if you have set say true in the top row then select either value in the second row the true in the first row is cancelled.

我相信这是因为它们是通过 name 属性链接的.但是，您实际上无法手动重置此名称属性.

I believe this is because they are linked by the name attribute. However you can't actually manually reset this name attribute.

有谁知道我如何使它工作，以便每一行的真假相互交互，但对其他行中的 radiobuttons 没有影响?

Does anyone know how I could make it work so the true and false for each row interact with each other but there is no effect on radiobuttons in other rows?

推荐答案

不要在视图中写循环.它们很丑陋，您最终会出现问题中描述的不良行为.使用编辑器模板，如下所示:

Don't write loops in views. They are ugly and you end up with undesired behavior as the one described in your question. Use editor templates, like this:

<table>
    <thead>
        <tr>
            <th>Approved status</th>
        </tr>
    </thead>
    <tbody>
         @Html.EditorFor(x => x.Groups)
    </tbody>
</table>

这里我假设您的视图模型有一个 IEnumerable 类型的 Groups 集合属性.现在剩下的就是编写相应的编辑器模板，该模板将为 Groups 集合中的每个元素执行 (~/Views/Shared/EditorTemplates/GroupViewModel.cshtml):

Here I assume that your view model has a Groups collection property of type IEnumerable<GroupViewModel>. Now all that's left is to write the corresponding editor template which will be executed for each element in the Groups collection (~/Views/Shared/EditorTemplates/GroupViewModel.cshtml):

@model GroupViewModel
<tr>
    <td>
        @Html.RadioButtonFor(x => x.CheckerApproved, "true") <span>Approved</span>
        @Html.RadioButtonFor(x => x.CheckerApproved, "false") <span>Not approved</span>
    </td>
</tr>

现在，您不仅不再需要在视图中编写任何丑陋的 foreach 循环，而且最终获得了正确的命名约定.

Now not only that you no longer need to write any ugly foreach loops in your view but you end up with correct naming convention.

这篇关于foreach 中的 mvc 单选按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！