Hierarchical Databinding while expanding GridRow

[Tejas]

Hi,
I have a hierarchical grid with tabs in it. First-time binding data to grid works fine but once I expand and collapse the row(s), the data belong to the row does not bind properly. I'm using programmatic data-binding.

<telerik:RadGrid ID="grdLevel1" runat="server" AutoGenerateColumns="false" OnDetailTableDataBind="grdLevel1_DetailTableDataBind"
            OnItemDataBound="grdLevel1_ItemDataBound" OnItemCommand="grdLevel1_ItemCommand" OnItemCreated="grdLevel1_ItemCreated"
            OnNeedDataSource="grdLevel1_NeedDataSource">
            <MasterTableView DataKeyNames="FldOrderID" Name="Orders" HierarchyDefaultExpanded="true">
                <NoRecordsTemplate>
                    <strong>No Record Found.</strong>
                </NoRecordsTemplate>
                <Columns>
                    <telerik:GridBoundColumn DataField="FldOrderID" HeaderText="OrderID" UniqueName="FldOrderID">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn DataField="FldOrderNumber" HeaderText="OrderNumber" UniqueName="FldOrderNumber">
                    </telerik:GridBoundColumn>
                </Columns>
                <DetailTables>
                    <telerik:GridTableView DataKeyNames="FldOrderDetailID" AutoGenerateColumns="false"
                        Name="OrderDetail" HierarchyDefaultExpanded="true">

                        <Columns>
                            <telerik:GridBoundColumn HeaderText="Detail ID" DataField="FldOrderDetailID">
                            </telerik:GridBoundColumn>

                            <telerik:GridTemplateColumn HeaderText="Source Language">
                                <ItemTemplate>
                                    <asp:Label ID="lblSourceLanguage" runat="server"></asp:Label>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                        </Columns>
                        <DetailTables>
                            <telerik:GridTableView DataKeyNames="FldOrderDetailLanguageID,FldOrderDetailID,FldTargetLanguageID" Name="TargetLanguages"
                                AutoGenerateColumns="false" HierarchyDefaultExpanded="true">
                                <Columns>
                                    <telerik:GridTemplateColumn HeaderText="Target Language">
                                        <ItemTemplate>
                                            <asp:Label ID="lblTargetLang" runat="server"></asp:Label>
                                        </ItemTemplate>
                                    </telerik:GridTemplateColumn>
                                </Columns>
                                <DetailTables>
                                    <telerik:GridTableView DataKeyNames="FldOrderDetailDocumentID" AutoGenerateColumns="false"
                                        Name="DetailDocuments" HierarchyDefaultExpanded="true">
                                        <Columns>
                                            <telerik:GridBoundColumn DataField="FldOrderDetailDocumentID" HeaderText="FldOrderDetailDocumentID">
                                            </telerik:GridBoundColumn>
                                            <telerik:GridBoundColumn DataField="FldDocumentName" HeaderText="DocumentName">
                                            </telerik:GridBoundColumn>
                                        </Columns>
                                        <NestedViewTemplate>
                                            <asp:Panel runat="server" ID="InnerContainer" Visible="true">
                                                <telerik:RadTabStrip runat="server" ID="TabStip1" MultiPageID="Multipage1" SelectedIndex="0">
                                                    <Tabs>
                                                        <telerik:RadTab runat="server" Text="Standard" PageViewID="PageView1">
                                                        </telerik:RadTab>
                                                        <telerik:RadTab runat="server" Text="Normalized" PageViewID="PageView2">
                                                        </telerik:RadTab>
                                                        <telerik:RadTab runat="server" Text="Blended" PageViewID="PageView3">
                                                        </telerik:RadTab>
                                                        <telerik:RadTab runat="server" Text="Lowest" PageViewID="PageView4">
                                                        </telerik:RadTab>
                                                    </Tabs>
                                                </telerik:RadTabStrip>
                                                <telerik:RadMultiPage runat="server" ID="Multipage1" SelectedIndex="0" RenderSelectedPageOnly="false">
                                                    <telerik:RadPageView runat="server" ID="PageView1">
                                                        <telerik:RadGrid runat="server" ID="grdStd" ShowFooter="false"
                                                        AutoGenerateColumns="false" OnItemCommand="grdChild_ItemCommand"
                                                        OnNeedDataSource="grdChild_NeedDataSource" OnDetailTableDataBind="grdLevel1_DetailTableDataBind">
                                                            <MasterTableView DataKeyNames="FldServiceTypeID" Name="StdServiceType" HierarchyDefaultExpanded="true">
                                                                <Columns>
                                                                    <telerik:GridBoundColumn DataField="FldServiceTypeName" HeaderText="Service Type"></telerik:GridBoundColumn>
                                                                </Columns>
                                                                <DetailTables>
                                                                    <telerik:GridTableView Name="StdServices" DataKeyNames="FldServiceID" AutoGenerateColumns="false" EditMode="InPlace">
                                                                        <Columns>
                                                                            <telerik:GridEditCommandColumn ButtonType="ImageButton" ></telerik:GridEditCommandColumn>
                                                                            <telerik:GridBoundColumn DataField="FldServiceName" HeaderText="Service Name"></telerik:GridBoundColumn>
                                                                        </Columns>
                                                                    </telerik:GridTableView>
                                                                </DetailTables>
                                                            </MasterTableView>
                                                        </telerik:RadGrid>
                                                    </telerik:RadPageView>
                                                    <telerik:RadPageView runat="server" ID="PageView2">
                                                        <telerik:RadGrid runat="server" ID="grdNormalized"  ShowFooter="false" AutoGenerateColumns="false"
                                                        OnItemCommand="grdChild_ItemCommand" OnNeedDataSource="grdChild_NeedDataSource" OnDetailTableDataBind="grdLevel1_DetailTableDataBind">
                                                            <MasterTableView DataKeyNames="FldServiceTypeID" Name="NormalizedServiceType" HierarchyDefaultExpanded="true">
                                                                <Columns>
                                                                    <telerik:GridBoundColumn DataField="FldServiceTypeName" HeaderText="Service Type"></telerik:GridBoundColumn>
                                                                </Columns>
                                                                <DetailTables>
                                                                    <telerik:GridTableView Name="NormalizedServices" DataKeyNames="FldServiceID" AutoGenerateColumns="false">
                                                                        <Columns>
                                                                            <telerik:GridBoundColumn DataField="FldServiceName" HeaderText="Service Name"></telerik:GridBoundColumn>
                                                                        </Columns>
                                                                    </telerik:GridTableView>
                                                                </DetailTables>
                                                            </MasterTableView>
                                                        </telerik:RadGrid>
                                                    </telerik:RadPageView>
                                                    <telerik:RadPageView runat="server" ID="PageView3">
                                                        <telerik:RadGrid runat="server" ID="grdBlended"  ShowFooter="false"
                                                        AutoGenerateColumns="false" OnItemCommand="grdChild_ItemCommand" OnNeedDataSource="grdChild_NeedDataSource" OnDetailTableDataBind="grdLevel1_DetailTableDataBind">
                                                            <MasterTableView DataKeyNames="FldServiceTypeID" Name="BlendedServiceType" HierarchyDefaultExpanded="true">
                                                                <Columns>
                                                                    <telerik:GridBoundColumn DataField="FldServiceTypeName" HeaderText="Service Type"></telerik:GridBoundColumn>
                                                                </Columns>
                                                                <DetailTables>
                                                                    <telerik:GridTableView Name="BlendedServices" DataKeyNames="FldServiceID"
                                                                        AutoGenerateColumns="false">
                                                                        <Columns>
                                                                            <telerik:GridBoundColumn DataField="FldServiceName" HeaderText="Service Name"></telerik:GridBoundColumn>
                                                                        </Columns>
                                                                    </telerik:GridTableView>
                                                                </DetailTables>
                                                            </MasterTableView>
                                                        </telerik:RadGrid>
                                                    </telerik:RadPageView>
                                                    <telerik:RadPageView runat="server" ID="PageView4">
                                                        <telerik:RadGrid runat="server" ID="grdLowest"  ShowFooter="false"
                                                        AutoGenerateColumns="false" OnItemCommand="grdChild_ItemCommand" OnNeedDataSource="grdChild_NeedDataSource" OnDetailTableDataBind="grdLevel1_DetailTableDataBind">
                                                            <MasterTableView DataKeyNames="FldServiceTypeID" Name="LowestServiceType" HierarchyDefaultExpanded="true">
                                                                <Columns>
                                                                    <telerik:GridBoundColumn DataField="FldServiceTypeName" HeaderText="Service Type"></telerik:GridBoundColumn>
                                                                </Columns>
                                                                <DetailTables>
                                                                    <telerik:GridTableView Name="LowestServices" DataKeyNames="FldServiceID"
                                                                        AutoGenerateColumns="false">
                                                                        <Columns>
                                                                            <telerik:GridBoundColumn DataField="FldServiceName" HeaderText="Service Name"></telerik:GridBoundColumn>
                                                                        </Columns>
                                                                    </telerik:GridTableView>
                                                                </DetailTables>
                                                            </MasterTableView>
                                                        </telerik:RadGrid>
                                                    </telerik:RadPageView>
                                                </telerik:RadMultiPage>
                                            </asp:Panel>
                                        </NestedViewTemplate>
                                    </telerik:GridTableView>
                                </DetailTables>
                            </telerik:GridTableView>
                        </DetailTables>
                    </telerik:GridTableView>
                </DetailTables>
            </MasterTableView>
        </telerik:RadGrid>

