web-dev-qa-db-ja.com

オブジェクトをHTML属性に渡す

オブジェクトをHTML属性に渡す方法は?たとえば、次のコードがあります。

var attrs = new { id = "myid", style = "color: Red;" };

Attrsをこのような文字列に変換してHTMLマークアップに埋め込む方法:

id="myid" style="color: Red;"

前もって感謝します :)

43

驚くべきことに、この機能は RouteValueDictionary クラスによって提供されます:

IDictionary<string, object> htmlAttributes = new RouteValueDictionary(attrs);

この辞書を TagBuilder と組み合わせて使用​​できます。これはおそらくとにかく使用するでしょう:

var tagBuilder = new TagBuilder("input");
tagBuilder.MergeAttributes(htmlAttributes);
tagBuilder.ToString(TagRenderMode.Normal);

これはASP.NET MVCソースコード自体で確認できます。より単純な例の1つは TextAreaExtensions.cs にあります。

編集:

「data_attr」を「data-attr」に適切に変換するには、AnonymousObjectToHtmlAttributes静的メソッドを使用します。

IDictionary<string, object> htmlAttributes = HtmlHelper.AnonymousObjectToHtmlAttributes(attrs);
72
Domenic

文字列に変換する必要はありません。 HTMLヘルパーの最後のパラメーターはオブジェクトです。上記のようにオブジェクトを与えるだけです:

例として

@Html.TextBoxFor(x => x.Foo, new { size = 10, maxlength = 10 }) 
@Html.TextAreaFor(x => x.Notes, new { @class = "additionalInfo" })
@Html.TextBoxFor(x=>x.Registration.Address.Postcode, new {type="number", @class="postcode numeric", size=5, maxlength=5})

サイドノートでは、HTMLに直接インラインでスタイルを設定するべきではなく、別のスタイルシートではなくCSSクラス/セレクターを使用する必要があります。また、MVC HTMLヘルパーを使用すると、各DOM要素のIDが自動的に設定されます

23
Daveo

この変換を行う方法は次のとおりです。

var htmlAttributes = new { id="myid", @class="myclass" };

string string_htmlAttributes = "";
foreach (PropertyDescriptor property in TypeDescriptor.GetProperties(htmlAttributes))
{
  string_htmlAttributes += string.Format("{0}=\"{1}\" ", property.Name.Replace('_', '-'), property.GetValue(htmlAttributes));
}

PropertyDescriptorはクラスSystem.ComponentModelに属します

6
Chtiwi Malek