i have a radgrid and when i right click a row i am able to show radcontextmenu . What i am trying to do is i want to show the context menu only if i click the 3. column index of each row. if i click other columns i want to show the standard context menu of current explorer.
i tried the example
http://www.telerik.com/community/code-library/aspnet-ajax/general/contextmenu-over-a-specified-column-in-radgrid.aspx
but it didnt work for me cause "source" and "cell" values are never same.
i have this :
RadControls version |
RadControls for ASP.Net Ajax |
.NET version |
3,5 |
Visual Studio version |
2008 |
programming language |
C# |
|
Can you help me about this.
Thanks in advance.
6 Answers, 1 is accepted
Please test the attached sample project and let me know if you have more questions.
Best regards,
Daniel
the Telerik team
Check out Telerik Trainer , the state of the art learning tool for Telerik products.
thank you for the reply. i solved the problem and it is similar to your solution. i extended the case and i show different radcontextmenu for different columns in the radgrid. for this, i used the below js code
<
telerik:RadCodeBlock ID="Block" runat="server">
<script type="text/javascript">
//<![CDATA[
var index;
function RowContextMenu(sender, eventArgs) {
var CallMenu = $find("<%= CallMenu.ClientID %>");
var InfoMenu = $find("<%= InfoMenu.ClientID %>");
CallMenu.hide();
InfoMenu.hide();
var domEvent = eventArgs.get_domEvent();
var gsmColumn = domEvent.target.id.indexOf("LblOwnerGsm");
var ownerIdColumn = domEvent.target.id.indexOf("LblOwnerId");
var ownerColumn = domEvent.target.id.indexOf("LblVendor");
index = eventArgs.get_itemIndexHierarchical();
var masterTable = sender.get_masterTableView();
masterTable.clearSelectedItems();
//select the current row
masterTable.selectItem(masterTable.get_dataItems()[index].get_element());
if (gsmColumn != "-1")//if clicked column is GSM Column
CallMenu.show(domEvent);
//show calling menu
else if (ownerIdColumn != "-1" || ownerColumn != "-1")//if clicked column is OwnerId Column or Owner Column
InfoMenu.show(domEvent);
//show info menu
else {//cancel the rowcontext event and let the common explorer context menu appear
eventArgs.set_cancel(
true);
return false;
}
$telerik.cancelRawEvent(domEvent);
}
//]]>
</script>
</
telerik:RadCodeBlock>
thanks..
I am also facing the same problem. i want show diffrent context menu based on different column in a same RadGrid. Can you please provide the entire sample of this.
thanks in advance
sai
I provided a sample project for you but i am not able to attach a .rar file
here is the code :
.aspx file
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> |
<%@ 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 runat="server"> |
<title></title> |
</head> |
<body> |
<form id="form1" runat="server"> |
<asp:ScriptManager ID="ScMng" runat="server"></asp:ScriptManager> |
<table border="0" cellpadding="0" cellspacing="0" width="100%"> |
<tr> |
<td> |
<telerik:RadGrid AllowPaging="false" AutoGenerateColumns="false" ID="TestGrd" runat="server"> |
<MasterTableView> |
<Columns> |
<telerik:GridBoundColumn DataField="RowID" HeaderText="Row ID"></telerik:GridBoundColumn> |
<telerik:GridTemplateColumn HeaderText="Sample Column 1"> |
<ItemTemplate> |
<asp:Label ID="LblSample" runat="server" Text='<%#Eval("Sample1") %>'></asp:Label> |
</ItemTemplate> |
</telerik:GridTemplateColumn> |
<telerik:GridTemplateColumn HeaderText="Sample Column 2"> |
<ItemTemplate> |
<asp:Label ID="LblTest" runat="server" Text='<%#Eval("Sample2") %>'></asp:Label> |
</ItemTemplate> |
</telerik:GridTemplateColumn> |
</Columns> |
</MasterTableView> |
<ClientSettings> |
<ClientEvents OnRowContextMenu="RowContextMenu"/> |
<Selecting AllowRowSelect="true" /> |
</ClientSettings> |
</telerik:RadGrid> |
</td> |
</tr> |
</table> |
<telerik:RadContextMenu ID="SampleMenu" runat="server" Flow="Horizontal"> |
<ExpandAnimation Type="None" /> |
<DefaultGroupSettings ExpandDirection="Auto" Flow="Vertical" /> |
<CollapseAnimation Type="None" /> |
<Items> |
<telerik:RadMenuItem runat="server" ExpandMode="ClientSide" Text="Sample 1"> |
<GroupSettings ExpandDirection="Auto" Flow="Vertical" /> |
</telerik:RadMenuItem> |
<telerik:RadMenuItem runat="server" ExpandMode="ClientSide" Text="Sample 2"> |
<GroupSettings ExpandDirection="Auto" Flow="Vertical" /> |
</telerik:RadMenuItem> |
<telerik:RadMenuItem runat="server" ExpandMode="ClientSide" Text="Sample 3"> |
<GroupSettings ExpandDirection="Auto" Flow="Vertical" /> |
</telerik:RadMenuItem> |
</Items> |
</telerik:RadContextMenu> |
<telerik:RadContextMenu ID="TestMenu" runat="server" Flow="Horizontal"> |
<ExpandAnimation Type="None" /> |
<DefaultGroupSettings ExpandDirection="Auto" Flow="Vertical" /> |
<CollapseAnimation Type="None" /> |
<Items> |
<telerik:RadMenuItem runat="server" ExpandMode="ClientSide" Text="Test 1"> |
<GroupSettings ExpandDirection="Auto" Flow="Vertical" /> |
</telerik:RadMenuItem> |
<telerik:RadMenuItem runat="server" ExpandMode="ClientSide" Text="Test2 2"> |
<GroupSettings ExpandDirection="Auto" Flow="Vertical" /> |
</telerik:RadMenuItem> |
</Items> |
</telerik:RadContextMenu> |
<telerik:RadCodeBlock ID="Block" runat="server"> |
<script type="text/javascript"> |
//<![CDATA[ |
var index; |
function RowContextMenu(sender, eventArgs) { |
var sampleMenu = $find("<%= SampleMenu.ClientID %>"); |
var testMenu = $find("<%= TestMenu.ClientID %>"); |
sampleMenu.hide(); |
testMenu.hide(); |
var domEvent = eventArgs.get_domEvent(); |
var sampleColumn = domEvent.target.id.indexOf("LblSample"); |
var testColumn = domEvent.target.id.indexOf("LblTest"); |
index = eventArgs.get_itemIndexHierarchical(); |
var masterTable = sender.get_masterTableView(); |
masterTable.clearSelectedItems(); |
var dataItem = masterTable.get_dataItems()[index]; |
masterTable.selectItem(masterTable.get_dataItems()[index].get_element()); |
var cell = masterTable.get_dataItems()[index].get_element().cells[0]; |
if (sampleColumn != "-1")//if clicked column is sample Column |
sampleMenu.show(domEvent); //show sample menu |
else if (testColumn != "-1")//if clicked column is test column |
testMenu.show(domEvent); //show test menu |
else {//cancel the rowcontext event and let the common explorer context menu appear |
eventArgs.set_cancel(true); |
return false; |
} |
$telerik.cancelRawEvent(domEvent); |
} |
//]]> |
</script> |
</telerik:RadCodeBlock> |
</form> |
</body> |
</html> |
.aspx.cs file
using System; |
using System.Web.UI; |
public partial class _Default : System.Web.UI.Page |
{ |
class Test_Data |
{ |
private int _RowID; |
private string _Sample1; |
private string _Sample2; |
public string Sample2 |
{ |
get { return _Sample2; } |
set { _Sample2 = value; } |
} |
public string Sample1 |
{ |
get { return _Sample1; } |
set { _Sample1 = value; } |
} |
public int RowID |
{ |
get { return _RowID; } |
set { _RowID = value; } |
} |
} |
protected void Page_Load(object sender, EventArgs e) |
{ |
if (!Page.IsPostBack) |
Bind_Data(); |
} |
private void Bind_Data() |
{ |
Test_Data[] myTestData = new Test_Data[10]; |
for (int i = 0; i < 10; i++) |
{ |
myTestData[i] = new Test_Data(); |
myTestData[i].RowID = i; |
myTestData[i].Sample1 = string.Format("Sample {0}",i); |
myTestData[i].Sample2 = string.Format("Test {0}", i); |
} |
TestGrd.DataSource = myTestData; |
TestGrd.DataBind(); |
} |
} |
Tested environment
RadControls for ASPNET AJAX Q3 2008
File version : 2008.03.1314.35
ASP.NET Framework version : 3.5
Visual Studio 2008
I.E version : 7 & 8 (in i.e version 8, common internet explorer context menu is not appearing for RowID column in the sample and it is a known bug for me :) )
i wish it can be helpful for you.
is it possible to change particular columns color?
-sai
i didnt understand your question well but you can use custom skin for radgrid by using these properties.
Skin
="MyCustomSkin" EnableEmbeddedSkins="false"
in order to use that you should create your own skin file , you can find documents and forum help by searching.
if you want to change only one or two column backcolor or something else, you can use ItemStyle properties like these
<telerik:GridTemplateColumn ItemStyle-BackColor="Red" ItemStyle-ForeColor="Aqua" HeaderText="Sample Column 2"> |
<ItemTemplate> |
<asp:Label ID="LblTest" runat="server" Text='<%#Eval("Sample2") %>'></asp:Label> |
</ItemTemplate> |
</telerik:GridTemplateColumn> |