用于勾选多个单选按钮的按钮答案

【问题标题】：Button to tick multiple radio buttons用于勾选多个单选按钮的按钮
【发布时间】：2018-08-16 08:23:18
【问题描述】：

我有一个 .NET MVC 项目，其中我的视图中有多个单选按钮，这些按钮绑定到我的 SQL 表中的唯一项目。这是我的视图页面中的一个代码块，它为每一行生成两个单选按钮。

@foreach(var item in Model){
@Html.RadioButton(item.ReviewID, "Retain")Retain &emsp;
@Html.RadioButton(item.ReviewID, "False")Remove

}

在整个列表下方，我有两个正在尝试处理的按钮，它们将勾选所有相应的单选按钮。

<input type="button" value="Retain All" onclick="retainAll()" />
<input type="button" value="Retain All" onclick="removeAll()" />

我试图调用我在视图中声明的这两个助手：

@helper retainAll()
{
    foreach (var item in Model)
    {
        @Html.RadioButton(item.ReviewID, "Retain", isChecked: true);
    }
}

@helper removeAll()
{

    foreach (var item in Model)
    {
        @Html.RadioButton(item.ReviewID, "Remove", isChecked: true);
    }

}

但是，当我尝试单击任何按钮时，它什么也没做。这是它在我的视图中的样子：

https://imgur.com/a/uPxgvKv

请注意，那里的保存更改按钮有效。单击时，它会通过单击单选按钮更新 SQL 数据库。

“保留全部”和“全部删除”按钮的想法只是用保留或删除勾选所有单选按钮。

**再次，我不是在询问如何将单选按钮的值回发到我的 sql 表中。只是询问是否有一种方法，如果我单击视图中的“保留全部”或“全部删除”按钮，它将勾选视图中的所有相应单选按钮。（将它们的 'isChecked' 属性设置为 true）

在我的视图中删除了辅助代码块并将其替换为：

<script>
function retainAll()
{
    @foreach (var item in Model)
    {
        @Html.RadioButton("rbResponse" + item.ReviewItemID.ToString(), "Retain", isChecked: true);
    }
}

function removeAll()
{
    @foreach (var item in Model)
    {
        @Html.RadioButton("rbResponse" + item.ReviewItemID.ToString(), "Remove", isChecked: true);
    }

}
</script>

【问题讨论】：

removeAll()和retainAll()的功能是什么？
您的@helper 方法毫无意义 - 这是剃刀代码，在模型传递到视图之前在服务器上执行 - 它在客户端上不存在。
而且你的foreach 循环也没有任何意义——你将单选按钮绑定到不存在的东西（一个名为item.ReviewID 的属性，当你提交时它不会绑定到任何东西。你需要一个包含（比如说）string SelectedValue 和 List<T> 属性的视图模型
您需要将您的函数编写为 JavaScript 函数，以便它们在客户端执行。一旦你的页面被渲染，你的剃刀代码将不再存在。
@StephenMuecke，item.ReviewID 属性是从我的控制器获得的。我的控制器中有一个 LINQ 查询，它从我的 SQL 表中获取数据并将其传递到我的视图中。它绑定到我的 SQL 表中每一行的“ReviewID”值。

标签： c# asp.net .net asp.net-mvc razor

【解决方案1】：

我终于找到了解决办法。我在我的视图中制作了一个脚本：

<script type="text/javascript">

        $(document).ready(function () {
            $("#selectRetain").click(function () {
                $('input:radio[value=Retain]').prop('checked', true);
            });

            $("#selectRemove").click(function () {
                $('input:radio[value=Remove]').prop('checked', true);
            })
        });        
    </script>

并像这样更改了我的按钮：

<input type="button" value="Retain All" id='selectRetain'>
<input type="button" value="Retain All" id='selectRemove'>

现在，每当我选择这些按钮中的每一个时，它们都会将页面中单选按钮的 isChecked 值更改为 true。

【讨论】：