将多个字段绑定到MVC 3视图模型的相同属性

Question

我目前正试图弄清楚如何将MVC 3视图中的多个字段绑定到视图模型上的1 属性以及尝试实现时的建议这个。

使用一个示例来了解准备某些内容所需的分钟数（仅）。

的形式可能是这个样子：

准备时间 - 时间：[1]分钟：[30]

和提交的表单值需要被转换成分钟，并绑定到PreparationTimeInMinutes财产的ViewModel。

视图模型属性：

public short PreparationTimeInMinutes { get; set; } 

和View是强类型的视图模型，目前有以下：

<div class="editor-label"> 
    @Html.LabelFor(model => model.PreparationTimeInMinutes) 
</div> 
<div class="editor-field"> 
    @Html.EditorFor(model => model.PreparationTimeInMinutes) 
    @Html.ValidationMessageFor(model => model.PreparationTimeInMinutes) 
</div> 

这里是我开始为了实现思考的几件事这个。

1. 更改PreparationTimeInMinutes属性设置为具有一个小时&分钟 财产和创建编辑和显示模板，它的ViewModel，这样 MVC3可以理清绑定和验证？
2. 使用JavaScript和一个隐藏字段的准备时间。
3. 一些其他的方法，让你使用MVC模型绑定来做这种事情？

有没有人对这类事情有最佳做法有任何建议？或者如果我走了。

请让我知道。谢谢

Answer 1

您应该使用第一个选项。
这正是编辑器模板的作用。

如果需要，可以创建一个自定义ModelBinder，以将两个POST值绑定到单个数字（以及类似的编辑器模板），并将属性应用于该属性以选择该ModelBinder。
但是，这可能会矫枉过正。

Answer 2

谢谢SLaks。

使用我没了下文，我认为模型的第一个选项

public TimeInMinutesViewModel PreparationTimeInMinutes { get; set; } 

提出这一视图模型

public class TimeInMinutesViewModel { 
    public string Label { get; set; } 
    public short Hours { get; set; } 
    public short Minutes { get; set; } 
} 

和这个编辑器模板

@model TimeInMinutesViewModel 

<div>@Html.LabelFor(x => x.Label)</div> 
<div class="editor-label">@Html.LabelFor(x => x.Hours)</div> 
<div class="editor-field">@Html.EditorFor(x => x.Hours)</div> 
<div class="editor-label">@Html.LabelFor(x => x.Minutes)</div> 
<div class="editor-field">@Html.EditorFor(x => x.Minutes)</div> 

，并在视图

@Html.EditorFor(model => model.PreparationTimeInMinutes) 
@Html.ValidationMessageFor(model => model.PreparationTimeInMinutes) 

我还没有测试这一点，我可能需要做标签的一些变化，但这看起来似乎是为我想用这种方式为两种不同性质的工作。

我现在已经得到的问题是能够将它们映射到这是一个短整型我的实体属性。

我使用AutoMapper，所以我希望这将与自定义类型转换工作，在1个方向至少，但我不知道两个方向:(

Answer 3

的JavaScript是不坏，但不是真的MVCish。我认为更好的方法是使用这两个字段的视图模型或使用编辑器/显示模板创建一个新类。

我同意SLaks;您可以创建自定义模型联编程序来处理这个问题，但它我创建了一个基于this article的一个日期和两个类型的自定义绑定，虽然我的简单得多，但如果你只是想要练习或了解更多关于模型bindi ng，这是可行的。

编辑：对不起，以防万一你决定尝试ModelBinder的路线，这个例子是有点老了（也许MVC 1？）。我忘了需要进行额外的修改。 Theselinks应该有助于更新该示例。祝你好运。