asp.net-mvc-3 - MVC 3 + knockout : adding the data-bind attribute when using EditorFor for a boolean field

Question

使用@Html.EditorFor(model =>model.IsClient)(其中IsClient是一个 bool 值)，呈现一个下拉列表，其中Not Set, Yes and No为选项。

一切都很好。

现在我想将knockoutjs与生成的下拉列表一起使用，我喜欢，那么如何使用@Html.EditorFor添加数据绑定(bind)属性，我需要knockoutjs来处理此下拉列表？

我已经尝试过:

@Html.EditorFor(model => model.IsClient, new Dictionary<string, object> { { "data-bind", "value: Account.IsClient" } })

但是，这使用对象additionalViewData参数，并且它不呈现数据绑定(bind)属性。这可能是很自然的，因为这个参数可能与渲染标签的 Html 属性无关。

但是，找不到任何合理的文档，并且其他重载看起来都不符合我想要的。

TIA 有任何建议。

Answer 1

布拉德·威尔逊 blogged关于 ASP.NET MVC 2 中的显示和编辑器模板。因此您可以修改 bool 值的默认模板并添加您需要的属性 (~/Views/Shared/EditorTemplates/MyTemplate.cshtml):

@{
    bool? value = null;
    if (ViewData.Model != null) 
    {
        value = Convert.ToBoolean(ViewData.Model, System.Globalization.CultureInfo.InvariantCulture);
    }

    var triStateValues = new List<SelectListItem> 
    {
        new SelectListItem 
        { 
            Text = "Not Set",
            Value = String.Empty,
            Selected = !value.HasValue 
        },
        new SelectListItem 
        { 
            Text = "True",
            Value = "true",
            Selected = value.HasValue && value.Value 
        },
        new SelectListItem 
        { 
            Text = "False",
            Value = "false",
            Selected = value.HasValue && !value.Value 
        },
    };
}

@if (ViewData.ModelMetadata.IsNullableValueType) 
{
    <!-- TODO: here you can use any attributes you like -->
    @Html.DropDownList(
        "", 
        triStateValues, 
        new { 
            @class = "list-box tri-state", 
            data_bind="value: " + ViewData.TemplateInfo.GetFullHtmlFieldName("") // you could also use ViewData.ModelMetadata.PropertyName if you want to get only the property name and not the entire navigation hierarchy name
        }
    )
} 
else 
{
    @Html.CheckBox("", value ?? false, new { @class = "check-box" })
}

最后:

@Html.EditorFor(model => model.IsClient, "MyTemplate")

或使用 UIHint 属性装饰 View 模型上的 IsClient 属性:

[UIHint("MyTemplate")]
public bool? IsClient { get; set; }

然后:

 @Html.EditorFor(x => x.IsClient)

将自动选择自定义编辑器模板。