RadGrid Hierarchy - Custom Command Item

[MathieuB]

Hi,

     Initially, we had a RadGrid whose DataSource is assigned via NeedDataSource (via List Of). All worked perfectly. We now need to add a hierarchical system to have a Parent / Child relationship at the level of our bookings. Visually, the display is what we want.

 

However, I can not Bind the CommandItemTemplate actions for the DetailTable (RadToolBarGridChildEdit). How can I get information from my parent item for the FireCommand?

 

Thank you and have a good day

 

Javascript

01.function onPanelBarItemClicked(sender, args) {
02.           var button = args.get_item();
03.
04.           switch (args.get_item().get_commandName()) {
05.               case "AddResource":
06.                   //Ajouter une nouvelle ligne.  Le paramètre "InitInsert" est OBLIGATOIRE et DOIT être écrit EXACTEMENT comme il est inscrit
07.                   var argument = args.get_item().get_commandArgument();
08.                   document.getElementById('<%=gridMid.ClientID%>').value = argument;
09.
10.                   $find('<%= RgPanelSummary.ClientID%>').get_masterTableView().fireCommand("InitInsert", argument);
11.                   break;
12.
13.               case "AddChildResource":
14.                   //Ajouter une nouvelle ligne.  Le paramètre "InitInsert" est OBLIGATOIRE et DOIT être écrit EXACTEMENT comme il est inscrit
15.                   var argument = args.get_item().get_commandArgument();
16.                   document.getElementById('<%=gridMid.ClientID%>').value = argument;
17.
18.                   break;
19.
20.               default:
21.                   $find('<%= RgPanelSummary.ClientID%>').get_masterTableView().fireCommand(args.get_item().get_commandName(), args.get_item().get_commandArgument());
22.                   break;
23.           }
24.       }

 

ASP Page

