i am currently using Rad Context menu in The RAD Grid.
IN the Grid Depending upon the value i want to show some different text on the context menu.lets say in a grid we have a 3 different row.
1 for a Folder name "Master" inthat i want see "Delete" and "Rename" in the context menu
2 for a Folder name "Working" inthat i want see "Create folder in the context menu
3 for a file i want to see "Properties" and "Download"
How can i do this?i am currently using ASP.NET 2008.
Thanks
Denny
4 Answers, 1 is accepted
Rank 2
You can use the show() and hide() client side mothods of radcontextmenuitem from clientside in order to display required items based on rowindex value of grid.
ASPX:
| <telerik:RadGrid ID="RadGrid1" AllowPaging="true" runat="server" DataSourceID="SqlDataSource1"> |
| <MasterTableView DataSourceID="SqlDataSource1" ClientDataKeyNames="CategoryName" AutoGenerateColumns="True"> |
| <Columns> |
| </Columns> |
| </MasterTableView> |
| <ClientSettings> |
| <ClientEvents OnRowContextMenu="OnRowContextMenu" /> |
| </ClientSettings> |
| </telerik:RadGrid> |
| <telerik:RadContextMenu ID="RadMenu1" runat="server"> |
| <Items> |
| <telerik:RadMenuItem Text="Delete" Value="Delete" /> |
| <telerik:RadMenuItem Text="Rename" Value="Rename" /> |
| <telerik:RadMenuItem Text="Create Folder" Value="Create Folder" /> |
| <telerik:RadMenuItem Text="Properties" Value="Properties" /> |
| <telerik:RadMenuItem Text="Download" Value="Download" /> |
| </Items> |
| </telerik:RadContextMenu> |
JavaScript:
| <script type="text/javascript"> |
| function OnRowContextMenu(sender, eventArgs) |
| { |
| var menu = $find("<%=RadMenu1.ClientID %>"); |
| var evt = eventArgs.get_domEvent(); |
| if(evt.target.tagName == "INPUT" || evt.target.tagName == "A") |
| { |
| return; |
| } |
| var DataItem = $find("<%=RadGrid1.ClientID %>").get_masterTableView().get_dataItems()[index]; |
| value = DataItem.getDataKeyValue("CategoryName"); // Set the ClientDataKeyNames as CategoryName |
| index = eventArgs.get_itemIndexHierarchical(); // index value |
| var all = menu.get_allItems(); |
| for(var i =0; i<all.length; i++) |
| { |
| all[i].hide(); |
| } |
| if(index == 0) //Condition (Or check with the value for the cell value) |
| { |
| var item = menu.findItemByText("Delete"); |
| item.show(); |
| item = menu.findItemByText("Rename"); |
| item.show(); |
| } |
| if(index == 1) |
| { |
| var item = menu.findItemByText("Create Folder"); |
| item.show(); |
| } |
| if(index == 2) |
| { |
| var item = menu.findItemByText("Properties"); |
| item.show(); |
| item = menu.findItemByText("Download"); |
| item.show(); |
| } |
| menu.show(evt); |
| evt.cancelBubble = true; |
| evt.returnValue = false; |
| if (evt.stopPropagation) |
| { |
| evt.stopPropagation(); |
| evt.preventDefault(); |
| } |
| } |
| </script> |
Thanks,
Shinu.
Rank 1
i am using following code.depending upon the "lblRecType" and " lblfolderid" i will show or hide some menu of context menu.not on the index value.So i want to know can i capture any item of Rad grid through javascript?
<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false"
AllowPaging="false" GridLines="None" PageSize="20" Skin="Vista"
AllowFilteringByColumn="false" Width="100%"
onitemdatabound="grdDocument_ItemDataBound"
onitemcommand="grdDocument_ItemCommand">
<MasterTableView PageSize="10" TableLayout="Fixed"
ClientDataKeyNames="FolderId" AutoGenerateColumns="false">
<Columns>
<telerik:GridTemplateColumn HeaderText="Type" Visible=false>
<ItemTemplate>
<asp:Label runat="server" ID="lblRecType" Text=<%# Eval("RecType") %> ></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Name">
<ItemTemplate>
<asp:ImageButton ID="imgType" runat="server" Visible="true" ImageUrl="~/Images/Ope_Folder.jpg" CommandName="RecType" value=<%# Eval("folderId") %> />
<asp:Label runat="server" ID="lblName" Text=<%# Eval("docname") %> ></asp:Label>
<asp:Label runat="server" ID="lblfolderid" Visible="false" Text=<%# Eval("folderId") %> ></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn DataField="description" HeaderText="Description">
</telerik:GridBoundColumn>
<telerik:GridTemplateColumn HeaderText="Size">
<ItemTemplate>
<asp:Label runat="server" ID="lblFileSize" Text=<%# Eval("filesize") %> ></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn DataField="date" HeaderText="Received">
</telerik:GridBoundColumn>
<telerik:GridTemplateColumn HeaderText="FileType" Visible=false>
<ItemTemplate>
<asp:Label runat="server" ID="lblFileType" Text=<%# Eval("fileType") %> ></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
</Columns>
</MasterTableView>
<ClientSettings>
<ClientEvents OnRowContextMenu="OnRowContextMenu" />
</ClientSettings>
</telerik:RadGrid>
Rank 2
You could access the Labels placed in ItemTemplate of GridTemplateColumn from client side and check for the value, then show the contextmenu according to the value.
You can use the logic described in code library for accessing the server controls in a grid template on the client.
Accessing server controls in a grid template on the client
Thanks,
Shinu.
Rank 1
Thanks for Reply,
Its doen't works.its So based on the grid layout what i provided you,give some specific and frtuthful solution.
i am using the following Rad grid code for the page.So i am requesting you to provide some
definite solution considerding the following code.i want some specifice solution(in respect to exact code with the aspx page and .Cs page).so i can solve the problem.We need to launch the site very soon.So please take this matter as urgent.I want the exact coding not any reference,because i already spent some days with your reference links/code to solve this issue.
--------------------------
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="frmExplorer.aspx.cs" Inherits="WebInterface.frmExplorer" %>
<%@ Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Financial Portal</title>
<link href="style/main.css" rel="stylesheet" type="text/css" />
<link href="style/tabs.css" rel="stylesheet" type="text/css" />
<link href="DocumentExplorer.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var gridViewCtlId = 'RadGrid1';
var gridViewCtl = null;
var curSelRow = null;
var curRowIdx = -1;
function OnClientItemClicked(sender, eventArgs)
{
if (eventArgs.get_item().get_value() == "Move")
{
radopen("ContextMenuWindow.aspx?index="+index+"&value="+value , "window1");
}
if (eventArgs.get_item().get_value() == "Rename")
{
radopen("RenameFolder.aspx?index="+index+"&value="+value , "window1");
}
if (eventArgs.get_item().get_value() == "Delete")
{
radopen("ContextMenuWindow.aspx?index="+index+"&value="+value , "window1");
}
if (eventArgs.get_item().get_value() == "Version")
{
radopen("ContextMenuWindow.aspx?index="+index+"&value="+value , "window1");
}
if (eventArgs.get_item().get_value() == "Properties")
{
radopen("ContextMenuWindow.aspx?index="+index+"&value="+value , "window1");
}
}
var index = 0;
var value;
function OnRowContextMenu(sender, eventArgs)
{
var menu = $find('RadMenu1');
var evt = eventArgs.get_domEvent();
if(evt.target.tagName == "INPUT" || evt.target.tagName == "A")
{
return;
}
index = eventArgs.get_itemIndexHierarchical();
var DataItem = $find('RadGrid1').get_masterTableView().get_dataItems()[index];
value = DataItem.getDataKeyValue("FolderId");
var all=menu.get_allItems();
// var serverID = "lblName";
// var tagName = "select1"; //dropdowns render as <select> elements
//
// //var dropDown = GetRegisteredServerElement(serverID);
// var dropDown = GetGridServerElement(serverID, tagName);
//// var grid = document.getElementById('RadGrid1');
//// var elements = grid.getElementsByTagName("jjj");
////
////
//// var currentCheckBox = sender.srcElement || sender.target;
////
//// var inputs = document.getElementsByTagName("input");
//// for (var i = 0; i < inputs.length; i++)
//// {
//// var input = inputs[i];
//// if (input.id == currentCheckBox.id)
//// {
//// alert(currentCheckBox.id);
//// continue;
//// }
//// }
// for(var i=0;i<all.length;i++)
// {
// all[i].hide();
//
// }
//alert(DataItem);
menu.show(evt);
evt.cancelBubble = true;
evt.returnValue = false;
if (evt.stopPropagation)
{
evt.stopPropagation();
evt.preventDefault();
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table width="100%">
<tr>
<td align="left" >
<table width="100%" class="master_headertop">
<tr>
<td align="left" valign="middle" class="text4">Client Portal </td>
<td class="text5"> </td>
<td class="text5" align="right"><a href="#">Sign Out</a></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" >
<telerik:RadScriptManager ID="ScriptManager1" runat="server" />
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />
<input type="hidden" id="radGridClickedRowIndex" name="radGridClickedRowIndex" />
<p><asp:LinkButton ID="lnk_assignuser" class="backcolru" runat="server" Text="Upload Folder" OnClick="lnk_addLink_User" />
<asp:LinkButton ID="LinkButton1" class="backcolru" runat="server"
Text="Upload File" onclick="LinkButton1_Click" /></p>
<p>
<telerik:radwindowmanager runat="server" Visible="false" RestrictionZoneID="offsetElement" ID="RadWindowManager2">
<Windows>
<telerik:RadWindow ID="test1"
NavigateUrl = "UploadFolder.aspx"
VisibleOnPageLoad = "true"
VisibleStatusbar="false" Height="190" Width="365" Top = "100"
Left = "200"
runat="server"></telerik:RadWindow>
</Windows>
</telerik:radwindowmanager>
<telerik:radwindowmanager runat="server" Visible="false" RestrictionZoneID="offsetElement" ID="RadWindowManager3">
<Windows>
<telerik:RadWindow ID="RadWindow1"
NavigateUrl = "uploadfile.aspx"
VisibleOnPageLoad = "true"
VisibleStatusbar="false" Height="190" Width="365" Top = "100"
Left = "200"
runat="server"></telerik:RadWindow>
</Windows>
</telerik:radwindowmanager>
</p>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> </telerik:RadAjaxManager>
<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false"
AllowPaging="false" GridLines="None" PageSize="20" Skin="Vista"
AllowFilteringByColumn="false" Width="100%"
onitemdatabound="grdDocument_ItemDataBound"
onitemcommand="grdDocument_ItemCommand">
<MasterTableView PageSize="10" TableLayout="Fixed"
ClientDataKeyNames="FolderId" AutoGenerateColumns="false">
<Columns>
<telerik:GridTemplateColumn HeaderText="Type" Visible=false>
<ItemTemplate>
<asp:Label runat="server" ID="lblRecType" Text=<%# Eval("RecType") %> ></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Name">
<ItemTemplate>
<asp:ImageButton ID="imgType" runat="server" Visible="true" ImageUrl="~/Images/Ope_Folder.jpg" CommandName="RecType" value=<%# Eval("folderId") %> />
<asp:Label runat="server" ID="lblName" Text=<%# Eval("docname") %> ></asp:Label>
<asp:Label runat="server" ID="lblfolderid" Visible="false" Text=<%# Eval("folderId") %> ></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn DataField="description" HeaderText="Description">
</telerik:GridBoundColumn>
<telerik:GridTemplateColumn HeaderText="Size">
<ItemTemplate>
<asp:Label runat="server" ID="lblFileSize" Text=<%# Eval("filesize") %> ></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn DataField="date" HeaderText="Received">
</telerik:GridBoundColumn>
<telerik:GridTemplateColumn HeaderText="FileType" Visible=false>
<ItemTemplate>
<asp:Label runat="server" ID="lblFileType" Text=<%# Eval("fileType") %> ></asp:Label>
</ItemTemplate>
</telerik:GridTemplateColumn>
</Columns>
</MasterTableView>
<ClientSettings>
<ClientEvents OnRowContextMenu="OnRowContextMenu" />
</ClientSettings>
</telerik:RadGrid>
<telerik:RadContextMenu ID="RadMenu1" runat="server"
OnClientItemClicked="OnClientItemClicked">
<Items>
<telerik:RadMenuItem Text="Move" Value="Move" />
<telerik:RadMenuItem Text="Rename" Value="Rename" />
<telerik:RadMenuItem Text="Delete" Value="Delete" />
<telerik:RadMenuItem Text="Version History" Value="Version" />
<telerik:RadMenuItem Text="Properties" Value="Properties" />
</Items>
</telerik:RadContextMenu>
<telerik:RadWindowManager ID="RadWindowManager1" runat="server" Top = "100"
Left = "50">
</telerik:RadWindowManager>
</td>
</tr>
</form>
Denny