4

@Html.DropDownListFor2 つのヘルパーを含むビューがあります。

 <div class="editor-field">
        @Html.DropDownListFor(model => model.Employee, (IEnumerable<SelectListItem>)ViewBag.emps, "--Select--", new { style = "width:150px", id = "ddl1"})
        @Html.ValidationMessageFor(model => model.Employee)
    </div>
    <div class="editor-field">
        @Html.DropDownListFor(model => model.Employee2, (IEnumerable<SelectListItem>)ViewBag.emps, "--Select--", new { style = "width:150px", id = "ddl2"})
        @Html.ValidationMessageFor(model => model.Employee2)
    </div>

それらは次のように入力されます。

public ActionResult Create()
    {
        List<Employees> emps = new List<Employees>();
        emps.Add(new Employees { Id = 0, Name = "Michael Jordan" });
        emps.Add(new Employees { Id = 1, Name = "Magic Johnson" });
        emps.Add(new Employees { Id = 2, Name = "Larry Bird" });

        var items = emps.Select(i => new SelectListItem
        {
            Value= i.Id.ToString(),
            Text =i.Name
        });
        ViewBag.emps = items;
        return View();
    }

最初の DDL で選択した項目を 2 番目の DDL から削除するにはどうすればよいですか? 次のようにjQueryを使用して、選択したアイテムを取得できました。

<script type="text/javascript">
$(function () {
    $("#ddl1").change(function () {
        alert($("#ddl1").val());
    });
});
</script>

しかし、私はそれを私の目的に使用する方法を見つけることができませんでした。

4

2 に答える 2

3

このようなものはあなたのために働く必要があります:

$(function(){
    var lists = $('#ddl1, #ddl2');
    lists.change(function(){
        var elm = $(this);
        lists.find('option').show();
        var option = lists.not('#' + this.id)
            .find('option[value="' + elm.val() +'"]').hide();

        if(option.is(':selected'))
        {
            var select = option.closest('select');
            select.val(select.find('option:visible:first').val());
        }
    });
});

デモのリンク: jsfiddle.net

追加: 投稿された解決策には IE に関する問題があります。別の方法は無効な属性を使用することです: jsfiddle.net/cxZ2H/1/

于 2012-09-17T19:14:08.213 に答える
2

これは、サーバー側の ASP.NET MVC の問題ではなく、間違いなくクライアント側のスクリプトの問題です。

これが私のアドバイスです：

  1. アイテム リストのサーバー側を作成します。
  2. ただし、クライアントに持ち込むときは、不変のマスター コピーを保持してください。これを使用して、最初のselect.
  3. ユーザーが最初のリストからアイテムを選択すると、選択したアイテムを除いた最初のリストのクローンが作成されます。

ここに JSFiddle があります: http://jsfiddle.net/Fsf7g/1/

于 2012-09-17T18:53:31.943 に答える