0

ASP.Net MVC3 Razor を使用しています。.cshtml に 2 つのドロップダウンがあります。ddl1 と ddl2 としましょう。コントローラーでデータをバインドし、ビューバッグを使用してドロップダウンに送信しました。両方の ddl には、A、B、C、D のような同じデータが含まれています。ddl1 で A を選択すると、ddl2 で A が非表示になります。B を選択すると、ddl2 で B を非表示にする必要があります。javascriptまたはjqueryを使用して誰か助けてくれませんか。

これは私がバインドしたコントローラーです..

 public ActionResult Index()
        {
            ViewBag.ddl1 = new SelectList(db.Collection, "ID", "Name");
            ViewBag.ddl2 = new SelectList(db.Collection, "ID", "Name");
            return View();
        }

ビューは(上記のアクションの.cshtml)です

<table class="table">
    <tr>
        <td>      
       @Html.DropDownList("ddl1", "-select name-")
        </td>
        <td>
        @Html.DropDownList("ddl2","-select name-")
          </td>
    </tr>
    </table>

事前にサンクス

4

1 に答える 1

1

これが主なアイデアです。2 つのドロップダウン リストがあるとします。

<select id="ddl1">
    <option>Select</option>
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
    <option value="D">D</option>
</select><br/><br/>
<select id="ddl2">
    <option>Select</option>
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
<option value="D">D</option>
</select>​

ddl1 で選択した値を ddl2 から削除するには:

$('#ddl1').change(function() {
    $('#ddl2 option').each(function() {
        if ($(this).attr('value') == $('#ddl1 option:selected').attr('value')) {
            $(this).remove();
        }
    });
});

また、ddl1 から選択した ddl2 の値を削除するには、次のようにします。

$('#ddl2').change(function() {
    $('#ddl1 option').each(function() {
        if ($(this).attr('value') == $('#ddl2 option:selected').attr('value')) {
            $(this).remove();
        }
    });
});

変更のたびにドロップダウン値をリロードしたい場合は、ドロップダウン入力関数を再度呼び出すだけです。これが役立つことを願っています...

また、ここにデモがあります:http://jsfiddle.net/cJ8wN/8/

于 2012-10-12T14:20:19.150 に答える