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

Radcontextmenu w/Radgrid Newbie Q

4 Answers 152 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Nimesh
Top achievements
Rank 1
Nimesh asked on 09 May 2012, 08:23 PM
Can someone post a link or code to guide me to learn the following? I want to do 2 distinct things, separately when the right click of teh radcontext menu.
1. how to use a value or datakeyvalue from a RadGrid with a radcontextmenu to incorporate it into the NavigateUrl of the radcontext menu item. I'd like to place the value into a querystring and go to another page.
2. Not as important, but can I open up a modal pop up window from the radcontextmenu and also reference the datakeyname and/or a cell value to populate controls in the window from a database.

Any help would be greatly appreciated, I'm getting exhausted from the searching and not getting anywhere. Just point me in the right direction!

Regards, Nimesh Jagota

4 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 10 May 2012, 07:35 AM
Hello Nimesh,

Here is the sample code based on this demo to access DataKeyNames on ItemClick event.
aspx:
<telerik:RadWindowManager ID="RadWindowManager1" runat="server">
   <Windows>
      <telerik:RadWindow ID="RadWindow1" runat="server">
         <ContentTemplate>
             <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
          </ContentTemplate>
       </telerik:RadWindow>
   </Windows>
</telerik:RadWindowManager>
<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1">
  <MasterTableView DataKeyNames="OrderID" >
   <Columns>
     <telerik:GridBoundColumn DataField="OrderID" UniqueName="OrderID" HeaderText="OrderID"></telerik:GridBoundColumn>
    </Columns>
   </MasterTableView>
   <ClientSettings>
      <ClientEvents OnRowContextMenu="RowContextMenu" />
    </ClientSettings>
</telerik:RadGrid>
<telerik:RadContextMenu ID="RadMenu1" runat="server" EnableRoundedCorners="true" EnableShadows="true" OnItemClick="RadMenu1_ItemClick">
   <Items>
      <telerik:RadMenuItem Text="Add" />
      <telerik:RadMenuItem Text="Edit" />
    </Items>
</telerik:RadContextMenu>
JS:
<script type="text/javascript">
    function RowContextMenu(sender, eventArgs) {
        var menu = $find("<%=RadMenu1.ClientID %>");
        var evt = eventArgs.get_domEvent();
        menu.show(evt);
}
</script>
C#:
protected void RadMenu1_ItemClick(object sender, RadMenuEventArgs e)
{
  foreach (GridDataItem item in grdCampaignStatus.MasterTableView.Items)
  {
    string v = item.GetDataKeyValue("OrderID").ToString();//accessing the datakeynames
    RadMenuItem menu = RadMenu1.FindItemByText("Add");
    menu.NavigateUrl = "Categories.aspx?categoryID=" + v;
    RadWindow1.VisibleOnPageLoad = true;
    TextBox txt = (TextBox)RadWindow1.ContentContainer.FindControl("TextBox1");//passing the datakeynames to the textbox in RadWindow.
    txt.Text = v;
  }
}

Thanks,
Shinu.
0
Nimesh
Top achievements
Rank 1
answered on 11 May 2012, 03:51 PM
Sorry this did not work correctly. The when I right click the context menu after the grid initially loads, the "Edit" item does not display anything from the generated navigateURL in the codebehind, but it does cause the entire grid to postback and reload. Once it does that, then the Edit item in the context menu contains a navigateURL with a datakeyname, but not from the row that was initially selected before the postback. With 5000 records in the Grid, I can't tell which row, but its not from the first page for sure.

The radwindow part is not relevant, I really just want a context menu item navigateURL to have the datakeyvalue of the radgrid row that I selected so it navigates to the web page with the correct querystring value. Is it possible that someone could refine this answer for me? I suspect taht this can be done client side, hopefully without causing a needless postback.

Thanks very much for your attempt Shinu!

