Create radgrid between rows of another radgrid

[Joao]

Hello everyone,

I have a bound radgrid with a button and I would like to create another radgrid imediately underneath the clicked button row.

Please see below image links to understand what I'm trying to achive.

Bound radgrid -> http://www.freeimagehosting.net/8a57a
Bound radgrid with another radgrid underneath clicked row -> http://www.freeimagehosting.net/6a981

Please let me know if this is possible to achive and if so, some directions on what to use.

Thanks in advance

Joao

[Princy]

Hello,

I am not quite sure about your scenario. One suggestion is you can add Button and RadGrid inside ItemTemplate and set the visibility of RadGrid as false. Then set the visibility as true on button click. Here is the sample code.

C#:

protected void Button1_Click(object sender, EventArgs e)
  {
     Button button1= (Button)sender;
     RadGrid radgrid1= (RadGrid)button1.FindControl("RadGrid1");
     radgrid1.Visible = true;
  }

Thanks,
Princy.

[Joao]

Hi Princy,

thanks for your reply. What I was looking for was hierarchical grid. Using them I was able to achieve part of my goal.

The other part of my goal is:

The main radgrid has a gridtemplatecolumn with a linkbutton and an imagebutton. I would like to expand/colape the second grid, when either the button or the image is clicked inside the gridtemplate column. I already have code somewhere that allows me to hide the expand column.

Please see this image which ilustrates exactly what Im trying to achieve: http://www.freeimagehosting.net/aadc5

The grid mark up looks as follows

<telerik:RadGrid ID="GridShares" runat="server" AutoGenerateColumns="False" CellSpacing="0" GridLines="None">
    <MasterTableView DataKeyNames="AccountNumber, AccountType">
        <CommandItemSettings ExportToPdfText="Export to PDF"></CommandItemSettings>
        <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">
            <HeaderStyle Width="20px"></HeaderStyle>
        </RowIndicatorColumn>
        <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">
            <HeaderStyle Width="20px"></HeaderStyle>
        </ExpandCollapseColumn>
        <DetailTables>
            <telerik:GridTableView Name="recentTransactions" Width="100%">
                <Columns>
                    <telerik:GridBoundColumn DataField="Date" FilterControlAltText="Filter Date column" HeaderText="Date" SortExpression="Date" UniqueName="Date">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Description" FilterControlAltText="Filter Description column" HeaderText="Description" SortExpression="Description" UniqueName="Description" AllowSorting="false">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Interest" FilterControlAltText="Filter Interest column" HeaderText="Interest" SortExpression="Interest" UniqueName="Interest" AllowSorting="false">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="transactionAmount" FilterControlAltText="Filter transactionAmount column" HeaderText="Transaction Amount" SortExpression="transactionAmount" UniqueName="transactionAmount">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="Balance" FilterControlAltText="Filter Balance column" HeaderText="Balance" SortExpression="Balance" UniqueName="Balance" AllowSorting="false">
                    </telerik:GridBoundColumn>
                </Columns>
            </telerik:GridTableView>
        </DetailTables>
        <Columns>
            <telerik:GridBoundColumn DataField="Account" FilterControlAltText="Filter Account column" HeaderText="Account" SortExpression="Account" UniqueName="Account">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="AccountNumber" FilterControlAltText="Filter AccountNumber column" HeaderText="Account Number" SortExpression="AccountNumber" UniqueName="AccountNumber">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Balance" FilterControlAltText="Filter Balance column" HeaderText="Balance" SortExpression="Balance" UniqueName="Balance">
            </telerik:GridBoundColumn>
            <telerik:GridTemplateColumn UniqueName="TemplateColumn">
                <ItemTemplate>
                    <asp:LinkButton ID="btnLinkViewTransactions" CommandName="ViewTransactions" runat="server" CssClass="btnLinkViewTransactions">View Transactions</asp:LinkButton><asp:ImageButton ID="btnImageViewTransactions" runat="server" CommandName="ViewTransactions" ImageUrl="Images/BlueTheme/expand.png" />
                </ItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridBoundColumn DataField="AccountType" FilterControlAltText="Filter AccountType column" HeaderText="Account Type" SortExpression="AccountType" UniqueName="AccountType" Visible="false">
            </telerik:GridBoundColumn>
        </Columns>
        <EditFormSettings>
            <EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn>
        </EditFormSettings>
    </MasterTableView>
    <FilterMenu EnableImageSprites="False"></FilterMenu>
    <HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"></HeaderContextMenu>
</telerik:RadGrid>

So I want the "view transactions" to behave like the expand/colape column. Is this possible?

Thank you very much in advance

[Antonio Stoilkov]

Hi Joao,

The scenario from the images refers to RadGrid Hierarchy. You could examine some examples from the link below:

• http://demos.telerik.com/aspnet-ajax/grid/examples/hierarchy/declarativerelations/defaultcs.aspx

Additionally, I recommend that you go through the Hierarchical Grid Types and Load Modes section in the documentation below:

• http://www.telerik.com/help/aspnet-ajax/grid-what-you-should-know.html

Regards,
Antonio Stoilkov
the Telerik team

[Princy]

Hello,

You can try the following code snippet.

CS:

protected void HideDetail_ShowDetail1_Click(object sender, EventArgs e)
    {
        foreach (GridDataItem item in RadGrid1.MasterTableView.Items)
        {
            RadGrid1.MasterTableView.Items[item.ItemIndex].ChildItem.NestedTableViews[0].Visible = false;
            RadGrid1.MasterTableView.Items[item.ItemIndex].ChildItem.NestedTableViews[1].Visible = true;
        }
     }
    protected void HideDetail1_ShowDetail_Click(object sender, EventArgs e)
    {
        foreach (GridDataItem item in RadGrid1.MasterTableView.Items)
        {
            RadGrid1.MasterTableView.Items[item.ItemIndex].ChildItem.NestedTableViews[0].Visible = true;
            RadGrid1.MasterTableView.Items[item.ItemIndex].ChildItem.NestedTableViews[1].Visible = false;
        }
    }

Thanks,
Princy.

[Joao]

Hi Princy,

I couldn't get that to work because I didn't know what to do with those functions but let me add something else to this.
When the little arrow in the expand column is clicked, the following code is executed:

Protected Sub GridShares_DetailTableDataBind(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridDetailTableDataBindEventArgs) Handles GridShares.DetailTableDataBind

    Try

        Dim dataItem As GridDataItem = CType(e.DetailTableView.ParentItem, GridDataItem)

        If e.DetailTableView.Name = "recentTransactions" Then

            Dim accountNumber As String = dataItem.GetDataKeyValue("AccountNumber").ToString()

            'HERE THERE'S SOME EXTRA CODE TO GET A DATATABLE BASED ON THE accountNumber FROM THE PREVIOUS LINE


            e.DetailTableView.DataSource = TransactionsDT

        End If

    Catch ex As Exception

    End Try

End Sub

I would like that code to run when I click the "view transactions" button instead. The view transactions button is a <asp:linkbutton> inside a gridtemplatecolumn.

I'm really sorry I wasn't explicit enough on my previous post. Any aditional sugestions or directions on this are highly appreciated. Thanks

[Joao]

I'm posting this just in case someone end up in this thread.
I was able to achieve my goal just by giving my custom linkbuttom the command name "ExpandCollapse". So simple... thanks everyone for the previous sugestions.

Joao