0

I have a template

<script id="template" type="text/x-jquery-tmpl">
<div class="experience">
    <label for="c${count}">New Thing:</label>
    <input type="text" id="c${count}" name="Fund[${count}].Name" />
    <label for="c${count}">New Thing count:</label>
    <input type="text" id="c${count}" name="Fund[${count}].FundNo" />
</div>

to which I add controls dynamically to a div container.

I have a model in my mvc application

[Serializable]
public class Step2ViewModel : IStepViewModel
{
    [Required]
    public List<FormTest.Models.Item> Things;
}

[Serializable]
public class Item
{
    public string Name { get; set; }
    public string Number { get; set; }
}

How do I bind these newly created controls to a model. Does that entail using @Html.LabelFor, @Html.TextBoxFor etc in my template?

thanks!

Edit:

Just in case the question is open to interpretation - I want to bind dynamically created controls ( which was done using templ() ) to the List in my model when the form is posted.

4

2 に答える 2

0

まず第一に、これ以上更新されず、完成していないプロジェクトを使用しています。

Boris Moore は、jQuery テンプレート プロジェクトを継続する方法を作成しました。これはJsRenderと呼ばれます。JsRender を使用すると、jQuery テンプレートのパワーが得られます。さらに、パスへのアクセス、ヘルパー関数の使用、jQuery への依存が一切ない、リストがどんどん増えていく...

PluralSightには JsRender だけの 3 時間のコースがあり(その重要性を理解できます)、トライアル アカウントで見始めることができます。


今あなたの実際の問題について

フォームの送信時に .NET フレームワークにモデルを入力させたい場合は常に、配列を持っていたので各プロパティを記述する必要があるため、モデルのフル パス全体を渡す必要があります。 .

于 2012-05-24T12:27:09.710 に答える
0
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var count = 0;
            $('#btnAddDiv').live('click', function () {
                var data = [{ 'count': count++}];
                $('#template').tmpl(data).appendTo('body');
            });
        });
    </script>
    <script id="template" type="text/x-jquery-tmpl">
<div class="experience">
    <label for="c${count}">New Thing:</label>
    <input type="text" id="c${count}" name="Fund[${count}].Name" />
    <label for="c${count}">New Thing count:</label>
    <input type="text" id="c${count}" name="Fund[${count}].FundNo" />
</div>
    </script>

  <input type="button" id="btnAddDiv" value="Add Div" />  

//ボタンクリック時にdivを追加

//Or




 <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                var data = [{ 'count': 1 }, { 'count': 2 }, { 'count': 3}];
                $('#template').tmpl(data).appendTo('body');
            });
        </script>
        <script id="template" type="text/x-jquery-tmpl">
    <div class="experience">
        <label for="c${count}">New Thing:</label>
        <input type="text" id="c${count}" name="Fund[${count}].Name" />
        <label for="c${count}">New Thing count:</label>
        <input type="text" id="c${count}" name="Fund[${count}].FundNo" />
    </div>
        </script>
于 2012-05-24T06:18:41.117 に答える