ASP.NET MVC - input要素のplaceholder属性に使うHtmlHelperの拡張メソッドを作ってみた
気持ち今さら感はありますが、input要素のplaceholder属性にテキストを出力するためのHtmlHelperの拡張メソッドを作ってみました。正直なところやってみて作りました!というほどではなかったんですが、まあ試してみたかったんです、ということで。
モデルのプロパティに対する表示名は、DisplayAttributeのNameプロパティとDisplayNameForメソッドを使えばいい感じに出力できます。そんなノリでできないかなと思って調べてみたところ、DisplayAttributeのPromtプロパティがそれっぽいかな?使っていいかな?と。MVCのソースも調べてみるとこのプロパティの値はModelMetadataのWatermarkプロパティから取得できそうかなと。
- DisplayAttribute.Prompt プロパティ (System.ComponentModel.DataAnnotations)
- ModelMetadata.Watermark プロパティ (System.Web.Mvc)
ということで作ってみた拡張メソッドがこちらです。
public static class PlaceholderExtesions { // placeholder属性用の文字列を取得 public static MvcHtmlString PlaceholderFor<TModel, TValue>( this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TValue>> expression) { // モデルのメタデータを取得 var metadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData); // メタデータのウォーターマークを使う // html属性として使うと想定してエンコード return new MvcHtmlString(HttpUtility.HtmlAttributeEncode(metadata.Watermark)); } }
それでは使ってみます。まずはモデルを用意します。
// モデル public class TestFormModel { // Promptにplaceholder属性に出力したい文字列を指定 [Display(Name = "メールアドレス", Prompt = "メールアドレスを入力してください")] public string Mail { get; set; } }
作ったHtmlHelperの拡張メソッドはこんな感じで使います。長いので適当に改行しています。
<input type="text" name="@Html.NameFor(model => model.Mail)" value="@Html.ValueFor(model => model.Mail)" placeholder="@Html.PlaceholderFor(model => model.Mail)" />
するとこんなhtmlが出力されると。
<input type="text" name="Mail" value="" placeholder="メールアドレスを入力してください" />
いい感じ。