001.<telerik:RadGrid ID="RadGrid1" Width="100%" Height="100%" CellPadding="0" BorderWidth="1" Skin="Bootstrap" LocalizationPath="~/Translations/"
002.    GridLines="None" runat="server" AutoGenerateColumns="False" AllowMultiRowSelection="true" AllowMultiRowEdit="true">
003.
004.    <PagerStyle Visible="false"></PagerStyle>
005.
006.    <ClientSettings EnableRowHoverStyle="False" AllowKeyboardNavigation="True" ActiveRowIndex="-1" EnableAlternatingItems="False">
007.        <Selecting AllowRowSelect="True" UseClientSelectColumnOnly="True" />
008.        <Resizing AllowColumnResize="False" AllowResizeToFit="False" />
009.        <KeyboardNavigationSettings EnableKeyboardShortcuts="true" AllowSubmitOnEnter="false" AllowActiveRowCycle="true" />
010.        <DataBinding ShowEmptyRowsOnLoad="true"></DataBinding>
011.        <ClientEvents OnRowDblClick="activitek.ReservationPanelSummary.onSummaryRowDblClick"
012.            OnRowSelected="activitek.ReservationPanelSummary.onSummaryRowSelected"
013.            OnRowDeselected="activitek.ReservationPanelSummary.onSummaryRowDeselected" />
014.    </ClientSettings>
015.
016.
017.    <MasterTableView CommandItemDisplay="Top" TableLayout="Fixed" GroupLoadMode="Client" GridLines="None"
018.        EditMode="InPlace" DataKeyNames="ReservationScheduleID" ClientDataKeyNames="ReservationScheduleID"
019.        RetrieveNullAsDBNull="true">
020.        <PagerStyle PageSizeControlType="None" />
021.
022.        <ParentTableRelation>
023.            <telerik:GridRelationFields DetailKeyField="ParentReservationScheduleID" MasterKeyField="ReservationScheduleID" />
024.        </ParentTableRelation>
025.
026.        <CommandItemTemplate>
027.            <div>
028.                <telerik:RadToolBar ID="RadToolBarGridEdit" runat="server" Width="100%" Height="32px" OnClientButtonClicked="onPanelBarItemClicked">
029.                    <Items>
030.                        <telerik:RadToolBarButton Text="<%$ Resources:AdminLoc, btnEdit %>" ImageUrl="~/Web/Images/Icons/modifier.gif"
031.                            Value="btnAdd" CommandName="EditSelected" ImagePosition="Left"
032.                            Visible='<%# Not (RgPanelSummary.MasterTableView.IsItemInserted OrElse RgPanelSummary.EditIndexes.Count > 0) %>'>
033.                        </telerik:RadToolBarButton>
034.
035.                        <telerik:RadToolBarButton IsSeparator="true"
036.                            Visible='<%# Not (RgPanelSummary.MasterTableView.IsItemInserted OrElse RgPanelSummary.EditIndexes.Count > 0) %>' />
037.
038.                        <telerik:RadToolBarDropDown Text="<%$ Resources:AdminLoc, btnAdd %>" ImageUrl="~/Web/Images/Icons/ajouter.gif"
039.                            Visible='<%# Not (RgPanelSummary.MasterTableView.IsItemInserted OrElse RgPanelSummary.EditIndexes.Count > 0) %>'>
040.                            <Buttons>
041.                                <telerik:RadToolBarButton Text="Ajouter un plateau" ImageUrl="~/Web/Images/Icons/ress_locaux.gif"
042.                                    Group="LocationResource" CheckOnClick="true" AllowSelfUnCheck="true"
043.                                    CommandName="AddResource" CommandArgument="location">
044.                                </telerik:RadToolBarButton>
045.                                <telerik:RadToolBarButton Text="Ajouter un équipement" ImageUrl="~/Web/Images/Icons/ress_equipement.gif"
046.                                    Group="EquipementResource" Value="equipment" CommandName="AddResource" CommandArgument="equipment">
047.                                </telerik:RadToolBarButton>
048.                                <telerik:RadToolBarButton Text="Ajouter une ressource humaine" ImageUrl="~/Web/Images/Icons/ress_humaine.gif"
049.                                    Group="HumanResource" CommandName="AddResource" CommandArgument="human">
050.                                </telerik:RadToolBarButton>
051.
052.                                <telerik:RadToolBarButton IsSeparator="true" Visible="<%# KeyValueTools.GetActivitekRepentignyDev %>"></telerik:RadToolBarButton>
053.
054.                                <telerik:RadToolBarButton Text="Ajouter un équipement à la journée" ImageUrl="~/Web/Images/Icons/ress_equipement.gif"
055.                                    Group="DailyEquipment" CommandName="AddDailyResource" CommandArgument="DailyEquipment"
056.                                    Visible="<%# KeyValueTools.GetActivitekRepentignyDev %>">
057.                                </telerik:RadToolBarButton>
058.                            </Buttons>
059.                        </telerik:RadToolBarDropDown>
060.
061.                    </Items>
062.                </telerik:RadToolBar>
063.            </div>
064.        </CommandItemTemplate>
065.
066.        <%--Déclaration des colonnes pour l'entité PARENT --%>
067.        <Columns>
068.            <telerik:GridClientSelectColumn UniqueName="IsSelected" HeaderStyle-Width="28" ItemStyle-HorizontalAlign="Center" />
069.
070.            <telerik:GridBoundColumn UniqueName="ParentReservationScheduleID" DataField="ParentReservationScheduleID" Display="false" />
071.            <telerik:GridBoundColumn UniqueName="ReservationScheduleID" DataField="ReservationScheduleID" Display="false" />
072.
073.            <telerik:GridTemplateColumn UniqueName="ResourceName" DataField="ResourceName" HeaderText="<%$ Resources:AdminLoc,lblResource  %>">
074.                <ItemStyle Width="355px" />
075.                <HeaderStyle Width="355px" />
076.
077.                <ItemTemplate>
078.                    <%#DataBinder.Eval(Container.DataItem, "ResourceName")%>
079.                </ItemTemplate>
080.
081.                <EditItemTemplate>
082.                    <telerik:RadComboBox Skin="Bootstrap" ID="radResourceCombo" runat="server" Width="340px" DropDownWidth="450px" Height="300"
083.                        AutoPostBack="false" EnableLoadOnDemand="True" EnableScreenBoundaryDetection="true" EnableVirtualScrolling="true"
084.                        ItemsPerRequest="10" OnItemsRequested="radResourceCombo_ItemsRequested" HighlightTemplatedItems="true"
085.                        DataTextField="Text" DataValueField="Value" ExpandDirection="Down" OffsetX="0" OffsetY="0">
086.                        <HeaderTemplate>
087.                            <table id="tableResourceColumns" style="width: 95%">
088.                                <tr>
089.                                    <th>
090.                                        <asp:Label ID="radTitleLN" runat="server"><%= LocalizationTools.RM.GetString("lblName") %></asp:Label>
091.                                    </th>
092.                                </tr>
093.                            </table>
094.                        </HeaderTemplate>
095.                        <ItemTemplate>
096.                            <table style="width: 95%">
097.                                <tr>
098.                                    <td style="width: 18px">
099.                                        <img src="<%# DataBinder.Eval(Container, "Attributes['typeImg']")%>"
100.                                            title="<%# DataBinder.Eval(Container, "Attributes['typeName']")%>" /></td>
101.                                    <td><%# DataBinder.Eval(Container, "Attributes['name']")%></td>
102.                                </tr>
103.                            </table>
104.                        </ItemTemplate>
105.                    </telerik:RadComboBox>
106.
107.                    <asp:RequiredFieldValidator ID="CV_ResourceValidator" runat="server" ControlToValidate="radResourceCombo"
108.                        ErrorMessage="<%$ Resources:AdminLoc, errResourceIsMandatory %>"
109.                        Display="None">*</asp:RequiredFieldValidator>
110.                    <asp:CustomValidator ID="CV_Schedule" runat="server" OnServerValidate="CV_ReservationSchedule_ServerValidate"
111.                        Display="None">*</asp:CustomValidator>
112.                </EditItemTemplate>
113.            </telerik:GridTemplateColumn>
114.
115.        </Columns>
116.
117.
118.        <%--Déclaration des colonnes pour l'entité ENFANT --%>
119.        <DetailTables>
120.            <telerik:GridTableView DataKeyNames="ReservationScheduleID" Name="ChildReservationSchedule" Width="100%" HierarchyLoadMode="ServerOnDemand"
121.                ClientDataKeyNames="ReservationScheduleID" ShowHeader="false" ShowHeadersWhenNoRecords="false" CommandItemDisplay="Top"
122.                HorizontalAlign="Right" TableLayout="Fixed" AllowPaging="false" EditMode="InPlace" GroupLoadMode="Client" GridLines="None">
123.                <CommandItemTemplate>
124.                    <div>
125.                        <telerik:RadToolBar ID="RadToolBarGridChildEdit" runat="server" Width="100%" Height="32px"
126.                            OnClientButtonClicked="onPanelBarItemClicked">
127.                            <Items>
128.                                <telerik:RadToolBarButton Text="<%$ Resources:AdminLoc, btnEdit %>" ImageUrl="~/Web/Images/Icons/modifier.gif"
129.                                    Value="btnAdd" CommandName="EditSelected" ImagePosition="Left"
130.                                    Visible='<%# Not (RgPanelSummary.MasterTableView.IsItemInserted OrElse RgPanelSummary.EditIndexes.Count > 0) %>'>
131.                                </telerik:RadToolBarButton>
132.
133.                                <telerik:RadToolBarDropDown Text="<%$ Resources:AdminLoc, btnAdd %>" ImageUrl="~/Web/Images/Icons/ajouter.gif"
134.                                    Visible='<%# Not (RgPanelSummary.MasterTableView.IsItemInserted OrElse RgPanelSummary.EditIndexes.Count > 0) %>'>
135.                                    <Buttons>
136.                                        <%--TODO: Traduction--%>
137.                                        <telerik:RadToolBarButton Text="Ajouter un équipement" ImageUrl="~/Web/Images/Icons/ress_equipement.gif"
138.                                            Group="EquipementResource" Value="equipment" CommandName="InitInsert" CommandArgument="equipment">
139.                                        </telerik:RadToolBarButton>
140.                                        <telerik:RadToolBarButton Text="Ajouter une ressource humaine" ImageUrl="~/Web/Images/Icons/ress_humaine.gif"
141.                                            Group="HumanResource" CommandName="AddChildResource" CommandArgument="human">
142.                                        </telerik:RadToolBarButton>
143.
144.                                        <telerik:RadToolBarButton IsSeparator="true" Visible="<%# KeyValueTools.GetActivitekRepentignyDev %>"></telerik:RadToolBarButton>
145.
146.                                        <telerik:RadToolBarButton Text="Ajouter un équipement à la journée" ImageUrl="~/Web/Images/Icons/ress_equipement.gif"
147.                                            Group="DailyEquipment" CommandName="AddChildDailyResource" CommandArgument="DailyEquipment"
148.                                            Visible="<%# KeyValueTools.GetActivitekRepentignyDev %>">
149.                                        </telerik:RadToolBarButton>
150.                                    </Buttons>
151.                                </telerik:RadToolBarDropDown>
152.
153.                            </Items>
154.                        </telerik:RadToolBar>
155.                    </div>
156.                </CommandItemTemplate>
157.
158.                <Columns>
159.                    <telerik:GridClientSelectColumn UniqueName="IsSelected" HeaderStyle-Width="28" ItemStyle-Width="28" ItemStyle-HorizontalAlign="Center" />
160.                    <telerik:GridBoundColumn UniqueName="ParentReservationScheduleID" DataField="ParentReservationScheduleID" Display="false" />
161.                    <telerik:GridBoundColumn UniqueName="ReservationScheduleID" DataField="ReservationScheduleID" Display="false" />
162.
163.                    <telerik:GridTemplateColumn UniqueName="ResourceName" DataField="ResourceName" HeaderText="<%$ Resources:AdminLoc,lblResource  %>">
164.                        <ItemStyle Width="355" />
165.                        <HeaderStyle Width="355" />
166.
167.                        <ItemTemplate>
168.                            <%#DataBinder.Eval(Container.DataItem, "ResourceName")%>
169.                        </ItemTemplate>
170.
171.                        <EditItemTemplate>
172.                            <telerik:RadComboBox Skin="Bootstrap" ID="radResourceCombo" runat="server" Width="340px" DropDownWidth="450px" Height="300"
173.                                AutoPostBack="false" EnableLoadOnDemand="True" EnableScreenBoundaryDetection="true" EnableVirtualScrolling="true"
174.                                ItemsPerRequest="10" OnItemsRequested="radResourceCombo_ItemsRequested" HighlightTemplatedItems="true"
175.                                DataTextField="Text" DataValueField="Value" ExpandDirection="Down" OffsetX="0" OffsetY="0">
176.                                <HeaderTemplate>
177.                                    <table id="tableResourceColumns" style="width: 95%">
178.                                        <tr>
179.                                            <th>
180.                                                <asp:Label ID="radTitleLN" runat="server"><%= LocalizationTools.RM.GetString("lblName") %></asp:Label>
181.                                            </th>
182.                                        </tr>
183.                                    </table>
184.                                </HeaderTemplate>
185.                                <ItemTemplate>
186.                                    <table style="width: 95%">
187.                                        <tr>
188.                                            <td style="width: 18px">
189.                                                <img src="<%# DataBinder.Eval(Container, "Attributes['typeImg']")%>"
190.                                                    title="<%# DataBinder.Eval(Container, "Attributes['typeName']")%>" /></td>
191.                                            <td><%# DataBinder.Eval(Container, "Attributes['name']")%></td>
192.                                        </tr>
193.                                    </table>
194.                                </ItemTemplate>
195.                            </telerik:RadComboBox>
196.
197.                            <asp:RequiredFieldValidator ID="CV_ResourceValidator" runat="server" ControlToValidate="radResourceCombo"
198.                                ErrorMessage="<%$ Resources:AdminLoc, errResourceIsMandatory %>" Display="None">*</asp:RequiredFieldValidator>
199.                            <asp:CustomValidator ID="CV_Schedule" runat="server" OnServerValidate="CV_ReservationSchedule_ServerValidate" Display="None">*</asp:CustomValidator>
200.                        </EditItemTemplate>
201.                    </telerik:GridTemplateColumn>
202.
203.                </Columns>
204.            </telerik:GridTableView>
205.        </DetailTables>
206.    </MasterTableView>
207.
208.</telerik:RadGrid>

