html - ボタンをよりエレガントに無効にする方法

Question

私の見解の1つに、次のかみそりコードがあります。

@if (item.PMApproved != true) {
                    <input type="button" class="btnresetinvoice button" value="Reset" data-invoiceid="@item.InvoiceId" />
                }
                else {
                    <input type="button" class="btnresetinvoice button" value="Reset" data-invoiceid="@item.InvoiceId" disabled="disabled" />
                }

かなりラフ。基本的には、コードから解決できるので、特定の条件下でボタンを無効にします。これを行うためのより望ましい方法は何でしょうか？

score 20 · Accepted Answer

新しい拡張メソッドによって支援されるマークアップ中心のソリューション：

public static class HtmlExtensions
{
   public static HtmlString DisabledIf(this HtmlHelper html, bool condition)
   {
      return new HtmlString(condition ? "disabled=\"disabled\"" : "");
   }
}

あなたの見解では、wazooを再利用してください：

<button type="reset" @Html.DisabledIf(someCondition)>Clear Fields</button>

うまく再利用可能であり、レンダリングされたマークアップは空白に関して非常にクリーンです。

<button type="reset" disabled="disabled">Clear Fields</button>

score 19 · Accepted Answer

使用している言語はわかりませんが、ifステートメントを2行の実際の違いに近づけることができる場合があります。

<input type="button" class="btnresetinvoice button" value="Reset"
       data-invoiceid="@item.InvoiceId"
       @{ if(item.PMApproved != true) { 
             @:disabled="disabled" 
        } }
/>

score 16 · Accepted Answer

16

これを試して

<button type="submit" disabled="@(!item.PMApproved)"></button>

于 2013-04-25T21:57:14.527 に答える

score 3 · Accepted Answer

ヘルパーは助けることができます：

public static class HtmlExtensions
{
    public static IHtmlString ApproveButton(this HtmlHelper htmlHelper, MyViewModel item)
    {
        var button = new TagBuilder("input");
        button.Attributes["type"] = "button";
        button.Attributes["value"] = "Reset";
        button.AddCssClass("btnresetinvoice");
        button.AddCssClass("button");
        button.Attributes["data-invoiceid"] = item.InvoiceId.ToString();
        if (item.PMApproved)
        {
            button.Attributes["disabled"] = "disabled";
        }
        return new HtmlString(button.ToString(TagRenderMode.SelfClosing));
    }
}

その後：

@Html.ApproveButton(item)

score 3 · Accepted Answer

<input type="button" value="Reset" @{@((!item.PMApproved) ? null : new { disabled = "disabled" })}; />

その肥大化したコードは必要ありません、ただそれを単純にしてください:-)

score 3 · Accepted Answer

3

<button @(isEnabled ? null : "disabled")>Butt</button>

于 2016-04-25T08:40:49.243 に答える

score 2 · Accepted Answer

asp.net mvc5かみそりの使用：

@if(condition)
{
   <button data-toggle="collapse" data-target="#content">Details</button>
}
else
{
   <button disabled>Details</button>
}

DevToolsにはかみそりが表示されないため、DevToolsからボタンを有効にしようとするのを防ぎます。

score 1 · Accepted Answer

1

可能な簡単な方法：

<input type="button" @(item.PMApproved ? "disabled" : "") />

于 2019-07-25T14:16:11.800 に答える

html - ボタンをよりエレガントに無効にする方法

8 に答える 8

Related

Reference