2012-09-18 2 views
0

라디오 단추 목록 값이 'N'이면 Label 컨트롤을 표시/숨기려고합니다. 코드는 제대로 작동하지만 라디오 버튼을 선택 취소하면 Label 컨트롤이 숨겨지지 않습니다. 또한 Jquery mousedown 이벤트를 사용하여 선택을 지우고 있습니다. 제발 제안 해주세요.Radiobuton 목록 표시 숨기기 레이블 컨트롤

var radioList = "#<%= radioLst1.ClientID %>"; 
    var lblID = document.getElementById('<%=LblIDNumber.ClientID%>'); 

    $(radioList + " input:radio").click(function (e) { 
     if ($('#<%= radioLst1.ClientID %> input:checked').val() == "N") { 
      lblID.style.display = $(this).attr("checked") ? 'inline' : 'none'; 
     } 
     else { 
      lblID.style.display = 'none'; 
     } 
    }); 

나는 라디오 버튼 목록의 선택을 취소하려면 다음 코드를 사용하고 있습니다.

$(radioList + " input:radio").mousedown(function (e) { 
     if ($(this).attr("checked") == true) { 
      setTimeout("$('input[id=" + $(this).attr('id') + "]').removeAttr('checked');", 200); 
      lblID.style.display = 'none'; 
     } 
     else { 
      return true 
     } 
    }); 

       <asp:Label ID="LblIDNumber" style="display:none" runat="server">Number</asp:Label> 

       <asp:RadioButtonList ID="radioLst1" runat="server"> 
        <asp:ListItem Value="U">Unknown</asp:ListItem> 
        <asp:ListItem Value="N">Not Applicable</asp:ListItem> 
       </asp:RadioButtonList> 

답변

0
당신은 당신이

var lblID = $('#mylabel'); 


$('input:radio').on('click', function(){ 

    if($(this).val() == 'N') 
    { 
    lblID.hide(); 
    }else{ 
    lblID.show(); 
    }  

}); 

같은 과정을 단순화 할 수 있습니다 asp.net

하여 radioLst1.ClientID이 테이블로 변환 얻을 것이다에 이벤트를 부착하지 않아야하고

을 제어

<label id="mylabel">This is a label</label> 

<input id="radioLst1_0" type="radio" value="U" name="radioLst1"> 
    <label for="radioLst1_0">Unknown</label> 

<input id="radioLst1_1" type="radio" value="N" name="radioLst1"> 
    <label for="radioLst1_1">Not Applicable</label> 

여기가 작동 함 fiddle

0

이 모든 것을 UpdatePanel로 래핑 할 수 있습니다. 그런 다음 각 버튼 클릭에 대한 이벤트 뒤의 코드를 실행 한 다음 (동일한 이벤트에 모두 구독 할 수 있음) 버튼의 .Checked 속성에 레이블을 바인딩합니다. UpdatePanel은 모든 것을 비동기로 만듭니다.

나는 이것을 javascript/jquery의 대안으로 제안합니다. 조금 더 깔끔하고 관리하기 쉬울 것입니다. 처음에는 조금 더 많은 마크 업을하지만 그 다음엔 쉽게 변경할 수 있습니다.

관련 문제