RadioButtonListに基づいてDivタグを非表示/表示選択した値

チェックボックスの選択に基づいてDIV TAGを表示/非表示にしなければならない状況があります。以下は、私はいくつかの方法を試してみましたが、それは私はjQueryのに新しいですと、誰かが私に上記のコードのための作業例を与えるならば、私は感謝動作しませんでしたRadioButtonListに基づいてDivタグを非表示/表示選択した値

<asp:RadioButtonList ID="ckbRestaurent" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" > 
    <asp:ListItem selected="true" Value="0">No</asp:ListItem> 
    <asp:ListItem Value="1">Yes</asp:ListItem> 
</asp:RadioButtonList> 

<div id="xyz"> something.. </div>

のコード例です。

これは、ページのロードおよびshow DIVのデフォルトの非表示のdivによって、ユーザは、あなたのRadioButtonListのにクライアント側のJavaScript呼び出しをフックする必要がRadioButtonListの

出典

2011-11-03 Student

私の質問では、正確なHTMLショーを使用したソリューションが必要でした。だから私は、HTMLコードは、下記の

<div id="RadioDiv"> 
<asp:RadioButtonList ID="ckbRestaurent" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" > 
    <asp:ListItem selected="true" Value="0">No</asp:ListItem> 
    <asp:ListItem Value="1">Yes</asp:ListItem> 
</asp:RadioButtonList> 
</div> 
<table class="style1"> 
     <tr> 
     <td ></td><td></td> 
     </tr> 
     <tr><td ></td><td></td> 
     </tr> 
</table> 
    </br> 
<div id="Restaurent" style="display:none" > 
<!-- Details Group Restaurent Table --> 
<table cellpadding="0" cellspacing="0" class="tableDetailsGroupOne"> 
    <tr> 
     <td class="tableDetailsGroupOneLabel">Restaurant One:</td> 
     <td> 
     <asp:TextBox ID="txtRestaurentOne" runat="server" CssClass="txtNameOfHotel">Restaurent One</asp:TextBox> 
     </td> 
</tr> 
<tr> 
     <td class="tableDetailsGroupOneLabel">Restaurent Two:</td> 
     <td> 
<asp:TextBox ID="txtRestaurentTwo" runat="server" CssClass="txtNameOfHotel" ></asp:TextBox> 
     </td> 
</tr> 
</table> 
</div> 
<!-- Details Group Restaurent Table END-->

私も、私はASP.NETサーバーコントロールのために使用してソリューションを望んでいたことからも、私の質問に答え、他のユーザーに感謝

<script language="javascript" type="text/javascript"> 
    $(document).ready(function() { 
    $('#RadioDiv input').click(function() { 
    $("#info").text('Selected Value: ' + $("#RadioDiv input:radio:checked").val()); 
     if ($("#RadioDiv input:radio:checked").val() == 0) { 
       document.getElementById('Restaurent').style.display = "none"; 
       } 
       else { 
       document.getElementById('Restaurent').style.display = ""; 
        } 
     }); 
    }); 
</script>

ようである解決策を見つけました。

出典

2011-11-07 06:56:17 Student

でYESオプションを選択する必要があるとき。 javascript関数であなたが$（ "＃xyzの"）のような何かを行うことができます。（非表示）または$（ "＃xyzの"）。ショー（）

出典

2011-11-03 08:09:46 xgencoder

$(document).ready(function(){ 
     $("#xyz").hide(); 
     $("input[type=checkbox]").click(function(){ 
      if ($(this).attr('checked')){ 
       $("#xyz").show(); 
      } 
      else { 
       $("#xyz").hide(); 
      } 
     }); 

    });

とPLEあなたを追加し、このコードを試してみてください上記のスクリプトを変更できるようにhtmlコード

出典

2011-11-03 08:24:56 run

あなたが私に与えたスクリプトは、page_loadにDIV "XYZ"を隠すだけです。私はjQueryを初めて使用しています。チェックボックスの値が0または1の場合、コード内のどこを調べることができません。したがって、値が1の場合はDIVを表示し、そうでない場合はDIVを非表示にします。返信ありがとう。 – Student

私はあなたに役立つように私にあなたのHTMLコードを手に入れることができます – run

あなたの返信にコードを追加しました。 – Student

私はあなたが言及したようにHTMLバージョンを追加しています。私に知らせてください。

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>Insert title here</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#xyz").hide(); 
     $("input[type=checkbox]").click(function(){    
      if ($(this).val()=='0' && $(this).attr('checked')){ 
       $("#xyz").show(); 
      } 
      else { 
       $("#xyz").hide(); 
      } 
     }); 

    }); 
</script> 
</head> 
<body> 
<input type="checkbox" value="0">yes 
<input type="checkbox" value="1">no 
<div id="xyz"> something.. </div> 
</body> 
</html>

出典

2011-11-03 09:37:46 run

と申し訳ありませんが、私は.det人ではありません。私はjqueryとhtmlであなたを助けることができます。 – run

これは、私が厳密に – Student

問題はありません。助けて。ありがとう – Student

RadioButtonListに基づいてDivタグを非表示/表示選択した値

答えて

関連する問題