Razor EditorFor 与 Onclick 事件

Question

我有一个可以为 null 的布尔值，它使用以下代码显示为复选框：

@Html.EditorFor(m => m.IsInitialStatus, new { htmlAttributes = new { @onclick = "InitialOrStarting()" } })

然而，当页面加载时，@onclick 属性没有被添加到 HTML。我在这里错过了什么吗？我从这个 page.

的答案中拿了这个例子

我也考虑过将其更改为 CheckBoxFor，但一直遇到可为 null 的 Bool 数据类型的问题。

如有任何帮助，我们将不胜感激！我只想要一个可以为 null 的 bool 复选框，并触发一个 Javascript 函数的 onClick 事件...我不是最高级的用户，但这对我来说似乎比它应该做的更难！？

编辑

布尔值似乎有一个 EditorTemplate，其中包含：

@model bool?

@Html.CheckBox("", Model.GetValueOrDefault())

Answer 1

您正在使用 EditorFor() 的重载，其中第二个参数是 additionalViewData。如果您没有 bool? 的特定 EditorTemplate，该方法将生成默认模板，这是一个 <select>，具有 null、true 的 3 个值和 false，并包括属性。

但是因为你有一个 EditorTemplate，你需要通过读取 ViewDataDictionary 的值自己添加属性（通常，一个 EditorTemplate 包含多个 html元素，因此该方法无法知道您要将属性应用到哪个元素。

您的模板需要

@model bool?
@{ var attributes = ViewData["htmlAttributes"]; }
@Html.CheckBox("", Model.GetValueOrDefault(), attributes)

话虽如此，你不应该这样做。 bool? 有 3 种状态（null、true 或 false），但复选框只有 2 种状态 - 打开或关闭（转换为 true 或 false) 所以你的 EditorTemplate 不代表你的属性.

的可能值

如果您只想允许 true 或 false，那么您的属性不应为空。或者，使用允许 null 选择的默认模板（或者如果您想要替代 UI，创建一个呈现 3 个单选按钮的模板）

此外，我建议您停止使用行为污染您的标记并使用 Unobtrusive JavaScript - 即您的脚本将是

$(yourCheckBox).click(function() {
    ... // do something
});

Answer 2

Onclick 事件不适用于@HtmlEditorFor。但是你可以使用 class 属性。

<script>
    $(".single-checkbox").on("change", function () {
        if ($(".single-checkbox:checked").length > 2) {
            this.checked = false;
            alert ("Only 2 choice")
        }
    });
</script>

@Html.EditorFor(model => model.YourProperty, new { htmlAttributes = new { @class = "single-checkbox" } }) 
@Html.EditorFor(model => model.YourProperty, new { htmlAttributes = new { @class = "single-checkbox" } }) 
@Html.EditorFor(model => model.YourProperty, new { htmlAttributes = new { @class = "single-checkbox" } }) 
@Html.EditorFor(model => model.YourProperty, new { htmlAttributes = new { @class = "single-checkbox" } })

Razor EditorFor 与 Onclick 事件

Razor EditorFor with Onclick Event

asp.net-mvc

onclick

editorfor