根据单选按钮列表选择的值隐藏/显示Div标签 [英] Hide/Show Div Tag based on RadioButtonList selected value

问题描述

我有一个情况下，我必须表明基于复选框选择/隐藏div标签。下面是code例如

I have a situation where i have to show/Hide DIV TAG based on Checkbox selection. Below is the code example

<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>

我尝试了几种方法，但由于我是新没有工作到jQuery的，我会AP preciate，如果有人给我上面的code工作的例子。

I tried several ways but it didn't work as i am new to jQuery, I would appreciate if someone would give me a working example for the above code .

应该由在页面加载和显示DIV默认隐藏分区，当用户选择在RadioButtonList是选项

It should by default hide div on page load and show DIV when user select the YES option in the RadioButtonList

推荐答案

由于我使用的HTML代码显示在我的问题要解决。所以我找到了一个解决方案，它是

Since i wanted solution using the exact HTML show in my question. SO i found a solution which is as

<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>

HTML code节

HTML CODE BELOW

<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服务器控件想解决AP preciate其他用户。

I also appreciate other user who also replied to my question, since i wanted solution using for ASP.NET server control.

这篇关于根据单选按钮列表选择的值隐藏/显示Div标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！