0

ドロップダウン リストで選択した内容に応じて、実行する必要がある 2 つの関数があります。

例えば

Dropdownlist1値が "First" の場合は無効にDropdownlist2して実行します。値が "Second"のFunction1
場合は、値 として "Third" を選択した場合は有効にして実行します。Document ready イベントで通常の if ステートメントを試しましたが、上記の目的を達成できませんでした。Dropdownlist1Dropdownlist2Function2
Dropdownlist2

これが私がこれまでに持っているものです：

形：

                 <th>
                    Dropdown List 1
                </th>
                <td>
                    <%= Html.Telerik().DropDownList().Name("DropDownList1")
                    .HtmlAttributes(new { @id = "DropDownList1" })
                    .Items(items => {
                        items.Add().Text("").Value("");
                        items.Add().Text("New").Value("First");
                        items.Add().Text("Existing").Value("Second");
                            })%> 
                </td>

                 <th>
                    Dropdown List 2
                </th>
                <td>
                    <%= Html.Telerik().DropDownList().Name("DropDownList2")
                    .HtmlAttributes(new { @id = "DropDownList2" })
                    .Items(items => {
                        items.Add().Text("").Value("");
                        items.Add().Text("Three").Value("Three");
                            })%> 
                </td>

JQuery:

$(function () {
$("#Dropdownlist1").focusout(func1);
});

function func1() {

$("#Dropdownlist1").focusout(function(){
    if($("#Dropdownlist1").val() == "First"){
        $("#Dropdownlist2").attr('disabled','disabled')
        Function1()
    }
    else if ($("#Dropdownlist1").val() == "Second"){
        $("#Dropdownlist2").attr('disabled','')
        $("#Dropdownlist2").focusout(function(){Function2()})
    }
});   

}
4

2 に答える 2

1

HTML:

<select id="options">
    <option value=1>option 1</option>
    <option value=2>option 2</option>
    <option value=3>option 3</option>
</select>

JS:

function func1() { alert('hello from func 1'); };
function func2() { alert('hello from func 2'); };
function func3() { alert('hello from func 3'); };

$('#options').change(function() {

    if ($(this).val() == 1) {
         func1();
    } else if ($(this).val() == 2) {
         func2();    
    } else if ($(this).val() == 3) {
         func3();
    }
});​
于 2012-09-12T18:46:56.400 に答える
0

私が上記の投稿を正しく読んだ場合、これはあなたが求めていることを行うはずです...または少なくともあなたを正しい方向に向けてください。

$("#Dropdownlist1").change(function(){
  //if Dropdownlist1 value is "First" then Disable Dropdownlist2 and Execute Function1
  if($(this).val() == "First"){
    $("#Dropdownlist2").attr("disabled", "disabled");
    function1();
  }
  //if Dropdownlist1 value is "Second" then Enable Dropdownlist2 and Execute Function2
  else if($(this).val() == "Second"){
    $("#Dropdownlist2").removeAttr("disabled");
    function2();
  }
});

$("#Dropdownlist2").change(function(){
  //and Execute Function2 if "Third" is selected as Dropdownlist2 value
  if($(this).val() == "Third")
    function2();
});
于 2012-09-12T20:39:37.817 に答える