ASP.NET MVC モデルのプロパティ属性別スキャフォールディング結果

ASP.NET MVC のモデルのプロパティに属性を付与すると、スキャフォールディングによって作成されるページ上で、「表示される/されない」、「編集できる/できない」にどのような影響があるのか、調査しました。

検証に使用したモデル

public class ReadOnlyAnnotationsTest
{
    // エンティティの主キーとなるプロパティ。今回の検証には特に関係がありません
    public int Id { get; set; } 

    [HiddenInput]
    public int? HiddenInput { get; set; }

    [HiddenInput(DisplayValue = false)]
    public int? HiddenInputDisplayValueFalse { get; set; }

    [Editable(false)]
    public int? EditableFalse { get; set; }

    [ReadOnly(true)]
    public int? ReadOnlyTrue { get; set; }
}

実行結果

スキャフォールディング実行結果は、次の通りでした。

プロパティに付与する属性 スキャフォールディング結果
参照系ページ
(Index/Details/Delete)
編集系ページ
(Create/Edit)
[HiddenInput]
([HiddenInput(DisplayInput = true)] と同じ)
見出し、値とも表示される。 見出し、値とも表示される。
<input type=”hidden”>として出力される。
[HiddenInput(DisplayInput = false)] 見出しは表示されるが、値は表示されない 見出しは表示されるが、値は表示されない
<input type=”hidden”>として出力される。
[Editable(false)] 見出し、値とも表示される。 見出し、値とも表示されない。
[ReadOnly] 見出し、値とも表示される。 見出し、値とも表示されない。

Index、Details、Edit ページのスクリーンショットと HTML の内容(抜粋)は次の通りです。なお、Delete ページは Details ページ、Create ページは Edit ページとそれぞれ同様のため、省略しています。

Index ページ

[ASP.NET] Index ページ
Index ページ
<table class="table">
    <tr>
        <th>HiddenInput</th>
        <th>HiddenInputDisplayValueFalse</th>
        <th>EditableFalse</th>
        <th>ReadOnlyTrue</th>
        <th></th>
    </tr>
    <tr>
        <td>1</td>
        <td></td>
        <td>3</td>
        <td>4</td>
        <td>
            <a href="/ReadOnlyAnnotationsTests/Edit/1">Edit</a> |
            <a href="/ReadOnlyAnnotationsTests/Details/1">Details</a> |
            <a href="/ReadOnlyAnnotationsTests/Delete/1">Delete</a>
        </td>
    </tr>
</table>

Details ページ

[ASP.NET] Details ページ
Details ページ
<dl class="dl-horizontal">
    <dt>HiddenInput</dt>
    <dd>1</dd>
    <dt>HiddenInputDisplayValueFalse</dt>
    <dd></dd>
    <dt>EditableFalse</dt>
    <dd>3</dd>
    <dt>ReadOnlyTrue</dt>
    <dd>4</dd>
</dl>

Edit ページ

[Editable(false)] または [ReadOnly] を付与したプロパティは表示されていません。

[ASP.NET] Edit ページ
Edit ページ
<div class="form-group">
    <label class="control-label col-md-2" for="HiddenInput">HiddenInput</label>
    <div class="col-md-10">
        1
        <input class="form-control" data-val="true" data-val-number="The field HiddenInput must be a number." id="HiddenInput" name="HiddenInput" type="hidden" value="1" />
        <span class="field-validation-valid text-danger" data-valmsg-for="HiddenInput" data-valmsg-replace="true"></span>
    </div>
</div>

<div class="form-group">
    <label class="control-label col-md-2" for="HiddenInputDisplayValueFalse">HiddenInputDisplayValueFalse</label>
    <div class="col-md-10">
        <input class="form-control" data-val="true" data-val-number="The field HiddenInputDisplayValueFalse must be a number." id="HiddenInputDisplayValueFalse" name="HiddenInputDisplayValueFalse" type="hidden" value="2" />
        <span class="field-validation-valid text-danger" data-valmsg-for="HiddenInputDisplayValueFalse" data-valmsg-replace="true"></span>
    </div>
</div>

あとがき

「見出し、値とも表示はされないが、<input type="hidden"> として出力される」パターンを見つけたかったのですが、残念ながらありませんでした。この場合は、スキャフォールディングで作成されたページに対して、手で修正を加えてやる必要があるようです。

kpdn

お寿司とゲームと動物が好きな、フリーランスのエンジニアです。フロントエンドからインフラまで日々奮闘中です。最近は物忘れがどんどんがひどくなってきました。

コメントを残す