This is a migrated thread and some comments may be shown as answers.

Editing MasterView and DetailView with nested Grids

2 Answers 37 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
VNet asked on 08 Dec 2016, 08:06 PM

Hi I have a bit of a problem, I have created a RadGrid with a masterView that displays initial info about a product, the grid has a Detail View which is another grid of SubItems that belong to each product.

I wan to be able to Edit the details of the Main Product as well as I also want to be able to edit Details of a SubItem (Not at the same time) , so I added an Edit Form to the MasterView and one to the DetailView, logically if I click the edit button on the masterview level product, the Grid should go to edit mode and bring up the MasterView.EditForm and the same with SubItem.Ediform when edit button clicked.

When I click the edit button the Grid goes blank, ALL items disappear and I just end up with a line on the screen.

I think I have the Grid setup correctly, where am I going wrong? Can you not have an EditFormTemplate when you use a DetailView?

Here is my example. I am not using DataSourceID="SqlDataSource" in the aspx page, I do all my data binding in cs.code. I am not using Bound Data Fields, I use <ItemTemplate> with custom Labels.

I would appreciate some help or a point in the right direction.

Thanks in advance :)


01.<telerik:RadGrid ID="OPVRCommitGrid" runat="server" AutoGenerateColumns="false" MasterTableView-HierarchyLoadMode="Client" AllowSorting="True" ShowFooter="false" AllowPaging="false" PageSize="25">
02.        <MasterTableView CommandItemDisplay="None" EditMode="EditForms" DataKeyNames="ProductID" ShowGroupFooter="false" Name="OVPRList">
03.            <Columns>
04.                <telerik:GridTemplateColumn HeaderText="ID" SortExpression="ProductID" HeaderButtonType="TextButton" UniqueName="PCol">
05.                    <ItemTemplate>
06.                        <asp:Label ID="ProductID" runat="server" Text='<%# Eval("ProductID") %>' />
07.                    </ItemTemplate>
08.                </telerik:GridTemplateColumn>
09.                <telerik:GridTemplateColumn HeaderText="Product" SortExpression="ProductName" HeaderButtonType="TextButton" UniqueName="PCol">
10.                    <ItemTemplate>
11.                        <asp:Label ID="Product" runat="server" Text='<%# Eval("ProductName") %>' />
12.                    </ItemTemplate>
13.                </telerik:GridTemplateColumn>
14.                <telerik:GridTemplateColumn UniqueName="editControls">
15.                    <ItemTemplate>
16.                        <asp:ImageButton ID="editBtn" runat="server" ImageUrl="~/_system/_img/icons/edit2.png" CausesValidation="False" CommandName="Edit" CommandArgument="Edit" ToolTip="Edit" />
17.                    </ItemTemplate>
18.                </telerik:GridTemplateColumn>
19.            </Columns>
21.            <EditFormSettings EditFormType="Template">
22.                <FormTemplate>
23.                    MasterTableView EidtForm
24.                </FormTemplate>
25.            </EditFormSettings>
27.            <DetailTables>
28.                <telerik:GridTableView DataKeyNames="ProjectID" runat="server" EditMode="EditForms" CommandItemDisplay="None" Name="Commitment">
29.                    <Columns>
30.                        <telerik:GridTemplateColumn HeaderText="SubItem" SortExpression="SubItem" HeaderButtonType="TextButton">
31.                            <ItemTemplate>
32.                                SubItem Feature
33.                            </ItemTemplate>
34.                        </telerik:GridTemplateColumn>
35.                        <telerik:GridTemplateColumn UniqueName="editControls">
36.                            <ItemTemplate>
37.                                <asp:ImageButton ID="editBtn" runat="server" ImageUrl="~/_system/_img/icons/edit2.png" CausesValidation="False" CommandName="Edit" CommandArgument="Edit" ToolTip="Edit" />
38.                            </ItemTemplate>
39.                        </telerik:GridTemplateColumn>
40.                    </Columns>
42.                    <EditFormSettings EditFormType="Template">
43.                        <FormTemplate>
44.                            DetailView EidtForm
45.                        </FormTemplate>
46.                    </EditFormSettings>
47.                </telerik:GridTableView>
48.            </DetailTables>
49.    </MasterTableView>

2 Answers, 1 is accepted

Sort by
Telerik team
answered on 13 Dec 2016, 04:22 PM

Could you specify how is the grid populated? Are you using simple data binding calling DataBind() or you are using Advanced binding through NeedDataSource? Keep in mind that hierarchy grid structure  is not supported with simple data-binding, therefore if this is the case please switch to advanced binding as shown in the demo below and let me know about the result:

Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Top achievements
Rank 1
answered on 13 Dec 2016, 04:46 PM

Well I resolved the issue I was having, I had to rework my Grid a bit. The problem was the binding call, I was calling bind every time OnItemCommand but I realized that if you call Bind after you send "ExpandCollapse" command, then the item will not expand. I just used and switch case and only call bind when it is not "ExpandCollapse".

Thank you for your help.

Asked by
Top achievements
Rank 1
Answers by
Telerik team
Top achievements
Rank 1
Share this question