2

List<string>MVC3 のフォームに aをバインドする良い方法を探しています。現在、2 つのオプションがあります。

  • テキストボックスでListBoxを使用し、jqueryでボタンを追加/削除し、フォームを投稿する前にすべての項目を選択します
  • jqueryの追加/削除ボタンでも値を持つaを<li>含むaを使用します<input type="hidden" />

これを行う簡単な方法があると確信していますが、ここで何も見つからなかったので、助けを求めています. 私の懸念は、会社の他のプロパティ（名前、住所など）を編集しながら、さまざまな事業単位（文字列）を会社に追加することです。

ありがとう！

4

2 に答える 2

0

ListBox を使用することは、それを達成するための良い方法のようです。次に、テキストボックスとその横に新しい要素をリストボックスに追加する追加ボタンと、クライアント側の jquery を使用してリストボックスから選択した項目を削除する削除ボタンを配置できます。また、フォームが送信されると、ListBox ( <select>with multiple="multiple") を使用したため、タイプのビュー モデルのプロパティに自動的にバインドされList<string>、選択した値を取得できるようになります。

于 2012-05-31T14:13:21.423 に答える
0

これが最初のオプションの私のコードです。誰かがより良い解決策を見つけたら、私に知らせてください!

HTML/カミソリ:

<div class="row">
        <div class="span12">
            <div class="control-group">
                <label for="AddBusinessUnit" class="control-label">@Strings.BusinessUnit</label>
                <div class="controls">
                    <div class="input-append">
                        <input type="text" class="span2" size="16" id="AddBusinessUnit" />
                        <button class="btn" type="button" id="add-business-unit">@Strings.Add</button>
                    </div>
                </div>
            </div>

            <div class="control-group">
                <div class="controls">
                    @Html.ListBoxFor(model => model.BusinessUnits, SelectLists.BusinessUnits(Model.BusinessUnits, false), new { Multiple = "multiple" })<br/>
                    <a href="#" id="delete-business-unit">@Strings.DeleteSelectedElement</a>
                </div>
            </div>
        </div>
    </div>

    <div class="form-actions">
        <input type="submit" class="btn btn-primary" value="@Strings.Save" />
        <a href="@Url.Action(MVC.Company.Index())" class="btn">@Strings.Cancel</a>
    </div>

JS :

<script type="text/javascript">
$(document).ready(function () {

    $('#add-business-unit').click(function (e) {
        var bu = $('#AddBusinessUnit').val();
        if (bu != '') {
            $('#BusinessUnits').append($('<option></option>').val(bu).html(bu));
            $('#AddBusinessUnit').val('');
        }
        e.preventDefault();
    });

    $('#delete-business-unit').click(function (e) {
        $('#BusinessUnits :selected').remove();
        e.preventDefault();
    });

    $('input[type="submit"]').click(function () {
        $('#BusinessUnits option').attr('selected', 'selected');
    });

});

SelectList :

public static class SelectLists
    {
        public static IList<SelectListItem> BusinessUnits(IList<string> bussinessUnits, bool addEmpty, string selected = "")
        {
            var list = new List<SelectListItem>();
            if(addEmpty) list.Add(new SelectListItem());
            list.AddRange(bussinessUnits.Select(businessUnit => new SelectListItem {Selected = selected == businessUnit, Text = businessUnit, Value = businessUnit}));

            return list;
        }
    }

public virtual IList<string> BusinessUnits { get; set; }私のモデルの私のプロパティにバインドされます。

それが役立つことを願っています！

于 2012-05-31T19:47:08.963 に答える