[Solved] RadGrid On click of View expand collapse

[Rahul]

In my grid i want functionality like this, In a grid View button in column, If user click on view the panel will collapse/expand with detail information.  

I tried with netedview template but not working.  How to bind data on nested button click.

Please help

[Princy]

Hi,

One suggestion is to create a hierarchical grid with the Parent RadGrid having a GridButtonColumn whose CommandName as ExpandCollapse. You can hide the Default ExpandCollapse Column of the RadGrid.

ASPX:

<telerik:RadGrid ID="RadGrid1"  DataSourceID="SqlDataSource1"
    runat="server" AutoGenerateColumns="False">
    <MasterTableView DataSourceID="SqlDataSource1" DataKeyNames="CustomerID">
        <DetailTables>
            <telerik:GridTableView DataKeyNames="OrderID" Name="Detail" DataSourceID="SqlDataSource2" runat="server">
                <ParentTableRelation>
                    <telerik:GridRelationFields DetailKeyField="CustomerID" MasterKeyField="CustomerID">
                    </telerik:GridRelationFields>
                </ParentTableRelation>
                <Columns>
                    <telerik:GridBoundColumn SortExpression="OrderID" HeaderText="OrderID" HeaderButtonType="TextButton"
                        DataField="OrderID" UniqueName="OrderID">
                    </telerik:GridBoundColumn>
                </Columns>

            </telerik:GridTableView>
        </DetailTables>
        <Columns>
            <telerik:GridBoundColumn SortExpression="CustomerID" HeaderText="CustomerID" HeaderButtonType="TextButton"
                DataField="CustomerID" UniqueName="CustomerID">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn SortExpression="ContactName" HeaderText="Contact Name" HeaderButtonType="TextButton"
                DataField="ContactName" UniqueName="ContactName">
            </telerik:GridBoundColumn>
            <telerik:GridButtonColumn CommandName="ExpandCollapse" Text="expand/collapse">
            </telerik:GridButtonColumn>
        </Columns>
    </MasterTableView>
</telerik:RadGrid>

CSS:

<style type="text/css">
    .RadGrid_Default .rgExpand {
            display: none;
    }
</style>

Thanks,
Princy.