Условно отрисовать отключенную кнопку в основном представлении asp.net

У меня есть кнопка в моем представлении, которую я хотел бы отключить в зависимости от определенных условий. Ниже мой взгляд:

@{
   var myCondition = false;
   myCondition = //set condtion here
}

<input type="submit" value="Create" class=" btn btn-primary" />

Поэтому на основе myCondition я хочу отключить / включить мою кнопку.

Я могу сделать как:

 @if(myCondition)
  {
     <input type="submit" value="Create" disabled="disabled" class=" btn btn-primary" />
  }
 else
 {
    //enable it here
 }

Есть ли какой-нибудь элегантный способ сделать это в.net core? Можем ли мы использовать некоторые htmlextensions здесь. Если кто-то может дать мне пример, пожалуйста.

Входы приветствуются.

2 ответа

Решение

Вы можете создать помощник HTML как:

public static class HtmlExtensions
{
        public static IHtmlContent DisabledIf(this IHtmlHelper htmlHelper, 
                                              bool condition)
        => new HtmlString(condition ? "disabled=\"disabled\"" : "");
}

Тогда по вашему мнению:

   @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 


<input type="submit" value="Create" class=" btn btn-primary" @Html.DisabledIf(yourcondition) />

Если вам не нравится условно отображать кнопку в представлении, вы можете создать помощник по тегам для этого.

[HtmlTargetElement("button")]
public class MyDisablableButton : TagHelper
{      
    [HtmlAttributeName("asp-is-disabled")]
    public bool IsDisabled { set; get; }

    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        if (IsDisabled)
        {
            var d = new TagHelperAttribute("disabled", "disabled");
            output.Attributes.Add(d);
        }
        base.Process(context, output);
    }
}

Теперь, чтобы использовать этот пользовательский тег-помощник, вам нужно вызвать addTagHelper метод в _ViewImports.cshtml,

@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@addTagHelper *, YourAssemblyNameHere

Теперь вы можете использовать его в представлениях, как

<button asp-is-disabled="true">Save</button>
<button asp-is-disabled="false">Save</button>
<button asp-is-disabled="@yourBooleanVariable">Save</button>
Другие вопросы по тегам