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

NestedViewTemplate Disabling Postbacks

17 Answers 164 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Moon
Top achievements
Rank 2
Moon asked on 21 Oct 2009, 05:29 PM
I have a radgrid with a NestedViewTemplate which contains a custom user control, which contains another grid.

I have turned off all click events on the nested grid, but still when I click anywhere on the nested grid, it still runs the grd_Init and reinitializes everything.

I want it to just sit there and do absolutely nothing if someone clicks the child grid. My NestedView is setup like so. Keep in mind, I do all my databinding and initialization and everything else in the code behind.

<telerik:RadGrid ID="grdComponent" runat="server">  
         <MasterTableView GroupLoadMode="Server">  
               <NestedViewTemplate> 
                   <uc:ReviewerGrid ID="ReviewerGrid" runat="server" ReviewId='<%# Eval("ReviewId") %>' /> 
               </NestedViewTemplate> 
            <DetailTables> 
            </DetailTables> 
           </MasterTableView> 
</telerik:RadGrid> 

For my child grid, I specifically set these commands on my grid init, so I thought this should take care of any clicks, but it doesn't.
            With grdReviewer  
 
                .ClientSettings.EnablePostBackOnRowClick = False 
                .AllowSorting = False 
                .ClientSettings.Selecting.AllowRowSelect = False 
 
            End With 

I still need the parent row to have the click event, just not the embedded grid.

Any ideas?

thanks.

17 Answers, 1 is accepted

Sort by
0
Iana Tsolova
Telerik team
answered on 22 Oct 2009, 10:18 AM
Hi Moon,

Please find the answer to your questions in the other thread you opened on the same subject.

Regards,
Iana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Karim
Top achievements
Rank 1
answered on 30 Oct 2009, 12:32 AM
I am having the same issue. Could you please post the link to the other thread that you mention, the one that answers the question? I searched for the other thread, but was unable to find it.

Thanks.
0
Iana Tsolova
Telerik team
answered on 03 Nov 2009, 01:12 PM
Hello Karim,

You can download the sample I prepared for Nannette in the mentioned thread from here. However, I was not able to replicate the issue there. Check it out and let me know what differs in your case.

Kind regards,
Iana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Karim
Top achievements
Rank 1
answered on 04 Nov 2009, 05:22 PM
Hello Iana,

I don't know what the other thread is, so I can't tell you how my problem differs. Also, the provided solution didn't seem to work in my case. My problem is very similar to Moon's problem (mentioned above) or the problem posted at http://www.telerik.com/community/forums/aspnet-ajax/grid/itemcommand-of-nested-grid.aspx

Basically, I have a radgrid with its EnablePostBackOnRowClick and AllowRowSelect properties set to true. This grid has a nested view template, which contains another grid. The inner grid's EnablePostBackOnRowClick and AllowRowSelect properties are set to false. The inner grid also has an Edit column. The postbacks from this Edit column work correctly.

Here's an example of the markup:
<radgrid id="outerGrid" OnItemCommand="outerGrid_ItemCommand" ...> 
    <ClientSettings EnablePostBackOnRowClick="true"
        <Selecting AllowRowSelect="true" /> 
    </ClientSettings> 
    <MasterTableView> 
        <NestedViewTemplate> 
            <radgrid id="innerGrid" ...> 
                <ClientSettings EnablePostBackOnRowClick="false"
                    <Selecting AllowRowSelect="false" /> 
                </ClientSettings> 
                <MasterTableView> 
                    <GridEditCommandColumn ... /> 
                </MasterTableView> 
            </radgrid> 
        </NestedViewTemplate> 
    </MasterTableView> 
</radgrid> 
 


The problem is that when I click on a row in the inner grid, several things happen:
  • The page posts back. It actually should not post back since the PostBack and RowSelect properties for this inner grid are set to false.
  • On the postback, the ItemCommand event handler for the outer grid is called. Why is an event on the inner grid calling the event handler of the outer grid?
  • After the postback, the outer grid's expanded row is collapsed (and so the nested view and inner grid is hidden again). Additionally, a random row on the outer grid is selected. What I believe is going on is that the when you click on a row on the inner grid, it takes that selected index and applies it to the outer grid. So if you clicked the third row in the inner grid, then after the postback, the third row will be selected on the outer grid.

Clearly, this is incorrect behavior. It seems like the entire nested view template is just being treated like an expansion of the parent row and the properties set on the controls inside the template are not being respected properly. Is there a way to get around/fix these issues?

Thanks.
0
Iana Tsolova
Telerik team
answered on 05 Nov 2009, 12:26 PM
Hello Karim,

In order to overcome the described behavior, I suggest that you handle the inner grid OnRowClick client-side event as shown below:

<ClientSettings>
    <ClientEvents OnRowClick="innerRowClick" />