Regards, Nimesh
0
Nimesh
Top achievements
Rank 1
answered on 11 May 2012, 07:05 PM
Just in case anyone would like to have the answer, I did resolve my own problem. I had to guess the set_navigateurl aspect. Now can someone post how to open a radwindow (without causing a postback on the radgrid)?
<
telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadGrid1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" LoadingPanelID="RadAjaxLoadingPanel1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />
  
        <telerik:RadCodeBlock runat="server" ID="radCodeBlock">
            <script type="text/javascript">
                function showFilterItem() {
                    $find('<%=RadGrid1.ClientID %>').get_masterTableView().showFilterItem();
                }
                function hideFilterItem() {
                    $find('<%=RadGrid1.ClientID %>').get_masterTableView().hideFilterItem();
                }
                function RowContextMenu(sender, eventArgs) {
                    var NavigateUrl;
                    var grid = window["<%= RadGrid1.ClientID %>"];
                    var masterTableView = grid.MasterTableView;
                    var menu = $find("<%=RadContextMenu1.ClientID %>");
                    //document.getElementById("<%= Label1.ClientID %>").innerHTML = eventArgs.getDataKeyValue("ReservationID");
                    NavigateUrl = document.getElementById("<%= Label1.ClientID %>").innerHTML = eventArgs.getDataKeyValue("ReservationID");
                    var evt = eventArgs.get_domEvent();
                    var menuItem = menu.findItemByText("Edit");
                    menuItem.set_navigateUrl("Reservation.aspx?ReservationID=" + NavigateUrl);
                    menu.show(evt);
                }
  
            </script>
        </telerik:RadCodeBlock>
  
  
    <asp:Label ID="Label1" runat="server" Text=""></asp:Label>
    <telerik:RadGrid ID="RadGrid1" runat="server" PageSize="500" Height="600px" AllowFilteringByColumn="True" 
        AllowPaging="True" AllowSorting="True" DataSourceID="SqlDsGetRetReservations" 
        GridLines="None" ShowGroupPanel="True" Skin="Windows7" 
        AutoGenerateColumns="False" EnableLinqExpressions="false">
        <PagerStyle Mode="Slider"></PagerStyle>
        <ClientSettings AllowColumnsReorder="True" AllowDragToGroup="True" 
            ReorderColumnsOnClient="True">
            <ClientEvents OnRowContextMenu="RowContextMenu" />
            <Scrolling AllowScroll="True" UseStaticHeaders="True" />
            <Selecting AllowRowSelect="true" />
        </ClientSettings>
        <MasterTableView DataSourceID="SqlDsGetRetReservations" ClientDataKeyNames="ReservationID" DataKeyNames="ReservationID"  AllowFilteringByColumn="true">
            <Columns>
                <telerik:GridHyperLinkColumn DataNavigateUrlFormatString="~/Reservation.aspx?ReservationID={0}"  FilterControlWidth="50px" DataNavigateUrlFields="ReservationID" DataTextFormatString="{0}" DataTextField="ReservationID" ItemStyle-Width="100px" HeaderText="Resid" SortExpression="ReservationID" UniqueName="ResID">                
                </telerik:GridHyperLinkColumn>
                <telerik:GridBoundColumn DataField="DeptID" FilterControlWidth="50px" ItemStyle-Width="100px" HeaderText="DeptID" SortExpression="DeptID" UniqueName="DeptID">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="Chairperson" HeaderText="Chairperson" AutoPostBackOnFilter="false" SortExpression="Chairperson" UniqueName="Chairperson">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="Passcode" FilterControlWidth="50px" ItemStyle-Width="100px" HeaderText="Passcode" SortExpression="Passcode" UniqueName="Passcode">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="PasscodeM" FilterControlWidth="50px" ItemStyle-Width="100px" HeaderText="PasscodeM" SortExpression="PasscodeM" UniqueName="PasscodeM">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="ContactName" HeaderText="ContactName" SortExpression="ContactName" UniqueName="ContactName">
                </telerik:GridBoundColumn>
            </Columns>
            <RowIndicatorColumn>
                <HeaderStyle Width="20px"></HeaderStyle>
            </RowIndicatorColumn>
                <ExpandCollapseColumn ButtonType="ImageButton" Visible="True" UniqueName="ExpandColumn">
                    <HeaderStyle Width="20px"></HeaderStyle>
                </ExpandCollapseColumn>
        </MasterTableView>
    </telerik:RadGrid>
    <telerik:RadContextMenu ID="RadContextMenu1" runat="server" OnItemClick="RadContextMenu1_ItemClick" Skin="Windows7">
        <Targets>
            <telerik:ContextMenuControlTarget ControlID="RadGrid1" />
        </Targets>
        <Items>
            <telerik:RadMenuItem Text="Add" />
            <telerik:RadMenuItem Text="Edit" />
        </Items>
    </telerik:RadContextMenu>
Regards, Nimesh
0
Accepted
rdmptn
Top achievements
Rank 1
answered on 15 May 2012, 01:22 PM
Take a look at this article:
http://www.telerik.com/help/aspnet-ajax/window-programming-opening.html
It explains three different ways to open a RadWindow via JavaScript. You can subscribe to any client-side event you need (e.g. rowClick for the grid, ItemClick for the context menu, etc.).
This demo features a scenario that uses a RadWindow for editing a RadGrid, so you may find it useful as well: http://demos.telerik.com/aspnet-ajax/controls/examples/integration/gridandwindow/defaultcs.aspx?product=window
Tags
Menu
Asked by
Nimesh
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Nimesh
Top achievements
Rank 1
rdmptn
Top achievements
Rank 1
Share this question
or