and Here is code behind:

public partial class GridSamples_MultilevelWithCode : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
            BindGridData();
    }

    private void BindGridData()
    {
        //throw new NotImplementedException();
        //IQueryable<tblOrderCharge> objtblOrderCharges = tblOrderCharge.GetAllOrderCharges(Convert.ToInt32(Request.QueryString["OID"]));
        IQueryable<tblOrder> objtblOrdes = tblOrder.GetEntity(Convert.ToInt32(Request.QueryString["OID"]));
        grdLevel1.DataSource = objtblOrdes;
    }

    protected void grdChild_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if ((e.Item is GridDataItem) && e.Item.OwnerTableView.Name == "StdServiceType")
        {
            GridDataItem oitem = e.Item as GridDataItem;
            tblServiceType otblServiceType = oitem.DataItem as tblServiceType;
            //oitem.OwnerTableView.DetailTables[0].DataSource = tblService.GetByTypeID(Convert.ToInt32(oitem.GetDataKeyValue("FldServiceTypeID")));
        }

        if ((e.Item is GridDataItem) && e.Item.OwnerTableView.Name == "StdServices")
        {
            //GridDataItem oitem = e.Item as GridDataItem;
            //tblService otblServices = oitem.DataItem as tblService;

            ////Bind all Template columns here

        }

    }
    protected void grdChild_ItemCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e)
    {

        string innerGridName = e.Item.OwnerTableView.Name;
        GridDataItem otm = e.Item.OwnerTableView.ParentItem;

        switch (e.CommandName)
        {
            case "ExpandCollapse":
                int serviceTypeID = Convert.ToInt32(e.Item.OwnerTableView.DataKeyValues[0]["FldServiceTypeID"]);
                //e.Item.OwnerTableView.Rebind();
                 //e.Item.OwnerTableView.DetailTables[0].DataSource = tblService.GetByTypeID(serviceTypeID);
                break;
            case "Edit":
                break;
        }

        if (innerGridName == "StdServiceType")
        {

        }

        if (innerGridName == "StdServices")
        {

        }
    }

    protected void grdLevel1_ItemCreated(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if (e.Item is GridNestedViewItem && e.Item.OwnerTableView.Name == "DetailDocuments")
        {
            e.Item.FindControl("InnerContainer").Visible = ((GridNestedViewItem)e.Item).ParentItem.Expanded;
        }
    }

    protected void grdLevel1_ItemDataBound(object sender, Telerik.Web.UI.GridItemEventArgs e)
    {
        if ((e.Item is GridDataItem) && e.Item.OwnerTableView.Name == "Orders")
        {

        }
        if ((e.Item is GridDataItem) && e.Item.OwnerTableView.Name == "OrderDetail")
        {
            GridDataItem oItem = e.Item as GridDataItem;
            if (oItem != null)
            {
                Label lblSourceLanguage = oItem.FindControl("lblSourceLanguage") as Label;
                lblSourceLanguage.Text = tblLanguage.GetLanguage(((tblOrderDetail)oItem.DataItem).FldSourceLanguageID).FldLanguageName;
            }
        }

        if ((e.Item is GridDataItem) && e.Item.OwnerTableView.Name == "DetailDocuments")
        {

        }

        if ((e.Item is GridNestedViewItem) && e.Item.OwnerTableView.Name == "DetailDocuments")
        {
            GridDataItem otm = e.Item.OwnerTableView.ParentItem;

            int documentId = 0;
            if (e.Item.OwnerTableView.DataKeyValues.Count > 0)
                documentId = Convert.ToInt32(e.Item.OwnerTableView.DataKeyValues[0]["FldOrderDetailDocumentID"]);

            int targetLanguageId = 0;
            if (otm != null)
                targetLanguageId = Convert.ToInt32(otm.GetDataKeyValue("FldTargetLanguageID"));

            RadGrid grdStd = e.Item.FindControl("grdStd") as RadGrid;
            //grdStd.ItemDataBound += new GridItemEventHandler(grdChild_ItemDataBound);
            //grdStd.DetailTableDataBind += new GridDetailTableDataBindEventHandler(grdLevel1_DetailTableDataBind);
            //grdStd.ItemCommand += new GridCommandEventHandler(grdChild_ItemCommand);
            grdStd.MasterTableView.DataSource = tblServiceType.GetServiceTypes(documentId, targetLanguageId);

            RadGrid grdNormalized = e.Item.FindControl("grdNormalized") as RadGrid;
            //grdNormalized.ItemDataBound += new GridItemEventHandler(grdChild_ItemDataBound);
            //grdNormalized.DetailTableDataBind += new GridDetailTableDataBindEventHandler(grdLevel1_DetailTableDataBind);
            //grdNormalized.ItemCommand += new GridCommandEventHandler(grdChild_ItemCommand);
            grdNormalized.MasterTableView.DataSource = tblServiceType.GetServiceTypes(documentId, targetLanguageId);

            RadGrid grdBlended = e.Item.FindControl("grdBlended") as RadGrid;
            //grdBlended.ItemDataBound += new GridItemEventHandler(grdChild_ItemDataBound);
            //grdBlended.DetailTableDataBind += new GridDetailTableDataBindEventHandler(grdLevel1_DetailTableDataBind);
            grdBlended.MasterTableView.DataSource = tblServiceType.GetServiceTypes(documentId, targetLanguageId);

            RadGrid grdLowest = e.Item.FindControl("grdLowest") as RadGrid;
            //grdLowest.ItemDataBound += new GridItemEventHandler(grdChild_ItemDataBound);
            //grdLowest.DetailTableDataBind += new GridDetailTableDataBindEventHandler(grdLevel1_DetailTableDataBind);
            grdLowest.MasterTableView.DataSource = tblServiceType.GetServiceTypes(documentId, targetLanguageId);

            e.Item.FindControl("InnerContainer").Visible = ((GridNestedViewItem)e.Item).ParentItem.Expanded;

        }

        if ((e.Item is GridDataItem) && e.Item.OwnerTableView.Name == "TargetLanguages")
        {
            GridDataItem oItem = e.Item as GridDataItem;
            Label lblTargetLang = oItem.FindControl("lblTargetLang") as Label;
            lblTargetLang.Text = ((tblOrderDetailLanguage)oItem.DataItem).tblLanguage.FldLanguageName;
        }

    }
    protected void grdLevel1_ItemCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e)
    {

        if (e.Item.OwnerTableView.Name == "OrderDetail")
        {
            int orderId = Convert.ToInt32(((GridDataItem)e.Item).GetDataKeyValue("FldOrderID"));
            e.Item.OwnerTableView.DataSource = tblOrderDetail.GetAllOrderDetails(orderId);
            e.Item.OwnerTableView.HierarchyDefaultExpanded = true;
        }

        if (e.Item.OwnerTableView.Name == "TargetLanguages")
        {
            int orderDetId = Convert.ToInt32(((GridDataItem)e.Item).GetDataKeyValue("FldOrderDetailID"));
            e.Item.OwnerTableView.DataSource = tblOrderDetailLanguage.GetTargetLanguages(orderDetId);
            e.Item.OwnerTableView.HierarchyDefaultExpanded = true;

            //int orderDetId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldOrderDetailID"));
            //e.DetailTableView.DataSource = tblOrderDetailLanguage.GetTargetLanguages(orderDetId);
        }

        if (e.Item.OwnerTableView.Name == "DetailDocuments")
        {
            int tarLangId = Convert.ToInt32(e.Item.OwnerTableView.ParentItem.GetDataKeyValue("FldTargetLanguageID"));
            int documentId = Convert.ToInt32(((GridDataItem)e.Item).GetDataKeyValue("FldOrderDetailDocumentID"));
            int orderDetailId = Convert.ToInt32(e.Item.OwnerTableView.ParentItem.GetDataKeyValue("FldOrderDetailID"));
            e.Item.OwnerTableView.DataSource = tblOrderDetailDocument.GetAllDetailDocuments(orderDetailId, tarLangId);
            e.Item.OwnerTableView.HierarchyDefaultExpanded = true;
            //e.Item.OwnerTableView.Rebind();
            //GridDataItem otm = e.Item.OwnerTableView.ParentItem;



        }

        if (e.Item.OwnerTableView.Name == "StdServiceType")
        {

        }

        if (e.Item.OwnerTableView.Name == "StdServices")
        {
        }
    }

    protected void grdLevel1_DetailTableDataBind(object sender, Telerik.Web.UI.GridDetailTableDataBindEventArgs e)
    {
        string detTableName = e.DetailTableView.Name;
        int serviceTypeId = 0;
        switch (detTableName)
        {

            case "Orders":

                break;
            case "OrderDetail":
                //GridDataItem oItem = e.DetailTableView.ParentItem;
                int orderId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldOrderID"));
                e.DetailTableView.DataSource = tblOrderDetail.GetAllOrderDetails(orderId);
                break;
            case "TargetLanguages":
                int orderDetId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldOrderDetailID"));
                e.DetailTableView.DataSource = tblOrderDetailLanguage.GetTargetLanguages(orderDetId);
                break;

            case "DetailDocuments":
                int orderDetailId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldOrderDetailID"));
                int tarLangId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldTargetLanguageID"));
                e.DetailTableView.DataSource = tblOrderDetailDocument.GetAllDetailDocuments(orderDetailId, tarLangId);
                break;

            case "StdServiceType":
                //serviceTypeId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldServiceTypeID"));
                //e.DetailTableView.DataSource = tblService.GetByTypeID(serviceTypeId);
                break;
            case "BlendedServices":
                serviceTypeId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldServiceTypeID"));
                e.DetailTableView.DataSource = tblService.GetByTypeID(serviceTypeId);
                break;
            case "NormalizedServices":
                serviceTypeId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldServiceTypeID"));
                e.DetailTableView.DataSource = tblService.GetByTypeID(serviceTypeId);
                break;
            case "StdServices":
                serviceTypeId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldServiceTypeID"));
                e.DetailTableView.DataSource = tblService.GetByTypeID(serviceTypeId);
                break;
            case "LowestServices":
                serviceTypeId = Convert.ToInt32(e.DetailTableView.ParentItem.GetDataKeyValue("FldServiceTypeID"));
                e.DetailTableView.DataSource = tblService.GetByTypeID(serviceTypeId);
                break;


        }

    }

    protected void grdChild_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        if (e.IsFromDetailTable)
        {
            RadGrid oMasterGrid = sender as RadGrid;
            if (oMasterGrid != null)
            {
                int servTypeId = Convert.ToInt32(oMasterGrid.MasterTableView.DataKeyValues[0]["FldServiceTypeID"]);
                oMasterGrid.MasterTableView.DataSource = tblService.GetByTypeID(servTypeId);
                //oMasterGrid.MasterTableView.DetailTables[0].DataSource = tblService.GetByTypeID(servTypeId);
            }
        }
    }

    protected void grdLevel1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        if (e.IsFromDetailTable)
        {
            RadGrid oMasterGrid = sender as RadGrid;
            if (oMasterGrid != null)
            {
                switch (oMasterGrid.MasterTableView.Name)
                {
                    case "Orders":
                        break;
                    case "OrderDetail":
                        //int orderId = 0;
                        //oMasterGrid.MasterTableView.DataSource = tblOrderDetail.GetAllOrderDetails(orderId);
                        break;

                    case "TargetLanguages":
                        break;

                    case "DetailDocuments":
                        break;

                }
            }
        }
        else
            BindGridData();
    }

}