</ClientSettings>
<script type="text/javascript">
    function innerRowClick(sender, eventArgs) {
        eventArgs.get_domEvent().preventDefault();
        eventArgs.get_domEvent().stopPropagation();
    }
</script>

I hope this works for you.

Sincerely yours,
Iana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Karim
Top achievements
Rank 1
answered on 06 Nov 2009, 04:44 AM
Thanks, Iana. That worked. Hopefully, in future releases, this will be fixed in the grid itself so that such 'intercepting' functions are not required.

Thanks.
0
Luke
Top achievements
Rank 1
answered on 12 Nov 2009, 10:53 AM
Hi! I got the same issue, but the solution shown above seems to not work for the GridTemplateColumn.

This is my problem: I set the attribute EnablePostBackOnRowClick on true in ClientSettings of RadGrid, then I had to create a GridTemplateColumn with ItemTemplate and EditTemplate. Finally inside ItemTemplate I got asp:buttons, but every time I try to click on them, the row-click event is fired and I'm not able to stop the propagation of the event. I tried your method using javascript, but nothing changes.

Any advice?
0
Iana Tsolova
Telerik team
answered on 16 Nov 2009, 11:30 AM
Hello Luke,

Could you please try setting the CommandName property of the BUtton to a value different than "RowClick" and see if it makes any difference?

Sincerely yours,
Iana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Prateek
Top achievements
Rank 1
answered on 16 Oct 2014, 01:31 PM
Hello!!

I Have also this problem. i have a nested radgrid inside a RadPageView of RadMultiPage  of radtabstrip. RadtabStrip is inside parent RadGrid.
I want to fire ItemCommand of Nested RadGrid when click on Row and on CommandItem of Nested RadGrid. RowClick and EveryThing is working fine when clicking on Row of Parent Grid. But The Problem is that Nested RdGrid is not working On RowClick and MouseHover and anyThing else..                                                              I am using seperate OnItemCommand for Both grid. 'EnablePostBackOnRowClick="true" ' is for both grids. And Nested Grid is also have RadContextMenu and OnRowDrop that is not working.... One Another Thing is that I am opening Different RadWindow on RowClick of Nested Grid in Different Conditions. ..... Any Help Will be Appreciated..   Thanks...
0
Kostadin
Telerik team
answered on 21 Oct 2014, 08:39 AM
Hi Prateek,

Could you please provide a small runnable sample where the issue could be observe in order to investigate it further? Meanwhile could you please verify that a postback occurs when you click some of the inner grid's row.

Regards,
Kostadin
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Prateek
Top achievements
Rank 1
answered on 22 Oct 2014, 07:15 AM
Hi Kostadin,
Nothing happen when click on inner grid.....
my sample project is same as given project in this ticket....

Thanks!!!!
0
Kostadin
Telerik team
answered on 24 Oct 2014, 01:15 PM
Hello Prateek,

In case you need to fire the ItemCommand on row click then you have to enable EnablePostBackOnRowClick property. Here I attached a small sample based on the previously provided code which demonstrates that on my side it works correctly.

Regards,
Kostadin
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Prateek
Top achievements
Rank 1
answered on 06 Nov 2014, 07:26 AM
Hi! Kostadin,

You havn't fire ItemCommand for Both Grid inner and outer as well.
In my Situation both grid should fire itemCommand. And I have already enabled EnablePostBackOnRowClick property of both grids. So Plz send me a sample in which both grid are working well with their ItemCommand Event..... Thanks!!!!

0
Prateek
Top achievements
Rank 1
answered on 06 Nov 2014, 08:30 AM
Hi Kostadin

