2011-06-29 6 views
17

Knockout-JSを使用して、ビューのプロパティをビューモデルにバインドしています。 Knockout-JSは、 'data-bind'というカスタム属性を使用します。これは、モデルオブジェクトを表示するためにバインドするコントロールに追加する必要があります。EditorFor/TextBoxFor/TextBoxヘルパーを使用してダッシュを含むカスタム属性

例:

<input type='text' name='first-name' data-bind='value: firstName'/> 

お知らせ 'データバインド' 属性。

私のビューレンダリングでは、この属性を持つテキストボックスのレンダリングに問題があります。私は、Html.EditorFor、Html.TextBoxFor、およびHtml.TextBoxヘルパーがすべて、カスタム属性を指定するために使用できる匿名オブジェクトを取ることを認識しています。この実装の唯一の問題は、C#では変数名としてダッシュを許可しないため、コンパイルできません。 @ Html.EditorFor(m => m.FirstName、new {data-bind = "value:firstName"}) ;

私は考えることができる唯一のことは、(ビューモデルに)これです:

public class DataBindingInput 
{ 
    public string Value { get; set; } 
    public string DataBindingAttributes { get; set } 
} 

public class MyViewModel 
{ 
    ... 
    public DataBindingValue firstName { get; set; } 
    .... 
} 

そして「DataBindingInput.cshtml」と呼ばれるビューテンプレート:これで

@model DataBindingInput 
<input type='text' data-binding='@Model.DataBindingAttributes' value='@Model.Value'> 

のみトラブル私は入力名の自動生成を失うので、モデルバインダーはバインドする方法がわからないため、ポストバックでは機能しません。

どうすればこの作品を作成できますか?

+7

http://stackoverflow.com/questions/2520487/how-to-use-html-5-data-attributes-in-asp-net-mvc/4515095#4515095 –

+0

を参照してくださいありがとう、私はそれを動作させる: )EditorForがEditorFor(m => m.firstName、new {data_binding = m.DataBindingAttributes})で動作しなかったようです。カスタムビューテンプレートを追加してTextBoxForを使用すると、動作するように見えました。 EditorForでそれを行う方法はありますか? –

+0

ここで同じ質問 - 私はそれをEditorForからTextBoxForに変更しましたが、うまくいきましたが、最初にCrescent Freshに言及した後、EditorForでこの作業を行う方法を追跡しようとしていました。 –

答えて

27

上記のCrescent Fishのおかげで、アンダースコアはHTML属性名では使用できないため、アンダースコアを使用できるようになり、MVC 3はそれらをダッシュ​​に変換します。

関連する問題