Blogs  >> Education & Books   >> 
   
          
        
Accessing Collapsible Panels with CheckBox controls
Just open MS Visual Studio 2008 
open a new asp.net vb project name it Offer Form
create a new webform named WebForm1.aspx
copy n paste the below code in WebForm1.aspx
Debug now n get the o/p

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm1.aspx.vb" Inherits="Offer_Form.WebForm1" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
<tr>
<td style ="width:30%"></td>
<td>
<asp:CheckBox ID = "CheckBox1" runat ="server" TabIndex ="12" AutoPostBack = "false" Text ="Check/Balance Transfer" />
 <asp:CheckBox ID = "CheckBox2" runat ="server" TabIndex ="12" AutoPostBack = "false" Text ="RateSale" />
</td>
</tr>
<asp:CollapsiblePanelExtender
ID="CollapsiblePanelExtender1"
runat="server"
TargetControlID ="Panel3"
CollapsedSize ="0"
Collapsed ="true"
CollapseControlID ="CheckBox1"
ExpandControlID ="CheckBox1">
</asp:CollapsiblePanelExtender>
<asp:CollapsiblePanelExtender
ID="CollapsiblePanelExtender2"
runat="server"
TargetControlID ="Panel4"
CollapsedSize ="0"
Collapsed ="true"
CollapseControlID ="CheckBox2"
ExpandControlID ="CheckBox2">
</asp:CollapsiblePanelExtender>
<tr>
<td colspan ="2">
    <asp:Panel ID="Panel3" runat="server" Height="0px" style="overflow:hidden;">
        <asp:Accordion ID="Accordion1" runat="server"
        SelectedIndex="0"
        AutoSize="None"
        FadeTransitions="true"
        FramesPerSecond="40"
        RequireOpenedPane="false"
        SuppressHeaderPostbacks="true"
        >
        <Panes>
            <asp:AccordionPane runat="server" ID="AccordionPane1" Height="0px">
<Header>Define Check/Balence Transfer          
                
     
<asp:ImageButton runat="server" ID="ImageButton1" ImageUrl="~/images/plus.png" Width="12px" Height="12px"/></Header>
<Content>
<asp:Panel ID ="Panel1"  runat ="server" width ="600px" >
<table cellspacing="2" cellpadding="2" width="100%" border="5">
</td>
</tr>
<tr>
<td colspan="1"><span>
<asp:Label id="Label7" runat="server">Define Check/Balance Transfer</asp:Label></span></td>                                 </tr>
</td>
</tr>
<tr>
    <td style="width:30%">
    <div style ="text-align:left">Pricing Type</div>
    </td>
    <td>
<asp:DropDownList id="DropDownList1"  runat="server" Width="280px" tabIndex="19">
    <asp:ListItem Value="1">Champion1</asp:ListItem>
    <asp:ListItem Value="2">Champion2</asp:ListItem>
</asp:DropDownList>
    </td>
</tr>
</table>
</asp:Panel>
 </Content>
 </asp:AccordionPane>
 </Panes>
 </asp:Accordion>
 </asp:Panel>
    <asp:Panel ID="Panel4" runat="server" Height="0px" style="overflow:hidden;">
        <asp:Accordion ID="Accordion2" runat="server"
        SelectedIndex="0"
        AutoSize="None"
        FadeTransitions="true"
        FramesPerSecond="40"
        RequireOpenedPane="false"
        SuppressHeaderPostbacks="true"
        >
        <Panes>
            <asp:AccordionPane ID="AccordionPane2" runat="server" Height="0px">
            <Header>Base Sale Promo Offer Description</Header>
            <Content>
            <asp:Panel ID ="Panel2"  runat ="server" width ="600px" >
<table cellspacing="2" cellpadding="2" width="100%" border="5">
</td>
</tr>
<tr>
<td colspan="1"><span>
<asp:Label id="Label8" runat="server">Define RateSale</asp:Label></span></td>                                   </tr>
</td>
</tr>
<tr>
    <td style="width:100%">
    <div style ="text-align:left">Base Sale Promo Offer Description </div>
     <asp:TextBox ID="TextBox1" Width="100%" Text="enter text here" runat="server"></asp:TextBox>
    </td>
</tr>
</table>
</asp:Panel>
            </Content>
            </asp:AccordionPane>
        </Panes>
        </asp:Accordion>
    </asp:Panel>
    </div>
    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
    </asp:ToolkitScriptManager>
    </form>
</body>
</html>
Regards
N Pavan Kumar Rao
|  | 
 
  





 
 

 
      