My page Demo is something like this.
This page is content page of a master page.
Plz take a look at this..

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="NestedViewTemplateGrid.aspx.cs"
    Inherits="RadGrid_Hierarchy_NestedViewTemplateGrid" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <scripts>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
            </scripts>
    </telerik:RadScriptManager>
    <script type="text/javascript">
        //Put your JavaScript code here.
        </script>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <telerik:RadGrid ID="outerGrid" Width="100%" AllowSorting="True" runat="server" GridLines="both"
        AutoGenerateColumns="False" CellSpacing="0" ShowFooter="True" PageSize="10" Skin="Sunset"
        OnItemCommand="outerGrid_ItemCommand" AllowPaging="True" OnNeedDataSource="outerGrid_NeedDataSource"
        OnItemDataBound="outerGrid_ItemDataBound">
        <clientsettings enablepostbackonrowclick="true">
                <Selecting AllowRowSelect="true" />
            </clientsettings>
        <mastertableview width="100%" datakeynames="IDL" groupsdefaultexpanded="true" grouploadmode="Client"
            showheaderswhennorecords="true" editmode="InPlace">
            <column>
            // my column are here...
            </column>
                <NestedViewTemplate>
                <asp:Panel ID="NestedViewPanel" runat="server">
                <telerik:RadTabStrip runat="server" ID="RadTabStrip1" MultiPageID="RadMultiPage1"
                                            Skin="Default" SelectedIndex="1" OnTabClick="RadTabStrip1_TabClick">
                                            <Tabs>
                                                <telerik:RadTab Text="Order" Font-Bold="true" Font-Size="14px" ForeColor="Black"
                                                    Selected="True">
                                                </telerik:RadTab>
                                                <telerik:RadTab Text="Notification" Font-Bold="true" Font-Size="14px" ForeColor="Black">
                                                </telerik:RadTab>
                                                </Tabs>
                                                </telerik:RadTabStrip>
                                                <telerik:RadMultiPage runat="server" ID="RadMultiPage1" SelectedIndex="0" CssClass="innerMultiPage">
                                            <telerik:RadPageView runat="server" ID="PageView1">
                                             <telerik:RadGrid ID="innerGrid" OnNeedDataSource="innerGrid_NeedDataSource" OnItemCommand="innerGrid_ItemCommand" runat="server" AutoGenerateColumns="false" AllowPaging="True"
                AllowSorting="True" OnItemDataBound="innerGrid_ItemDataBound"
                Skin="Sunset" OnRowDrop="innerGrid_RowDrop">

                        <ClientSettings ReorderColumnsOnClient="True" AllowDragToGroup="True" AllowColumnsReorder="True"
                    AllowRowsDragDrop="true" EnablePostBackOnRowClick="true">
                    <Selecting AllowRowSelect="True" EnableDragToSelectRows="false"></Selecting>
                    <Resizing ResizeGridOnColumnResize="True" AllowColumnResize="True"></Resizing>
                    <ClientEvents OnRowDropping="onRowDropping" OnRowContextMenu="RowContextMenu1"></ClientEvents>
                </ClientSettings>

                        <MasterTableView DataKeyNames="ID" Width="100%" CommandItemDisplay="Top" GroupsDefaultExpanded="true"
                    GroupLoadMode="Client" EditMode="EditForms" AllowAutomaticDeletes="true" AllowAutomaticInserts="true"
                    AllowAutomaticUpdates="true">
                    <column>
                    // my column are here....
                    </column>
                    <EditFormSettings UserControlName="AddNew.ascx" EditFormType="WebUserControl">
                        <EditColumn UniqueName="EditCommandColumn1">
                        </EditColumn>
                    </EditFormSettings>
                    </MasterTableView>
                    </telerik:RadGrid>
                                            </telerik:RadPageView>
                                            </telerik:RadMultiPage>
                   
                    </asp:Panel>
                </NestedViewTemplate>
            </mastertableview>
    </telerik:RadGrid>
    <telerik:RadContextMenu ID="RadContextMenu_GrdLoadEquip" runat="server" EnableRoundedCorners="true"
        EnableShadows="true" Skin="Sunset" OnItemClick="RadContextMenu_GrdLoadEquip_ItemClick">
        <items>
                    <telerik:RadMenuItem Text="Add  Here">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem Text="Add  Below">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem Text="Delete ">
                    </telerik:RadMenuItem>
                    <telerik:RadMenuItem Text="Update " Enabled="false">
                    </telerik:RadMenuItem>
                </items>
    </telerik:RadContextMenu>
    </form>
</body>
</html>



Thanks.....
0
Kostadin
Telerik team
answered on 10 Nov 2014, 01:59 PM
Hello Prateek,

In the previously provided sample you can notice that after clicking the row the appropriate ItemCommand event handler is fired. For instance if you click a row of the outer grid it will fire its ItemCommand event handler. On the other hand if you click an item of the inner grid it will fire its ItemCommand event. Keep in mind that you cannot click the inner grid item and fire the outer grid ItemCommand event handler or vice versa.

Regards,
Kostadin
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Prateek
Top achievements
Rank 1
answered on 14 Nov 2014, 07:49 AM
Hi Kostadin,

Inner grid itemCommand event is not firing on rowclick at my end...


0
Kostadin
Telerik team
answered on 18 Nov 2014, 02:36 PM
Hi Prateek,

I attached a modified sample where I enabled the postback on row click. After you expand some of the MasterTableView items and click on an item of the detail table view you will noticed that ItemCommand is fired for the inner grid. Please give it a try and let me know how it differs from your real setup.

Regards,
Kostadin
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Grid
Asked by
Moon
Top achievements
Rank 2
Answers by
Iana Tsolova
Telerik team
Karim
Top achievements
Rank 1
Luke
Top achievements
Rank 1
Prateek
Top achievements
Rank 1
Kostadin
Telerik team
Share this question
or