Reference NestedViewTemplate control value.

[Jon Adkins]

Is there any way to reference a NestedViewTemplate control value. I have a label and a text box within the NestedViewTemplate that i would like to perform other operations on. Is this currently possible. Any help would be greatly appreciated.

[Princy]

Hello Jon,

You can access the NestedView controls as shown in the code below:
aspx:

<telerik:RadGrid DataSourceID="SqlDataSource1" ID="RadGrid1" runat="server"  OnItemDataBound="RadGrid1_ItemDataBound">
     <MasterTableView DataSourceID="SqlDataSource1">
        <NestedViewTemplate>
            <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
          .....
        </NestedViewTemplate>

c#:

  protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
    {
        if (e.Item is GridNestedViewItem)
        {
            GridNestedViewItem nestedview = (GridNestedViewItem)e.Item;
            Label lbl = (Label)nestedview.FindControl("Label1");
            TextBox txtbx = (TextBox)nestedview.FindControl("TextBox1");
            // perform operations
        }
    }

Thanks
Princy.

[Jon Adkins]

Is it possible to access these controls on a button click inside the nestedviewtemplate instead of on the databound event? I should have been more clear. I apologize.

[Jon Adkins]

Here is the code in vb.net in case anybody needs it. I should have thought of this. I just translated the code above into vb.net and place it in the ItemCommand event handler and it worked like a charm. I also have two buttons in the NestedViewTemplate. Is it possible to distinguish which button sent the command? Thanks for the help so far.

 

 

 

	Private Sub RadGrid1_ItemCommand(ByVal source As Object, ByVal e As Telerik.Web.UI.GridCommandEventArgs) Handles RadGrid1.ItemCommand
	Try
	Dim nestedview As GridNestedViewItem = DirectCast(e.Item, GridNestedViewItem)
	Dim lbl As Label = DirectCast(nestedview.FindControl("Label1"), Label)
	SomeLabel.Text = lbl.Text
	Catch ex As Exception
	'Error catching goes here.
	End Try
	End Sub

 

 

 

 

 

[Jon Adkins]

Here is the answer to my question. Thanks Princy for the help in getting me started.

Try

            Dim nestedview As GridNestedViewItem = DirectCast(e.Item, GridNestedViewItem)
            Dim lbl As Label = DirectCast(nestedview.FindControl("Label1"), Label)

            'Assign a command name to your button in the properties page for the button you created.
            'You can then reference the button's commandname using e.commandname.
            Select Case e.CommandName
                Case "Button1"
                    Label3.Text = "You clicked button1 inside the grid!"
                Case "Button2"
                    Label3.Text = "You clicked button2 inside the grid!"
            End Select


        Catch ex As Exception
            'Any error catching code goes here.
        End Try

[David Simmonds]

I have a nested rad grid. When I right-click one of the nested rad grid cell items, I present a context menu. This works fine. But when I click on one of the menu items and the handler is called for it, I need to get access to the nested grid control. How can I do this?

[Daniel]

Hello David,

Please download the attached project and let me know if you need more information. Note that the item should be expanded in order to access the nested control.

Best regards,
Daniel
the Telerik team

[David Simmonds]

How can I do the same from server code? When the menu item is clicked, I have a handler in server code for the ItemClick event.

[Daniel]

Hello David,

There is no server-side-only way to achieve this. It is possible, however to use a combination between server-side and client-side code if this is suitable for your scenario:

<telerik:RadContextMenu ID="RadContextMenu1" runat="server" OnClientItemClicked="findGrid">
    <Items>
        <telerik:RadMenuItem Text="Find the nested RadGrid" />
    </Items>
</telerik:RadContextMenu>
<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1" OnItemCommand="RadGrid1_ItemCommand">
    <MasterTableView>
        <NestedViewTemplate>
            <telerik:RadGrid ID="RadGrid2" runat="server" DataSourceID="SqlDataSource1">
            </telerik:RadGrid>
        </NestedViewTemplate>
    </MasterTableView>
    <ClientSettings>
        <ClientEvents OnRowContextMenu="contextMenu" />
    </ClientSettings>
</telerik:RadGrid>

<script type="text/javascript">
    function contextMenu(sender, args)
    {
        $find('<%= RadContextMenu1.ClientID %>').show(args.get_domEvent());
    }

    function findGrid(sender, args)
    {
        var masterGrid = $find('<%= RadGrid1.ClientID %>');
        var itemIndex = args.get_targetElement().parentNode.id.split("__")[1];
        masterGrid.get_masterTableView().fireCommand("MyCommand", itemIndex);
    }