[Attila Antal]

Hi Mathieu,

I assume that you would like to get reference to the TableView to which the CommandItemTemplate belongs and fireCommand for it. If that is the case, you can get the TableView as a parent as follows:

function onPanelBarItemClicked(sender, args) {
    var button = args.get_item();
    var tableView = sender.get_parent();
    switch (args.get_item().get_commandName()) {
        case "AddResource":
            var argument = args.get_item().get_commandArgument();
            tableView.fireCommand("InitInsert", argument);
            break;
    }
}

This will fire the command for the DetailTable the Toolbar is located in.

I hope this will prove helpful.

Kind regards,
Attila Antal
Progress Telerik

[MathieuB]

Hi Mr Antal.

     

[MathieuB]

Hi Mr Antal,

                  Thank you for this answer. My InitInsert is now working.

 

Small question do you believe one day implement the possibility of passing arguments to InitInsert? Without having to go through a HiddenField or other.

 

Thank you so much

[Attila Antal]

Hi Mathieu,

Initially the fireCommand method was designed to make RadGrid fire specific commands and the minimum requirement for its usage is only passing the command name without any arguments (empty string). If, however, the developer would like to, he could supply with custom arguments of his choice. I am afraid this method will not be changed to meet one requirement as it could break the logic of many other developers who are using the method as is now.

Kind regards,
Attila Antal
Progress Telerik

[MathieuB]

Hi Mr Antal,

                    Indeed, this method seems to have been forgotten and I'm agree that for old project it could happen that it causes problems. Although normal I guess they not handle the CommandArgs in the InitInsert CommandItem (server-side).

Thank you for your help and good day to you

[Attila Antal]

Hi Mathieu,

Initinsert usually tells the grid to render an insert item from scratch which does not need any parameters. Same is with the PerformInsert, it will insert the data present in the insert item. However, if the developer would like to pass additional parameters to the grid, he could use the second slot to pass custom parameters.

Should you require further assistance, please let us know.

Good day to you too!

Kind regards,
Attila Antal
Progress Telerik