I am doing a program for a collapsable grid view, for this initially my gridview binded as follows in the image
Now when I click on + sign I would like to show another gridview corresponding to the selcted ID
This is my complete design
<asp:Panel CssClass="grid" ID="pnlCust" runat="server">
<asp:UpdatePanel ID="pnlUpdate" runat="server">
<ContentTemplate>
<asp:GridView AllowPaging="True" ID="gvCustomers" AutoGenerateColumns="False"
runat="server" ShowHeader="False" OnRowCreated="gvCustomers_RowCreated"
BackColor="White" BorderColor="#DEDFDE" BorderStyle="None" BorderWidth="1px"
CellPadding="4" ForeColor="Black" GridLines="Vertical">
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:Panel CssClass="group" ID="pnlCustomer" runat="server">
<asp:Image ID="imgCollapsible" CssClass="first" ImageUrl="~/Assets/img/plus.png"
Style="margin-right: 5px;" runat="server" /><span class="header">
<%#Eval("EmpID")%>
:
<%#Eval("empname")%>
</asp:Panel>
<asp:Panel Style="margin-left: 20px; margin-right: 20px" ID="pnlOrders" runat="server">
<asp:GridView AutoGenerateColumns="false" CssClass="grid" ID="gvOrders" runat="server"
ShowHeader="true" EnableViewState="false">
<RowStyle CssClass="row" />
<AlternatingRowStyle CssClass="altrow" />
<Columns>
<asp:TemplateField ItemStyle-CssClass="rownum">
<ItemTemplate>
<%# Container.DataItemIndex + 1 %>
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="PayPeriodNumber" HeaderText="PayPeriod" HeaderStyle-BackColor="#EFF1F1"
ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="80" ItemStyle-Width="80">
</asp:BoundField>
<asp:BoundField DataField="PayRollYear" HeaderText="Payroll Year" HeaderStyle-BackColor="#EFF1F1"
ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="100" ItemStyle-Width="100">
</asp:BoundField>
<asp:BoundField DataField="PaymentDate" HeaderText="Payment Date" HeaderStyle-BackColor="#EFF1F1"
ItemStyle-HorizontalAlign="Center" HeaderStyle-Width="110" ItemStyle-Width="110">
</asp:BoundField>
</Columns>
</asp:GridView>
</asp:Panel>
<asp:CollapsiblePanelExtender ID="cpe" runat="Server" TargetControlID="pnlOrders"
CollapsedSize="0" Collapsed="True" ExpandControlID="pnlCustomer" CollapseControlID="pnlCustomer"
AutoCollapse="False" AutoExpand="False" ScrollContents="false" ImageControlID="imgCollapsible"
ExpandedImage="~/Assets/img/minus.png" CollapsedImage="~/Assets/img/plus.png"
ExpandDirection="Vertical" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#CCCC99" />
<HeaderStyle BackColor="#6B696B" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#F7F7DE" ForeColor="Black" HorizontalAlign="Right" />
<RowStyle BackColor="#F7F7DE" />
<SelectedRowStyle BackColor="#CE5D5A" Font-Bold="True" ForeColor="White" />
<SortedAscendingCellStyle BackColor="#FBFBF2" />
<SortedAscendingHeaderStyle BackColor="#848384" />
<SortedDescendingCellStyle BackColor="#EAEAD3" />
<SortedDescendingHeaderStyle BackColor="#575357" />
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
My code to bind gridview
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
//string strProc = "uspSearchPayRoll";
string strQuery = "select distinct concat(e.firstname,' ',e.middleinitial,' ',e.lastname) as empname, e.empid from tblemployee e, tblcpybank cp where cp.FedTaxID='" + strFedTaxID + "' and cp.PayFrequencyTypeID='" + strPayFreq + "' and cp.FedTaxID=e.FedTaxID and cp.Empid=e.empid and cp.PayFrequencyTypeID=e.PayFrequencyTypeID;";
DataTable dtParentData = GetData(strQuery);
gvCustomers.DataSource = dtParentData;
gvCustomers.DataBind();
}
}
private DataTable GetData(string strQuery)
{
DataTable dtDept = null;
string strCon = @"server=172.16.18.31;database=usp_payroll_testing;uid=root;pwd=server@123";
using (MySqlConnection con = new MySqlConnection(strCon))
{
con.Open();
using (MySqlDataAdapter sqlAdapter = new MySqlDataAdapter(strQuery, con))
{
dtDept = new DataTable();
sqlAdapter.Fill(dtDept);
}
}
return dtDept;
}
Can any one help how to bind other grid view on clicking + sign..