</script>

protected void RadGrid1_ItemCommand(object source, GridCommandEventArgs e)
{
    if (e.CommandName == "MyCommand")
    {
        int itemIndex = int.Parse(e.CommandArgument.ToString());
        GridDataItem item = e.Item.OwnerTableView.Items[itemIndex];
        if (item.Expanded)
        {
            item.BackColor = System.Drawing.Color.Red;
            RadGrid RadGrid2 = item.ChildItem.FindControl("RadGrid2") as RadGrid;
            RadGrid2.BackColor = System.Drawing.Color.Blue;
        }
    }
}

Regards,
Daniel
the Telerik team

[David Simmonds]

Ok, almost there. I need to know the value of the menu item that was clicked. I could use that as the command for the fireCommand method to the grid. How do I get the value of the menu item clicked?

[David Simmonds]

I have this code:

function RadContextMenu_ItemClicked(sender, eventArgs) {
    var masterGrid = $find('<%= RadGridDNCLetters.ClientID %>');
    var item = eventArgs.get_item();
    var value = item.get_value();
    var itemIndex = eventArgs.get_targetElement().parentNode.id.split("__")[1];
    masterGrid.get_masterTableView().fireCommand("ContextMenuItemClicked", itemIndex + "|" + value);
    return false;
}

value is the correct menu item value. However, itemIndex is undefined. So why does this not work?

Here is the whole deal:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="DoNotCallLetters.ascx.cs" Inherits="CharityCheck.Admin.MessagesControls.DoNotCallLetters" %>
<%@ Register Assembly="Infragistics35.Web.v10.2, Version=10.2.20102.2018, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" namespace="Infragistics.Web.UI.LayoutControls" tagprefix="ig" %>
<%@ Register Assembly="Infragistics35.WebUI.UltraWebNavigator.v10.2, Version=10.2.20102.2018, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" namespace="Infragistics.WebUI.UltraWebNavigator" tagprefix="ignav" %>
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
<%@ Register Assembly="Infragistics35.WebUI.WebDataInput.v10.2, Version=10.2.20102.2018, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" namespace="Infragistics.WebUI.WebDataInput" tagprefix="igtxt" %>
<%@ Register Assembly="Infragistics35.Web.v10.2, Version=10.2.20102.2018, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" Namespace="Infragistics.Web.UI.EditorControls" tagprefix="ig" %>

