DetailTables have no grid items

5 posts, 1 answers
  1. Adam
    Adam avatar
    177 posts
    Member since:
    Oct 2012

    Posted 14 Aug 2008 Link to this post

    I have the following grid:

    <telerik:RadGrid ID="grdList" runat="server" AutoGenerateColumns="False" Width="450px" 
                            Height="260px" GridLines="None" AllowMultiRowSelection="True" AllowPaging="True" 
                            PageSize="10" CssClass="CriteriaGrid"
                            <ItemStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" 
                                Font-Underline="False" Wrap="True" /> 
                            <PagerStyle Mode="NextPrevAndNumeric" PagerTextFormat="{4} &amp;nbsp;Page {0} of {1}" /> 
                            <MasterTableView DataKeyNames="Value" Name="Master" ShowHeader="False" GridLines="None" HierarchyLoadMode="Client"
                                <RowIndicatorColumn> 
                                    <HeaderStyle Width="20px"></HeaderStyle> 
                                </RowIndicatorColumn> 
                                <ExpandCollapseColumn Visible="True"
                                    <HeaderStyle Width="20px"></HeaderStyle> 
                                </ExpandCollapseColumn> 
                                <Columns> 
                                    <telerik:GridClientSelectColumn HeaderText="Include" UniqueName="Include"
                                        <HeaderStyle Width="20px" /> 
                                    </telerik:GridClientSelectColumn> 
                                    <telerik:GridBoundColumn DataField="Text" HeaderText="Text" UniqueName="Text"
                                        <HeaderStyle Width="100%" /> 
                                        <ItemStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" 
                                            Font-Underline="False" Wrap="False" /> 
                                    </telerik:GridBoundColumn> 
                                </Columns> 
                                <ItemStyle Wrap="False" Font-Bold="False" Font-Italic="False" Font-Overline="False" 
                                    Font-Strikeout="False" Font-Underline="False"></ItemStyle> 
                                <GroupHeaderItemStyle Wrap="False" Font-Bold="False" Font-Italic="False" Font-Overline="False" 
                                    Font-Strikeout="False" Font-Underline="False"></GroupHeaderItemStyle> 
                                <AlternatingItemStyle Wrap="False" Font-Bold="False" Font-Italic="False" Font-Overline="False" 
                                    Font-Strikeout="False" Font-Underline="False"></AlternatingItemStyle> 
                                <EditItemStyle Wrap="False" Font-Bold="False" Font-Italic="False" Font-Overline="False" 
                                    Font-Strikeout="False" Font-Underline="False"></EditItemStyle> 
                                <DetailTables> 
                                    <telerik:GridTableView runat="server" Name="Detail" DataKeyNames="Value" ShowHeader="False"
                                        <Columns> 
                                            <telerik:GridClientSelectColumn HeaderText="Include" UniqueName="Include"
                                                <HeaderStyle Width="20px" /> 
                                            </telerik:GridClientSelectColumn> 
                                            <telerik:GridBoundColumn DataField="Text" HeaderText="Text" UniqueName="Text"
                                                <HeaderStyle Width="100%" /> 
                                                <ItemStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" 
                                                    Font-Underline="False" Wrap="False" /> 
                                            </telerik:GridBoundColumn> 
                                        </Columns> 
                                        <RowIndicatorColumn> 
                                            <HeaderStyle Width="20px" /> 
                                        </RowIndicatorColumn> 
                                        <ExpandCollapseColumn> 
                                            <HeaderStyle Width="20px" /> 
                                        </ExpandCollapseColumn> 
                                    </telerik:GridTableView> 
                                </DetailTables> 
                            </MasterTableView> 
                            <ClientSettings> 
                                <Selecting AllowRowSelect="True" EnableDragToSelectRows="False"></Selecting> 
                                <ClientEvents OnRowSelected="SelectChildren" OnRowDeselected="SelectChildren" OnRowSelecting="CancelNonInputSelect" OnRowDeselecting="CancelNonInputSelect"
                                </ClientEvents> 
                                <Scrolling AllowScroll="True" UseStaticHeaders="True"></Scrolling> 
                            </ClientSettings> 
                            <FilterMenu EnableTheming="True"
                                <CollapseAnimation Duration="200" Type="OutQuint" /> 
                            </FilterMenu> 
                        </telerik:RadGrid> 

    With the follwing JS events:
    function CancelNonInputSelect(sender, args)    
                {    
                    var e = args.get_domEvent();   
                    //IE - srcElement, Others - target   
                    var targetElement = e.srcElement || e.target;   
                     
                    if (targetElement != null) { 
                        //is the clicked element an input checkbox? <input type="checkbox"...>   
                        if(targetElement.tagName.toLowerCase() != "input" && (!targetElement.type || targetElement.type.toLowerCase() != "checkbox"))  
                        {                       
                            //cancel the event   
                            args.set_cancel(true);   
                            return
                        }   
                    } 
                }    
                 
                function SelectChildren(sender, args) { 
                    if(args.get_tableView().get_name()=='Master') { 
                        var di = args.get_tableView().get_dataItems()[args.get_itemIndexHierarchical()]; 
                        di.set_expanded(true); 
                         
                        var grid = $find("<%= grdList.ClientID %>"); 
                        var table = grid.get_detailTables()[args.get_itemIndexHierarchical()]; 
                                                                
                        for (i = 0; i < table.get_dataItems().length; i++) 
                        { 
                            if (di.get_selected() == true
                                table.selectItem(table.get_dataItems()[i].get_element()); 
                            else 
                                table.deselectItem(table.get_dataItems()[i].get_element()); 
                        } 
                    } 
                } 

    I have paging enabled, and since the grid doesn't maintain what was selected on a previous page (I think this would be an AWESOME feature to include in a future build), I have to capture all the selected items from each page so that I can reselect them again when the grid renders back to one of the pages.

    I have the hierarchy load mode set to client and have subscribed to both the NeedDataSource and DetailTableDataBind events so that the grid is fully loaded when it comes to the screen.

    The problem is when I'm trying to look at what is selected inside of my detail tables. I'm able to loop through the MasterTableView grid items see what is selected and what isn't and add them or remove them from my SelectedItems array. However, when I get down and start looping through the detail tables, they don't have any grid items, so I can't add them to my SelectedDetailItems array.
    Private Sub grdList_PageIndexChanged(ByVal source As ObjectByVal e As Telerik.Web.UI.GridPageChangedEventArgs) Handles grdList.PageIndexChanged 
            For Each item As Telerik.Web.UI.GridItem In grdList.MasterTableView.Items 
                If item.Selected Then 
                    If Not SelectedItems.Contains(grdList.MasterTableView.DataKeyValues(item.ItemIndex).Item("Value")) Then 
                        SelectedItems.Add(grdList.MasterTableView.DataKeyValues(item.ItemIndex).Item("Value")) 
                    End If 
                Else 
                    SelectedItems.Remove(grdList.MasterTableView.DataKeyValues(item.ItemIndex).Item("Value")) 
                End If 
            Next 
     
            For Each det As Telerik.Web.UI.GridTableView In grdList.MasterTableView.DetailTables 
                For Each item As Telerik.Web.UI.GridItem In det.Items 
                    If item.Selected Then 
                        If Not SelectedDetailItems.Contains(det.DataKeyValues(item.ItemIndex).Item("Value")) Then 
                            SelectedDetailItems.Add(det.DataKeyValues(item.ItemIndex).Item("Value")) 
                        End If 
                    Else 
                        SelectedDetailItems.Remove(det.DataKeyValues(item.ItemIndex).Item("Value")) 
                    End If 
                Next 
            Next 
        End Sub 

    I would love to be able to use the SelectedItems array on the RadGrid (which does have the selected items from the detail tables), but can't because it will only tell me what has been selected, but I need to know what isn't selected so I can remove them from my storage array. As you can see, if there was a way for the grid to maintain selections when the page index/sort changes and restore them when it renders those grid items, that would be GREAT and save me tons of time and additional code writing to handle something that really should be included.

    Thanks,
    Adam
  2. Iana Tsolova
    Admin
    Iana Tsolova avatar
    3388 posts

    Posted 19 Aug 2008 Link to this post

    Hi Adam,

    You can get the collection of all detail tables in your grid by using the get_detailTables() client side method. This will give a collection of tables of type GridTableView. Then you could call the get_dataItems() client method to retreive the collection of GridDataItems for each detail table in order to achieve your goal.

    Find more about RadGrid client-side Appi here.

    Let us know if we could help you further.
     
    Best wishes,
    Iana
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Adam
    Adam avatar
    177 posts
    Member since:
    Oct 2012

    Posted 19 Aug 2008 Link to this post

    The issue is not on the client side, that part is working great. The issue is in the PageIndexChanged function on the server side. I'm looping through the grid items in the MasterTableView and that works fine. The issue is when I try to loop through the DetailTables of the MasterTableView and then loop through their subsequent grid items. The GridItemCollection is empty. I have the grid set to do the bind everything so it will expand client side which I figured would make the GridItemCollections filled on the server side after the PageIndexChanged postback.

    Thanks,

    Adam


  5. Answer
    Nikita Gourme
    Nikita Gourme avatar
    318 posts
    Member since:
    May 2006

    Posted 22 Aug 2008 Link to this post

    I read in this chapter of the documentation that the DetailTables collection is a prototype collection which can not be used in a number of cases to access the detail tables in the hierarchy. Instead loop through the Items collection of the grid itself or perform a recursive loop through the nested tables.

    Hope these pointers are useful.

    Nikita
  6. Adam
    Adam avatar
    177 posts
    Member since:
    Oct 2012

    Posted 22 Aug 2008 Link to this post

    Thanks for the answer. That explains why it didn't work. I've resorted to looping through the ItemsHierarchy and checking the name of the table ("Master" or "Detail) for each of the items and then running the necessary code for depending on the table it is in and whether or not it is selected.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017