Hi
try this example:
Default.aspx
<%@ Page Language=”C#” AutoEventWireup=”true” CodeFile=”Default.aspx.cs” Inherits=”_Default” %>
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml“>
<head runat=”server”>
<title>Untitled Page</title>
<link type=”text/css” rel=”Stylesheet” href=”Assets/css/dialog.css” />
<link type=”text/css” rel=”Stylesheet” href=”Assets/css/pager.css” />
<link type=”text/css” rel=”Stylesheet” href=”Assets/css/grid.css” />
</head>
<body>
<form id=”form1″ runat=”server”>
<ajaxToolkit:ToolkitScriptManager ID=”ScriptManager1″ runat=”server” />
<asp:SqlDataSource ID=”sqlDsCustomers” runat=”server” ConnectionString=”<%$ ConnectionStrings:Northwind %>”
SelectCommand=”SELECT [Customers].[CustomerID], [Customers].[CompanyName], COUNT([OrderID]) TotalOrders FROM [Customers] INNER JOIN [Orders] ON [Customers].[CustomerID]=[Orders].[CustomerID] Group By [Customers].[CustomerID], [Customers].[CompanyName]“>
</asp:SqlDataSource>
<div id=”dlg” class=”dialog” style=”width: 700px”>
<div class=”header” style=”cursor: default”>
<div class=”outer”>
<div class=”inner”>
<div class=”content”>
<h2>
Northwind: Orders By Customer</h2>
</div>
</div>
</div>
</div>
<div class=”body”>
<div class=”outer”>
<div class=”inner”>
<div class=”content”>
<asp: Panel CssClass=”grid” ID=”pnlCust” runat=”server”>
<asp:UpdatePanel ID=”pnlUpdate” runat=”server”>
<ContentTemplate>
<asp: GridView Width=”100%” AllowPaging=”True” ID=”gvCustomers” AutoGenerateColumns=”False”
DataSourceID=”sqlDsCustomers” runat=”server” ShowHeader=”False” OnRowCreated=”gvCustomers_RowCreated”>
<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(“CustomerID”)%>
:
<%#Eval(“CompanyName”)%>
(<%#Eval(“TotalOrders”)%>
Orders) </span>
</asp: Panel>
<asp:SqlDataSource ID=”sqlDsOrders” runat=”server” ConnectionString=”<%$ ConnectionStrings:Northwind %>”
SelectCommand=”SELECT [OrderID], [OrderDate], [RequiredDate], [Freight], [ShippedDate] FROM [Orders] WHERE ([CustomerID] = @CustomerID)”>
<SelectParameters>
<asp: Parameter Name=”CustomerID” Type=”String” DefaultValue=”" />
</SelectParameters>
</asp:SqlDataSource>
<asp: Panel Style=”margin-left: 20px; margin-right: 20px” ID=”pnlOrders” runat=”server”>
<asp:GridView AutoGenerateColumns=”False” CssClass=”grid” ID=”gvOrders” DataSourceID=”sqlDsOrders”
runat=”server” EnableViewState=”False”>
<RowStyle CssClass=”row” />
<AlternatingRowStyle CssClass=”altrow” />
<Columns>
<asp:TemplateField>
<ItemTemplate>
<%# Container.DataItemIndex + 1 %>
</ItemTemplate>
<ItemStyle CssClass=”rownum” />
</asp:TemplateField>
<asp:BoundField HeaderText=”Order ID” DataField=”OrderID” >
<ItemStyle Width=”80px” />
</asp:BoundField>
<asp:BoundField HeaderText=”Date Ordered” DataField=”OrderDate” DataFormatString=”{0:dd/MM/yyyy}” >
<ItemStyle Width=”100px” />
</asp:BoundField>
<asp:BoundField HeaderText=”Date Required” DataField=”RequiredDate” DataFormatString=”{0:dd/MM/yyyy}” >
<ItemStyle Width=”110px” />
</asp:BoundField>
<asp:BoundField HeaderText=”Freight” DataField=”Freight” DataFormatString=”{0:c}” >
<ItemStyle HorizontalAlign=”Right” Width=”50px” />
</asp:BoundField>
<asp:BoundField HeaderText=”Date Shipped” DataField=”ShippedDate” DataFormatString=”{0:dd/MM/yyyy}” >
<ItemStyle Width=”100px” />
</asp:BoundField>
</Columns>
</asp:GridView>
</asp: Panel>
<ajaxToolkit: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>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
</asp: Panel>
</div>
</div>
</div>
</div>
<div class=”footer”>
<div class=”outer”>
<div class=”inner”>
<div class=”content”>
</div>
</div>
</div>
</div>
</div>
</form>
</body>
</html>
Default.aspx.cs
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class _Default : System.Web.UI.Page
{
protected void gvCustomers_RowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
SqlDataSource ctrl = e.Row.FindControl(“sqlDsOrders”) as SqlDataSource;
if (ctrl != null && e.Row.DataItem != null)
{
ctrl.SelectParameters["CustomerID"].DefaultValue = ((DataRowView)e.Row.DataItem)["CustomerID"].ToString();
}
}
}
}
in web.config
<connectionStrings>
<add name=”Northwind” connectionString=”Data Source=.;Initial Catalog=Northwind;Integrated Security=True” providerName=”System.Data.SqlClient”/>
</connectionStrings>
Hope it helps
Good Luck