<telerik:RadCodeBlock ID="RadCodeBlock2" runat="server">
    <script type="text/javascript">
            <!--
        var gridDNC;
        var gridDNCLetters;
        function GetGridObject5(sender, eventArgs) {
            gridDNC = sender;
        }
        function GetGridObject6(sender, eventArgs) {
            gridDNCLetters = sender;
        }
        function RadGridDNCLetters_ConfirmCallBackFn(arg) {
            if (arg == true) {
                var ajaxManager = $find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>");
                ajaxManager.ajaxRequest("DeleteSelection");
            }
        }
        function RadGridDNCLetters_ColumnClick(sender, eventArgs) {
            var column = eventArgs.get_gridColumn();
            if (column.get_uniqueName() == "Delete") {
                var mastertable = sender.get_masterTableView();
                var selecteditems = mastertable.get_selectedItems();
                if (selecteditems.length > 0) {
                    radconfirm("Delete all of the selected items? Are you sure?", RadGridDNCLetters_ConfirmCallBackFn);
                }
            }
        }
        function RowContextMenu5(sender, eventArgs) {
            var menu1 = $find("<%= RadContextMenu1.ClientID %>");
            var menu2 = $find("<%= RadContextMenu2.ClientID %>");

            var domEvent = eventArgs.get_domEvent();
            var source = domEvent.target || domEvent.srcElement;
            var index = eventArgs.get_itemIndexHierarchical();
            var masterTable = sender.get_masterTableView();

            // clear all of the selections
            masterTable.clearSelectedItems();

            var cellIndex = domEvent.target.cellIndex;
            var DataItem = masterTable.get_dataItems()[index];
            var nMemberRequestedID = "0";

            //select the current row
            masterTable.selectItem(masterTable.get_dataItems()[index].get_element());
            if (domEvent.target.id.indexOf("LinkButtonMemberRequested") > 0 ||
                domEvent.target.id.indexOf("PanelLabel") > 0) {
                var columns = masterTable.get_columns();
                for (cellIndex = 0;
                     cellIndex != columns.length && columns[cellIndex].get_uniqueName() != "MemberRequested";
                     cellIndex++);
                var cell = DataItem.get_cell("MemberRequestedID");
                nMemberRequestedID = cell.outerText;
            }
            else if (domEvent.target.id.indexOf("LinkButtonCompany") > 0) {
                var columns = masterTable.get_columns();
                for (cellIndex = 0;
                     cellIndex != columns.length && columns[cellIndex].get_uniqueName() != "CompanyName";
                     cellIndex++);
            }
            if (cellIndex == null) {
                $telerik.cancelRawEvent(domEvent);
                return false;
            }

            var column = masterTable.get_columns()[cellIndex];
            var uniqueName = column.get_uniqueName();

            if (uniqueName == "CompanyName") {
                menu1.show(domEvent);
            }
            else if (uniqueName == "MemberRequested") {
                var item = menu2.findItemByValue("GIP");
                if (nMemberRequestedID == "0")
                    item.disable();
                else
                    item.enable();
                menu2.show(domEvent);
            }
            else {
                menu1.hide();
                menu2.hide();
                eventArgs.set_cancel(true);
                $telerik.cancelRawEvent(domEvent);
                return false;
            }
            $telerik.cancelRawEvent(domEvent);
        }
        function RadContextMenu_ItemClicked(sender, eventArgs) {
            var masterGrid = $find('<%= RadGridDNCLetters.ClientID %>');
            var item = eventArgs.get_item();
            var value = item.get_value();
            var itemIndex = eventArgs.get_targetElement().parentNode.id.split("__")[1];
            masterGrid.get_masterTableView().fireCommand("ContextMenuItemClicked", itemIndex + "|" + value);
            return false;
        }
        function RadGridDNC_OnCommand(sender, eventArgs) {
            var masterTable = sender.get_masterTableView();
            if (commandName == "PDF") {
                var row = eventArgs.get_commandArgument();
                var nID = masterTable.get_dataItems()[row].getDataKeyValue("ID");
                var commandName = eventArgs.get_commandName();
                var nMemberRequestedID = masterTable.get_dataItems()[row].getDataKeyValue("MemberRequestedID");
                var dtDateRequested = masterTable.get_dataItems()[row].getDataKeyValue("DateRequested");
                var wnd = window.radopen("/ShowDoNotCallLetterPDF.aspx?ID=" + nID +
                                            "&MemberRequestedID=" + nMemberRequestedID +
                                            "&DateRequested=" + dtDateRequested);
                eventArgs.set_cancel(true);
            }
        }
            -->
    </script>
