绑定到CheckboxFor集合(Binding to a collection of Checkb

2019-06-26 06:24发布

我想实现一个许可屏幕中,用户可以给一个特定的屏幕上特定权限。 对于这个我生成Checkboxfor的集合,势必布尔属性的集合。 但是,当我提交表单,我要么让所有的布尔属性真或假都取决于我是否初始化为真或假的视图模型构造这些属性。

下面是视图模型的代码:

的方法我:

public class MyViewModel
{
    public MyModel Model { get; set; }        

    public IEnumerable<ScreenType> Screens { get; set; }
    public IEnumerable<SecurityType> SecurityTypes { get; set; }
    public List<PermissionType> Permissions { get; set; }        

    public MyViewModel()
    {
        LoadScreens();
        LoadSecurityTypes();
        LoadPermissions();
    }

    public void LoadPermissions()
    {
        Permissions = new List<PermissionType>();

        foreach (var screen in Screens)
        {
            foreach (var securityType in SecurityTypes)
            {
                Permissions.Add(
                    new PermissionType
                    {
                        PermissionId= Guid.NewGuid(),
                        ScreenId= screen.Id,
                        SecurityId = securityType.Id,
                        IsAllowed = false
                    });
            }
        }
    }    
}

办法之二

public class MyViewModel
{
    public MyModel Model { get; set; }        

    public IEnumerable<ScreenType> Screens { get; set; }
    public IEnumerable<SecurityType> SecurityTypes { get; set; }
    public List<bool> AllowedList { get; set; }        

    public MyViewModel()
    {
        LoadScreens();
        LoadSecurityTypes();
        LoadPermissions();
    }

    public void LoadPermissions()
    {
        AllowedList = new List<bool>();

        foreach (var form in Forms)
        {
            foreach (var security in Securities)
            {
                AllowedList.Add(false);
            }
        }
    }    
}

这里是代码我的看法:

的方法我:

    @using (Ajax.BeginForm("Create", "Role", null, new AjaxOptions { UpdateTargetId = "addStatus", InsertionMode = InsertionMode.Replace, OnSuccess = "onFormPostSuccess" }, new { @id = "AddForm" }))
    {  
        <div>
            <span><label>Screen</label></span>
            @foreach (var security in Model.SecurityTypes)
            { 
                <span><label>@security.Name</label></span>                    
            }
            <br />
            @foreach (var screen in Model.Screens)
            {
                <span>@screen.Name</span>
                foreach (var security in Model.SecurityTypes)
                { 
                    <span>@Html.CheckBoxFor(m => m.Permissions.Where(s => s.SecurityId == security.Id && s.ScreenId == screen.Id).Single().IsAllowed, new { @id = HtmlHelper.GenerateIdFromName("Create" + screen.Name + security.Name) })</span>                   
                }
                <br />
            }
        </div>
        <div>
            <span>
                <input type="image" src="/content/images/submit_button.png" value="submit" />
            </span> 
        </div>
        <div>
            <span id="addStatus" class="submitStatus"></span>
        </div>
    }

办法之二:

 @using (Ajax.BeginForm("Create", "Role", null, new AjaxOptions { UpdateTargetId = "addStatus", InsertionMode = InsertionMode.Replace, OnSuccess = "onFormPostSuccess" }, new { @id = "AddForm" }))
    {  
        <div>
            <span><label>Screen</label></span>
            @foreach (var security in Model.SecurityTypes)
            { 
                <span><label>@security.Name</label></span>                    
            }
            <br />
            @foreach (int i=0; i < Model.Screens.Count(); i++)
            {
                <span>@Model.Screens.ElementAt(i).Name</span>
                foreach (int j=0; j<Model.SecurityTypes.Count(); j++)
                { 
                    @* The index 5*i+j is because I have 5 security types *@ 
                    <span>@Html.CheckBoxFor(Model.AllowedList[5*i+j], new { @id = HtmlHelper.GenerateIdFromName("Create" + @Model.Screens.ElementAt(i).Name + @Model.SecurityTypes.ElementAt(j).Name) })</span>                   
                }
                <br />
            }
        </div>
        <div>
            <span>
                <input type="image" src="/content/images/submit_button.png" value="submit" />
            </span> 
        </div>
        <div>
            <span id="addStatus" class="submitStatus"></span>
        </div>
    }

下面是在控制器创建actionmethod的代码:

    [Authorize]
    [HttpPost]
    public JsonResult Create(MyViewModel viewModel)
    {   
        if ( ModelState.IsValid)
        {                

            if (service.AddRole(viewModel))
            {                    
                return Json("Role Added !");
            }
            return Json("Role exists !");
        }
        return Json("Please correct errors");
    }

当我检查视图模型的创建actionmethod,所有IsAllowed性能都是假的。 正如在视图模型构造器中初始化。 没有办法检查/从视图中取消选中复选框的效果。

我缺少的东西吗?

Answer 1:

强类型HTML辅助比如CheckBoxFor只用简单的表达式作为第一个参数(财产和至多数组索引访问)工作。 下面的表达式是什么完全脱离这个助手的能力:

m => m.Permissions.Where(s => s.SecurityId == security.Id && s.ScreenId == screen.Id).Single().IsAllowed

我会建议你使用一个真正的视图模型,并在你的控制器级域模型和视图模型之间的映射时执行此。


更新:

显然,我对视图模型的回答并不明确,所以让我尝试举例说明我的视图模型的意思。

因此,我们首先来定义我们的,将被要求执行此视图所需要的逻辑视图模型:

public class CreateViewModel
{
    public IEnumerable<ScreenViewModel> Screens { get; set; }
}

public class ShowCreateViewModel: CreateViewModel
{
    public IEnumerable<SecurityTypeViewModel> SecurityTypes { get; set; }
}

public class ScreenViewModel
{
    public string ScreenName { get; set; }
    [HiddenInput(DisplayValue = false)]
    public int ScreenId { get; set; }
    public IEnumerable<SecurityTypeViewModel> SecurityTypes { get; set; }
}

public class SecurityTypeViewModel
{
    public string SecurityName { get; set; }
    [HiddenInput(DisplayValue = false)]
    public int SecurityTypeId { get; set; }
    public bool IsAllowed { get; set; }
}

然后,我们可以有一个控制器动作,将采取取从仓库或东西,地图视图模型域模型的护理:

public class HomeController : Controller
{
    public ActionResult Create()
    {
        // The information will obviously come from a domain model that 
        // we map to a view model, but for the simplicity of the answer
        // I am hardcoding the values here
        var securityTypes = new[]
        {
            new SecurityTypeViewModel { SecurityTypeId = 1, SecurityName = "security 1" },
            new SecurityTypeViewModel { SecurityTypeId = 2, SecurityName = "security 2" },
            new SecurityTypeViewModel { SecurityTypeId = 3, SecurityName = "security 3" },
        };

        // The information will obviously come from a domain model that 
        // we map to a view model, but for the simplicity of the answer
        // I am hardcoding the values here
        return View(new ShowCreateViewModel
        {
            SecurityTypes = securityTypes,
            Screens = new[]
            {
                new ScreenViewModel 
                {
                    ScreenId = 1,
                    ScreenName = "Screen 1",
                    SecurityTypes = securityTypes
                },
                new ScreenViewModel 
                {
                    ScreenId = 2,
                    ScreenName = "Screen 2",
                    SecurityTypes = securityTypes
                },
            }
        });
    }

    [HttpPost]
    public ActionResult Create(CreateViewModel model)
    {
        // The view model passed here will contain all the necessary information
        // for us to be able to perform the actual Save: 
        // a list of the screen ids along with a list of the selected permission ids

        return Content(
            "Thank you for selecting the following allowed permissions:<br/>" + 
            string.Join("<br/>", model.Screens.Select(s => string.Format(
                "screen id: {0}, permission ids: {1}", 
                s.ScreenId, 
                string.Join(",", s.SecurityTypes.Where(st => st.IsAllowed).Select(st => st.SecurityTypeId))
            )))
        );
    }
}

现在剩下的就是定义视图和相应的编辑器/显示模板。

让我们先从主视图( ~/Views/Home/Create.cshtml ):

@model ShowCreateViewModel

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>

@using (Ajax.BeginForm("Create", "Home", null, new AjaxOptions { UpdateTargetId = "addStatus", InsertionMode = InsertionMode.Replace, OnSuccess = "onFormPostSuccess" }, new { @id = "AddForm" }))
{  
    <table>
        <thead>
            <tr>
                <th>Screen/Security type</th>
                @Html.DisplayFor(x => x.SecurityTypes)
            </tr>
        </thead>
        <tbody>
            @Html.EditorFor(x => x.Screens)
        </tbody>
    </table>    

    <div>
        <input type="submit" value="submit" />
    </div>

    <div id="addStatus" class="submitStatus"></div>
}

接下来我们就为编辑模板ScreenViewModel模型( ~/Views/Shared/EditorTemplates/ScreenViewModel.cshtml ):

@model ScreenViewModel
<tr>
    <td>
        @Html.DisplayFor(x => x.ScreenName)
        @Html.EditorFor(x => x.ScreenId)
    </td>
    @Html.EditorFor(x => x.SecurityTypes)
</tr>

然后在编辑模板SecurityTypeViewModel模型( ~/Views/Shared/EditorTemplates/SecurityTypeViewModel.cshtml ):

@model SecurityTypeViewModel
<td>
    @Html.CheckBoxFor(x => x.IsAllowed)
    @Html.EditorFor(x => x.SecurityTypeId)
</td>

最后的显示模板SecurityTypeViewModel模型( ~/Views/Shared/DisplayTemplates/SecurityTypeViewModel.cshtml ):

@model SecurityTypeViewModel
<th>
    @Html.DisplayFor(x => x.SecurityName)
</th>

而这几乎是它:

我已经为你留下您的实际域模型,并在此定义的视图模型之间的映射。



文章来源: Binding to a collection of CheckboxFor