asp.net 웹 사이트에서 선택한 onchange 이벤트를 사용하여 패널 가시성을 변경할 수 없습니다.

Question

옵션을 선택하기 위해 선택한 jQuery 플러그인을 사용하고 있습니다. 첫 번째 선택 기준에 따라 표시하거나 숨길 패널을 결정하고 싶습니다. 나는 두 개의 패널을 가지고, 하나는 또 다른 <asp:Panel runat="server" ID="panel2">

입니다
<asp:Panel runat="server" ID="panel1">
내 onchange를 이벤트는 다음과 같습니다 선택 : (이것은 .ASPX로 작성)

<script type="text/javascript"> 
('#myId').change(function() { 
        var abc = $(this).val(); 
        alert('The option with value ' + abc + ' was selected.'); 
        if (abc == "val1") { 
         alert('Msg1'); 
         document.getElementById("panel2").style.visibility = true; 
         document.getElementById("panel1").style.visibility = false; 
         alert('Msg2'); 
        } 
        else { 
         alert('Elseloop'); 
         document.getElementById("panel1").style.visibility =true; 
         document.getElementById("panel2").style.visibility = false; 
         alert('Elseloop2'); 
        } 
       }); 
</script> 

가 나는 또한 document.getElementById("panel1").style.display ="block";을 시도하지하지만이 +했습니다 결과, 두 루프의 첫 번째 경고문이 제대로 작동하지만 패널의 가시성이 변경되지 않습니다.

내 HTML은 다음과 같습니다 동안 :

   <select data-placeholder="some text" id="myId" style="width: 350px;" class="chosen-select" tabindex="-1"> 
        <option value=""></option> 
        <option value="val1">Text1</option> 
        <option value="val2">Text2</option> 
        <option value="val3">Text3</option> 
        <option value="val4">Text4</option> 
       </select> 

어떤 제안? 나는 실수하고있어. (함수() {및 이전})

Answer 1

당신은 달러 기호를 호출도 준비 문서 $를 추가

에 넣어해야합니다; 당신을 위해 그것을 할 것입니다.

코드에서 패널 아이디의를 얻고 싶은 경우에, 당신은

<script> 
    $(function(){ 
      $('#myId').change(function() { 
        var abc = $(this).val(); 
        alert('The option with value ' + abc + ' was selected.'); 
        if (abc == "val1") { 
         alert('Msg1'); 
         document.getElementById(<%= panel2.ClientID %>).style.visibility = true; 
         document.getElementById(<%= panel1.ClientID %>).style.visibility = false; 
         alert('Msg2'); 
        } 
        else { 
         alert('Elseloop'); 
         document.getElementById(<%= panel1.ClientID %>).style.visibility =true; 
         document.getElementById(<%= panel2.ClientID %>).style.visibility = false; 
         alert('Elseloop2'); 
        } 
       }); 
      }); 
</script> 

Answer 2

<asp:Panel runat="server" ID="panel1"> 

및

<asp:Panel runat="server" ID="panel2"> 

컨트롤되는 구문 분석 코드의 HTML에서 자신의 적절한 ID를 얻는 시도해야 runat="server"이므로 ID는 다음과 같이 렌더링 될 수 있습니다.

"ctl00_panel1" and "ctl00_panel2", change your id: 

,210

콘텐츠 제어 사용 된 ClientID 내부의 전체 제어 ID 이름을 얻으려면 :

$("#<%=Panel1.ClientID%>").change(function() {