将部分视图 CheckBox 绑定到模型属性答案

【问题标题】：Binding partial view CheckBox to model property将部分视图 CheckBox 绑定到模型属性
【发布时间】：2019-04-09 12:28:32
【问题描述】：

有一个数据库上下文，其中集合的元素是类 VirtualServer。我试图将它呈现为一个表格，在其中一个列中将有复选框，这些复选框应该更改 VirtualServer 类中的 IsSelectedForRemove 属性

我的模特：

public class VirtualServer
    {
        public VirtualServer()
        {
            CreateDateTime = DateTime.Now.ToString();
        }

        public Int32 VirtualServerId { get; set; }

        public String CreateDateTime { get; set; }

        public String RemoveDateTime { get; set; }

        public Boolean IsSelectedForRemove { get; set; }
    }

我的主要观点：

@using VirtualServerManager.Models

@model VirtualServersManagerContext

@{
    Layout = null;

    AjaxOptions ajaxOptions = new AjaxOptions
    {
        UpdateTargetId = "tableBody"
    };

}

<!DOCTYPE html>

<html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>Virtual Servers Manager</title>

        <script src="~/Scripts/jquery-1.10.2.js"></script>
        <script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
    </head>
    <body>
        <div>
            <h3>Virtual Servers Manager</h3>

            @using (Ajax.BeginForm("Index", ajaxOptions))
            {
                <table border="1">
                    <tr>
                        <td><p>VirtualServerId</p></td>
                        <td><p>CreateDateTime</p></td>
                        <td><p>RemoveDateTime</p></td>
                        <td><p>SelectedForRemove</p></td>
                    </tr>

                    <tbody id="tableBody">
                        @Html.Partial("GetVirtualServers", Model.VirtualServers)
                    </tbody>
                </table>
                <input type="submit" value="SendSelected"/>
            }
        </div>
    </body>
</html>

我的部分观点：

@using VirtualServerManager.Models

@model IEnumerable<VirtualServer>

@foreach (var server in Model)
{
    <tr>
        <td><p>@server.VirtualServerId</p></td>
        <td><p>@server.CreateDateTime</p></td>
        <td><p>@server.RemoveDateTime</p></td>
        <td>
            @Html.HiddenFor(m => server.VirtualServerId)
            @Html.CheckBoxFor(m => server.IsSelectedForRemove)
        </td>
    </tr>
}

我的控制器：

public class HomeController : Controller
    {
        public HomeController()
        {
            _dataBaseContext = new VirtualServersManagerContext();
        }

        public ActionResult Index()
        {
            return View(_dataBaseContext);
        }

        [HttpPost]
        public PartialViewResult Index(VirtualServersManagerContext model)
        {
            return PartialView("GetVirtualServers", _dataBaseContext.VirtualServers);
        }

        VirtualServersManagerContext _dataBaseContext;
    }

我希望当我更改复选框的状态并单击 SendSelected 按钮时，post action Index 会出现一组 VirtualServer 与 IsSelectedForRemove 属性的实际值，但没有任何变化

【问题讨论】：

标签： c# asp.net-mvc razor

【解决方案1】：

您必须在部分视图中使用 @using (Ajax.BeginForm("Index", ajaxOptions))。好吧，您不能以通常的方式执行此操作（用表格包围您的行），因为表格中的每一行都不能有多个表格。幸运的是，HTML5 为我们提供了一个很好的解决方法，即 form 属性。 你应该尝试做这样的事情：

@using VirtualServerManager.Models

@model IEnumerable<VirtualServer>

@foreach (var server in Model)
{
    using (Ajax.BeginForm("Index", ajaxOptions), new {id=server.Id}) //set unique Id for the form
            {
    <tr>
        <td><p>@server.VirtualServerId</p></td>
        <td><p>@server.CreateDateTime</p></td>
        <td><p>@server.RemoveDateTime</p></td>
        <td>
            @Html.HiddenFor(m => server.VirtualServerId, new{form = @server.Id} ) //use the form id in the fields you want to update
            @Html.CheckBoxFor(m => server.IsSelectedForRemove, new{form = @server.Id})
            @Html.Hidden("IsSelectedForRemove", false)//Checkbox needs this Hmtl.Hidden(), to send false to the server if the checkbox is unchecked 
        </td>
    </tr>
    }
}

这应该可以解决问题。

【讨论】：

它导致在“@”字符后出现意外的“using”关键字。进入代码后，您无需在“使用”之类的结构前面加上“@”
我将所有id 修复为VirtualServerId 并删除new { id = @server.VirtualServerId }，因为它会导致预期的CS1026:)。但仍然无法正常工作