可重复使用的复选框局部视图 [英] reusable checkbox partial view
问题描述
我有一个使用的类（CheckBoxModel）使用字符串和布尔列表（CheckBoxListModel）创建一个复选框列表的局部视图。在code工作创建的复选框和选择的发送回控制器的页面职位时。我试图找到一种方法，让我的部分可重复使用。正如你可以在code看到我送的部分完整的模型，这工程，以获取更新的复选框的页面职位时。我想送我的模特CheckBoxListModel，但它不工作，因为当它创建的复选框的名称不正确。我想通过发送一个CheckBoxListModel重用部分，所以我没有创造我需要一组复选框以单独的部分每一次。
I have a partial view that uses a list (CheckBoxListModel) of classes (CheckBoxModel) with a string and bool to create a list of checkboxes. The code works to create the checkboxes and sends the selected ones back to the controller when the page posts. I am trying to find a way to make my partial reusable. As you can see in the code I send the partial the full Model and this works to get the updated checkboxes when the page posts. I tried to send my Model's CheckBoxListModel, but it does not work because when it creates the checkboxes the name is incorrect. I would like to reuse the partial by sending it a CheckBoxListModel so I do not have to create a separate partial every time I need a set of checkboxes.
我试图change_CheckBoxListPartial.cshtml到
I tried to change_CheckBoxListPartial.cshtml to
@model MySite.Models.ViewModels.CheckBoxListModel
...
@Html.EditorFor(x => x.CheckBoxes)
...
但没有clmReturnOptions的复选框的名字最终成为名=的CheckBox [0] .isChecked，而不是NAME =clmReturnOptions.CheckBoxes [0] .isChecked因此在模型中没有更新他们当页面职位，回来到控制器
but without the clmReturnOptions the checkbox names end up as name="CheckBoxes[0].isChecked" instead of name="clmReturnOptions.CheckBoxes[0].isChecked" so they are not updated in the Model when the page posts and gets back to the controller.
我一直在寻找： HTTP ：//haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/ 但似乎仍然无法得到复选框没有整个模型发送给工作我部分。
I have been looking at: http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx/ but still can't seem to get the checkboxes to work without sending the entire model to my partial.
CheckBoxListModel.cs
CheckBoxListModel.cs
public class CheckBoxListModel: ICheckBoxList
{
public IList<CheckBoxModel> CheckBoxes { get; set; }
public string CheckBoxListTitle { get; set; }
public CheckBoxListModel()
{
}
}
public class CheckBoxModel
{
public string CheckBoxName { get; set; }
public string DisplayName { get; set; }
public bool isChecked { get; set; }
public CheckBoxModel()
{ }
public CheckBoxModel(string checkboxname, string displayname, bool ischecked)
{
CheckBoxName = checkboxname;
DisplayName = displayname;
isChecked = ischecked;
}
}
public interface ICheckBoxList
{
IList<CheckBoxModel> CheckBoxes { get; set; }
string CheckBoxListTitle { get; set; }
}
ReportFilterViewModel.cs
ReportFilterViewModel.cs
public class ReportFilterViewModel
{
public ReportFilterViewModel()
{
clmReturnOptions = new CheckBoxListModel();
}
public CheckBoxListModel clmReturnOptions { get; set; }
}
＆filters.cshtml LT; - 这是部分被称为
filters.cshtml <-- this is where the partial is called
@model MySite.Areas.Reports.Models.ViewModels.ReportFilterViewModel
...
@if (Model.Filters.IsReturnsOptionsAvailable)
{
Html.RenderPartial("_CheckBoxFilterPartial", Model.clmReturnOptions);
}
...
_CheckBoxFilterPartial.cshtml
_CheckBoxFilterPartial.cshtml
@model MySite.Areas.Reports.Models.ViewModels.ICheckBoxList
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<title>Returns Options</title>
</head>
<body>
<div class="col-md-4">
<div class="plm prm ptm pbm configureCellSplitBG configureCellSplitBG-outline mtm">
<div class="row mlm mrm">
<h6>@Model.CheckBoxListTitle</h6>
</div>
@Html.EditorFor(x => x.CheckBoxes)
</div>
</div>
</body>
</html>
CheckBoxModel.cshtml
CheckBoxModel.cshtml
@model MySite.Areas.Reports.Models.ViewModels.CheckBoxModel
<div class="row mlm mrm">
<div class="form-group">
<label class="checkbox">
@Html.CheckBoxFor(x => x.isChecked, new { @data_toggle = "checkbox" })
@Html.LabelFor(x => x.CheckBoxName, Model.DisplayName)
@Html.HiddenFor(x => x.CheckBoxName)
</label>
</div>
</div>
更新
当我查看源代码，我可以看到，复选框的名字仍然是： NAME =的CheckBox [0] .isChecked
所以在型号回来到控制器的列表为空
UPDATE
When I view source I can see that the CheckBox names are still: name="CheckBoxes[0].isChecked"
So when the model gets back to the controller the list is null
我做了从移动到MySite.Models.ViewModels的MySite.Areas.Reports.Models CheckBoxListModel.cs，因为一切是reports.models下1其他变动
1 other change I made was moving the CheckBoxListModel.cs from MySite.Models.ViewModels to MySite.Areas.Reports.Models, since everything else is under the reports.models.
这个问题似乎是局部视图。如果我把 @ Html.EditorFor（X =＆GT; x.clmReturnOptions.CheckBoxes）在我的主页复选框都与全名创建，并正确更新。当我试图用EditorFor在局部视图的复选框名称更改与链接到他们回到模型休息。我想有这样一个局部视图，所以我不必添加的所有UI格式化随处可见我希望有一个复选框列表。
The problem seems to be the partial view. If I put @Html.EditorFor(x => x.clmReturnOptions.CheckBoxes) in my main page the checkboxes are created with the full name and are updated correctly. As soon as i tried to use the EditorFor in the partial view the checkbox name changes and the link to them back to the Model breaks. I would like to have this in a partial view so I do not have to add all the ui formating everywhere i want a checkbox list.
我已经更新了上述code
I have updated the above code
推荐答案
您需要将preFIX传递到局部视图，使元素正确命名
You need to pass the prefix to the partial view so the elements are correctly named
@if (Model.Filters.IsReturnsOptionsAvailable)
{
Html.RenderPartial("_CheckBoxFilterPartial", Model.clmReturnOptions, new ViewDataDictionary
{
TemplateInfo = new System.Web.Mvc.TemplateInfo { HtmlFieldPrefix = "clmReturnOptions" }
})
}
您也可以编写自定义的HTML帮助，使这个更容易一些。
You can also write a custom html helper to make this a little easier
public static MvcHtmlString PartialFor<TModel, TProperty>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TProperty>> expression, string partialViewName)
{
string name = ExpressionHelper.GetExpressionText(expression);
object model = ModelMetadata.FromLambdaExpression(expression, helper.ViewData).Model;
var viewData = new ViewDataDictionary(helper.ViewData)
{
TemplateInfo = new System.Web.Mvc.TemplateInfo { HtmlFieldPrefix = name }
};
return helper.Partial(partialViewName, model, viewData);
}
和
@Html.PartialFor(m => m.clmReturnOptions, "_CheckBoxFilterPartial")
这篇关于可重复使用的复选框局部视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