</telerik:RadCodeBlock>
<asp:Panel ID="Panel1" runat="server">
    <asp:Label ID="labelHeading" runat="server" Text="Do Not Call Letters" Width="100%"  CssClass="labelCompanyName" />
    <telerik:RadMenu ID="RadMenu1" Runat="server" onitemclick="RadMenu1_ItemClick"  Width="100%">
        <Items>
            <telerik:RadMenuItem runat="server"
                DisabledImageUrl="~/Images/Back-16x16_disabled.png"
                ImageUrl="~/Images/Back-16x16.png" Text="Go back to Messages"
                ToolTip="Go back to main report list" Value="Back">
            </telerik:RadMenuItem>
        </Items>
    </telerik:RadMenu>
    <telerik:RadAjaxManagerProxy ID="RadAjaxManagerProxyDNC" runat="server" >
        <ajaxsettings>
            <telerik:AjaxSetting AjaxControlID="RadGridDNCLetters">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGridDNCLetters" />
                    <telerik:AjaxUpdatedControl ControlID="RadGridDNC" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RadGridDNC">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGridDNC" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </ajaxsettings>
    </telerik:RadAjaxManagerProxy>
    <telerik:RadGrid ID="RadGridDNCLetters" runat="server" allowpaging="True" PageSize="5" enablepostbackonrowclick="true"
                     datasourceid="LinqDataSourceDNCLetters" AllowMultiRowSelection="True"
                     gridlines="None" showfooter="True"
                     onitemcommand="RadGridDNCLetters_ItemCommand"
                     allowautomaticdeletes="True" autogeneratecolumns="False" >
        <MasterTableView DataKeyNames="ID,CompanyID,DateRequested" ClientDataKeyNames="ID,CompanyID,DateRequested"
                         TableLayout="Fixed" datasourceid="LinqDataSourceDNCLetters">
            <Columns>
                <telerik:GridClientSelectColumn UniqueName="ClientSelectColumn">
                    <ItemStyle HorizontalAlign="Center" />
                    <HeaderStyle Width="25px" HorizontalAlign="Center" />
                </telerik:GridClientSelectColumn>
                <telerik:GridButtonColumn ButtonType="ImageButton" CommandName="Details"
                    ImageUrl="~/Images/Profile-16x16.png" Text="Show details" UniqueName="Details">
                    <ItemStyle CssClass="MyImageButton" HorizontalAlign="Left" />
                    <HeaderStyle Width="25px" HorizontalAlign="Center" />
                </telerik:GridButtonColumn>
                <telerik:GridButtonColumn ButtonType="ImageButton" CommandName="Delete"
                    ConfirmDialogType="RadWindow" ConfirmText="Delete this item?"
                    ConfirmTitle="Delete" HeaderImageUrl="~/Images/Trash-16x16.gif"
                    ImageUrl="~/Images/Trash-16x16.gif" Text="Delete this item" UniqueName="Delete">
                    <HeaderStyle Width="25px" />
                    <ItemStyle CssClass="MyImageButton" HorizontalAlign="Center" />
                </telerik:GridButtonColumn>
                <telerik:GridTemplateColumn DataField="CompanyName" DefaultInsertValue=""
                    HeaderText="Organization" SortExpression="CompanyName" UniqueName="CompanyName">
                    <ItemTemplate>
                        <asp:LinkButton ID="LinkButtonCompany" runat="server" CommandName="CompanyName"><%# DataBinder.Eval(Container.DataItem, "CompanyName") %></asp:LinkButton>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
                <telerik:GridDateTimeColumn DataField="DateRequested" DefaultInsertValue=""
                    HeaderText="Date Requested" SortExpression="DateRequested"
                    DataFormatString="{0:d}"
                    UniqueName="DateRequested" >
                    <HeaderStyle Width="105px" />
                </telerik:GridDateTimeColumn>
                <telerik:GridBoundColumn DataField="Type" DefaultInsertValue="" Display="False"
                    HeaderText="Type" SortExpression="Type" UniqueName="Type">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="CompanyID" DataType="System.Int32"
                    DefaultInsertValue="" Display="False" HeaderText="CompanyID" ReadOnly="True"
                    SortExpression="CompanyID" UniqueName="CompanyID">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="ID" DataType="System.Int32"
                    DefaultInsertValue="" Display="False" HeaderText="ID" ReadOnly="True"
                    SortExpression="ID" UniqueName="ID">
                </telerik:GridBoundColumn>
            </Columns>
            <NestedViewSettings>
                <ParentTableRelation>
                    <telerik:GridRelationFields DetailKeyField="CompanyID" MasterKeyField="CompanyID" />
                </ParentTableRelation>
            </NestedViewSettings>
            <NestedViewTemplate>
                <telerik:RadGrid ID="RadGridDNC" runat="server" allowpaging="True"
                                 gridlines="None" showfooter="True"
                                 onitemcommand="RadGridDNC_ItemCommand"
                                 allowautomaticdeletes="True" autogeneratecolumns="False"
                                 onitemdatabound="RadGridDNC_ItemDataBound"
                                 onneeddatasource="RadGridDNC_NeedDataSource" >
                    <MasterTableView DataKeyNames="ID,MemberRequestedID,DateRequested" ClientDataKeyNames="ID,MemberRequestedID,DateRequested" TableLayout="Fixed">
                        <CommandItemSettings ExportToPdfText="Export to Pdf" />
                        <Columns>
                            <telerik:GridButtonColumn ButtonType="ImageButton" CommandName="PDF"
                                ImageUrl="~/Images/pdf-16x16.png" Text="Display the letter (pdf file)"
                                UniqueName="PDF">
                                <HeaderStyle Width="25px" />
                                <ItemStyle CssClass="MyImageButton" HorizontalAlign="Center" />
                            </telerik:GridButtonColumn>
                            <telerik:GridTemplateColumn DataField="CompanyName" DefaultInsertValue=""
                                HeaderText="Organization" SortExpression="CompanyName" UniqueName="CompanyName">
                                <ItemTemplate>
                                    <asp:LinkButton ID="LinkButtonCompany" runat="server" CommandName="CompanyName"><%# DataBinder.Eval(Container.DataItem, "CompanyName") %></asp:LinkButton>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                            <telerik:GridTemplateColumn DataField="MemberRequested" DefaultInsertValue=""
                                HeaderText="Member Requested" SortExpression="MemberRequested"
                                UniqueName="MemberRequested">
                                <ItemTemplate>
                                    <asp:Panel ID="PanelLink" runat="server">
                                        <asp:LinkButton ID="LinkButtonMemberRequested" runat="server" CommandName="MemberRequested"><%# DataBinder.Eval(Container.DataItem, "MemberRequested")%></asp:LinkButton>
                                    </asp:Panel>
                                    <asp:Panel ID="PanelLabel" runat="server" Visible="false">
                                        <%# DataBinder.Eval(Container.DataItem, "MemberRequested")%>
                                    </asp:Panel>
                                </ItemTemplate>
                            </telerik:GridTemplateColumn>
                            <telerik:GridBoundColumn DataField="DateRequested" DefaultInsertValue=""
                                HeaderText="Date Requested" SortExpression="DateRequested"
                                UniqueName="DateRequested">
                                <HeaderStyle HorizontalAlign="Center" Width="120px" />
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="MemberRequestedID" DataType="System.Int32"
                                DefaultInsertValue="" Display="False" EmptyDataText="0"
                                HeaderText="MemberRequestedID" ReadOnly="True"
                                SortExpression="MemberRequestedID" UniqueName="MemberRequestedID">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="Type" DefaultInsertValue="" Display="False"
                                HeaderText="Type" SortExpression="Type" UniqueName="Type">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="MemberType" DefaultInsertValue=""
                                Display="False" HeaderText="MemberType" SortExpression="MemberType"
                                UniqueName="MemberType">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn DataField="ID" DataType="System.Int32"
                                DefaultInsertValue="" Display="False" HeaderText="ID" ReadOnly="True"
                                SortExpression="ID" UniqueName="ID">
                            </telerik:GridBoundColumn>
                        </Columns>
                    </MasterTableView>
                    <ClientSettings>
                        <Selecting AllowRowSelect="true" />
                        <ClientEvents OnRowContextMenu="RowContextMenu5" OnGridCreated="GetGridObject5"
                                      OnCommand="RadGridDNC_OnCommand" />
                    </ClientSettings>
                </telerik:RadGrid>
            </NestedViewTemplate>
        </MasterTableView>
        <ClientSettings>
            <Selecting AllowRowSelect="true" />
            <ClientEvents OnRowContextMenu="RowContextMenu5" OnGridCreated="GetGridObject6" OnColumnClick="RadGridDNCLetters_ColumnClick" />
        </ClientSettings>
    </telerik:RadGrid>
    <telerik:RadContextMenu ID="RadContextMenu1" Runat="server"
         OnClientItemClicked="RadContextMenu_ItemClicked">
        <Items>
            <telerik:RadMenuItem runat="server" Text="Statistics..." Value="Statistics">
            </telerik:RadMenuItem>
            <telerik:RadMenuItem runat="server" Text="General Information Page..."
                Value="GIP" ImageUrl="/Images/Information-16x16.png">
            </telerik:RadMenuItem>
        </Items>
    </telerik:RadContextMenu>
    <telerik:RadContextMenu ID="RadContextMenu2" Runat="server"
         OnClientItemClicked="RadContextMenu_ItemClicked">
        <Items>
            <telerik:RadMenuItem runat="server" Text="General Information Page..."
                Value="GIP" ImageUrl="/Images/Information-16x16.png">
            </telerik:RadMenuItem>
        </Items>
    </telerik:RadContextMenu>
    <asp:LinqDataSource ID="LinqDataSourceDNCLetters" runat="server"
        AutoPage="False" ContextTypeName="CharityCheck.CharityCheckEntities"
        TableName="DoNotCallLetters"
        onselecting="LinqDataSourceDNCLetters_Selecting">
    </asp:LinqDataSource>
</asp:Panel>

[Daniel]

Hello David,

I created a simplified demo based on your code snippets but I'm unable to reproduce the problem with the itemIndex on my end. Can you please modify the attached project to help me recreate your scenario?

Regards,
Daniel
the Telerik team

[CG]

Hello,

I am facing the same issue. I am trying to get the column index when right clicking the radgrid to open up a context menu. target.cellindex returns as 'Undefined'.

I find that sometimes it does return the right index and at other times its undefined. Has this issue been fixed or is there a workaround?

Thanks!

[CG]

Upon further debugging I noticed that when the index returns as undefined, the 'cellIndex' variable property is not found under the 'target' reference and is when it returns a number.

This is pretty urgent and I'd like to get a fix for this ASAP. 

[Daniel]

Hello Christine,

Please check whether the target element is table cell (TD) as demonstrated below:

if(eventArgs.get_domEvent().target.tagName.toUpperCase() == "TD")
{
 //...
}

Regards,
Daniel
the Telerik team

[John Cooney]

Thank you Jon Adkins!!

Just what I needed.