Please try collapsing and expanding "Target Language" level. All tabs grid will lose its data.
Any help will be greatly appreciated.

Thanks

[Shinu]

Hello Tejas,

I tried the same scenario which worked as expected in my end. If you are binding the grid with NeedDataSource event, then there is no need to bind the grid in pageload. RadGrid fires the NeedDataSource event each time it needs to be bound to a data source. Also check the following demo which implements the same.
Grid / Programmatic Binding

-Shinu.

[Tejas]

Hi Shinu,

Thanks for your prompt reply. I have removed databinding code in Page Load but still I have the same problem.
I have attached a screen shots for your reference. Hope to have a quick solution.

Thanks

Tejas

[Tsvetina]

Hi Tejas,

Try calling Rebind() for the grid in the NestedViewTemplate when its parent item is expanded and the InnerContainer panel is made Visible=true. This is needed because when the grid is invisible, it does not fire its NeedDataSource event and does not bind until you make it visible and call Rebind():
http://www.telerik.com/help/aspnet-ajax/grid-visible-invisible-conventions.html

Greetings,
Tsvetina
the Telerik team

[Tejas]

Hi Tsvetina,
Thanks for your reply. I solved it using this code to rebind the portion which is expanded by user

e.Item.OwnerTableView.HierarchyLoadMode = GridChildLoadMode.ServerBind;

I also tried rebinding it by calling Rebind() method but unfortunately, it causes an exception of stack overflow.
I afraid that my solution may not perform very well in case of huge amount of data but for now Its working fine for me.

Thanks again for your help.

Tejas

[Tejas]

Hi Tsvetina,
Thanks for your help so far. I'll be thankful If you can remove the attached screenshot from my previous post.
I forgot to edit the image which contains the screen of my private messages

Thanks