如何有条件地禁用标记助手中的<select>？

Question

我的目标是根据传递给视图的模型对象的状态有条件地禁用下拉列表.

以下代码正确呈现禁用的<select>标记(但不是有条件的):

<select class="form-control" asp-for="Priority" asp-items="@priorityList" disabled></select>

以下不是.该属性disabled未显示在呈现页面的页面源中:

@{ string disabled = Model.CaseMode == Mode.Active ? "" : "disabled"; }
<select class="form-control" asp-for="Priority" asp-items="@priorityList" @disabled></select>

此外,以下也不会禁用<select>标记.

<select class="form-control" asp-for="Priority" asp-items="@priorityList" @((Model.CaseMode == Mode.Closed) ? "disabled" : "")></select>

我假设<select>在模板中完成字符串替换之前,问题与​​标记帮助程序处理标记有关.谁能建议我如何有条件地禁用这个元素而不必在if else结构中渲染两个单独的元素？

Answer 1

无需创建自定义TagHelper.试试这个.

<select class="form-control" asp-for="Priority" asp-items="@priorityList" disabled="@(true)"></select>
<select class="form-control" asp-for="Priority" asp-items="@priorityList" disabled="@(false)"></select>

这个渲染:

<select class="form-control" id="Priority" name="Priority" disabled="disabled">...</select>
<select class="form-control" id="Priority" name="Priority">...</select>

我从这里意识到:https://github.com/aspnet/Mvc/issues/7333#issuecomment-363504164

Answer 2

默认select标签助手是不可能的，但您可以创建自己的标签助手，并将其配置为对asp-disabled接受布尔值的自定义属性做出反应。

在您看来：

<select class="form-control" asp-for="Priority" asp-items="@priorityList" asp-disabled="@(Model.CaseMode == Mode.Closed)"></select>

然后，创建您的TagHelper类：

using Microsoft.AspNetCore.Razor.TagHelpers;
using System;

namespace YourNamespace.TagHelpers
{
    // Triggered on all select elements with the asp-disabled attribute
    [HtmlTargetElement("select", Attributes = DisabledAttributeName)]
    public class SelectTagHelper : TagHelper
    {
        private const string DisabledAttributeName = "asp-disabled";

        /// Get the value of the condition
        [HtmlAttributeName(DisabledAttributeName)]
        public bool Disabled { get; set; }

        public override void Process(TagHelperContext context, TagHelperOutput output)
        {
            if (context == null)
                throw new ArgumentNullException(nameof(context));

            if (output == null)
                throw new ArgumentNullException(nameof(output));

            if (Disabled)
                output.Attributes.SetAttribute("disabled", null);
        }
    }
}

为确保使用您的 TagHelper，您还需要在以下位置注册它_ViewImports.cshtml：

using Microsoft.AspNetCore.Razor.TagHelpers;
using System;

namespace YourNamespace.TagHelpers
{
    // Triggered on all select elements with the asp-disabled attribute
    [HtmlTargetElement("select", Attributes = DisabledAttributeName)]
    public class SelectTagHelper : TagHelper
    {
        private const string DisabledAttributeName = "asp-disabled";

        /// Get the value of the condition
        [HtmlAttributeName(DisabledAttributeName)]
        public bool Disabled { get; set; }

        public override void Process(TagHelperContext context, TagHelperOutput output)
        {
            if (context == null)
                throw new ArgumentNullException(nameof(context));

            if (output == null)
                throw new ArgumentNullException(nameof(output));

            if (Disabled)
                output.Attributes.SetAttribute("disabled", null);
        }
    }
}