contextmenu in treeview - Essential Objects, Inc. Support Forum

Welcome Guest

Search | Active Topics | Sign In | Register

Essential Objects Product Support Forum » All Products » Support » contextmenu in treeview

contextmenu in treeview

Options

Previous Topic · Next Topic

bvanacker

Posted: Wednesday, June 10, 2009 10:15:59 AM

Rank: Member
Groups: Member

Joined: 3/27/2009
Posts: 12

Hi,

I have some problems by right clicking on a treeview for displaying a contextmenu.
If I just rightclick an item on a treeview, the explorer rightmenu appears and my contextmenu.

Anyone knows how to resolve this !?

Thanx

Code: Visual Basic.NET

Copy

eo_support

Posted: Wednesday, June 10, 2009 10:36:56 AM

Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080

Hi,

That is usually because you did not return true from your ClientSideOnContextMenu handler. Here is a working example:

http://demo.essentialobjects.com/Default.aspx?path=TreeView\_i1\_i9

Click the JavaScript tab and you will notice the last line of the handler returns true.

Thanks!

bvanacker

Posted: Wednesday, June 10, 2009 10:47:04 AM

Rank: Member
Groups: Member

Joined: 3/27/2009
Posts: 12

hi
is following code correct ?

Quote:

function ShowContextMenu(e, treeView, node)
{ Node = node;
var menu = eo_GetObject("<%=ContextMenu1.ClientID%>");
document.getElementById("reply").value = node.getValue();
eo_ShowContextMenu(e, "<%=ContextMenu1.ClientID%>");
return true;
}

eo_support

Posted: Wednesday, June 10, 2009 10:52:12 AM

Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080

Hi,

That appears to be correct. In that case we will need to see the problem in order to find out why the default context menu is being displayed. If you have the page online, you can send us the Url and we will be happy to take a look and see what we can find. Otherwise we will need you to create a test page that duplicates the problem so that we can run and see the problem at here. As a test, you may also want to try your code inside a blank page to make sure that it has nothing to do with other code in your page.

Thanks!

bvanacker

Posted: Wednesday, June 10, 2009 11:14:22 AM

Rank: Member
Groups: Member

Joined: 3/27/2009
Posts: 12

Hi,

here is my code

Quote:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="testcontextmenu._Default" %>

<%@ Register assembly="EO.Web" namespace="EO.Web" tagprefix="eo" %>

<!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>
<script language="javascript" type="text/javascript">
function ShowContextMenu(e, treeView, node) {
var menu = eo_GetObject("<%=ContextMenu1.ClientID%>");

//Modify the context menu
// menu.getTopGroup().getItemByIndex(0).setText("Open '" + node.getText() + "'");
// menu.getTopGroup().getItemByIndex(1).setText("Delete '" + node.getText() + "'");

//Display the context menu. See documentation
//for the Menu control for details about how
//to handle menu item click event
eo_ShowContextMenu(e, "<%=ContextMenu1.ClientID%>");

//Returns true to indicate that we have
//displayed a context menu
return true;

}

</script>
</head>
<body>
<form id="form1" runat="server">
<div>

<eo:TreeView ID="TreeView1" runat="server" AutoSelectSource="ItemClick"
ClientSideOnContextMenu="ShowContextMenu" ControlSkinID="None" Height="250px"
Width="200px" RaisesServerEvent="True">
<LookNodes>
<eo:TreeNode DisabledStyle-CssText="background-color:transparent;border-bottom-style:none;border-left-style:none;border-right-style:none;border-top-style:none;color:Gray;padding-bottom:1px;padding-left:1px;padding-right:1px;padding-top:1px;"
ItemID="_Default"
NormalStyle-CssText="PADDING-RIGHT: 1px; PADDING-LEFT: 1px; PADDING-BOTTOM: 1px; COLOR: black; BORDER-TOP-STYLE: none; PADDING-TOP: 1px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-COLOR: transparent; BORDER-BOTTOM-STYLE: none"
SelectedStyle-CssText="background-color:#316ac5;border-bottom-color:#999999;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#999999;border-left-style:solid;border-left-width:1px;border-right-color:#999999;border-right-style:solid;border-right-width:1px;border-top-color:#999999;border-top-style:solid;border-top-width:1px;color:White;padding-bottom:0px;padding-left:0px;padding-right:0px;padding-top:0px;">
</eo:TreeNode>
</LookNodes>
<TopGroup Style-CssText="border-bottom-color:#999999;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#999999;border-left-style:solid;border-left-width:1px;border-right-color:#999999;border-right-style:solid;border-right-width:1px;border-top-color:#999999;border-top-style:solid;border-top-width:1px;color:black;cursor:hand;font-family:Tahoma;font-size:8pt;padding-bottom:2px;padding-left:2px;padding-right:2px;padding-top:2px;">
<Nodes>
<eo:TreeNode Text="Welcome to MSDN Library">
<SubGroup>
<Nodes>
<eo:TreeNode Text="How to Use the MSDN Library Table of Contents">
</eo:TreeNode>
</Nodes>
</SubGroup>
</eo:TreeNode>
<eo:TreeNode Text="Development Tools and Languages">
<SubGroup>
<Nodes>
<eo:TreeNode Text="Visual Studio 2005">
</eo:TreeNode>
<eo:TreeNode Text="Visual Studio.NET">
</eo:TreeNode>
<eo:TreeNode Text=".NET Framework SDK">
</eo:TreeNode>
</Nodes>
</SubGroup>
</eo:TreeNode>
<eo:TreeNode Text=".NET Development">
<SubGroup>
<Nodes>
<eo:TreeNode Text=".NET Framework Class Library">
</eo:TreeNode>
<eo:TreeNode Text=".NET Framework SDK">
</eo:TreeNode>
<eo:TreeNode Text="Articles and Overviews">
</eo:TreeNode>
</Nodes>
</SubGroup>
</eo:TreeNode>
<eo:TreeNode Text="Web Development">
</eo:TreeNode>
<eo:TreeNode Text="Win32 and COM Development">
</eo:TreeNode>
<eo:TreeNode Text="MSDN Library Archive">
</eo:TreeNode>
</Nodes>
</TopGroup>
</eo:TreeView>

<eo:ContextMenu ID="ContextMenu1" runat="server" ControlSkinID="None"
SubMenuIconUrl="Blank" Width="120px" RaisesServerEvent="True">
<LookItems>
<eo:MenuItem HoverStyle-CssText="BORDER-RIGHT: #9c9a9c 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #9c9a9c 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #9c9a9c 1px solid; COLOR: #9c6500; PADDING-TOP: 2px; BORDER-BOTTOM: #9c9a9c 1px solid; BACKGROUND-COLOR: #efefef"
ItemID="_Default" LeftIcon-HoverUrl="Triangle1" LeftIcon-SelectedUrl="Blank"
LeftIcon-Url="Blank"
NormalStyle-CssText="BORDER-RIGHT: #9c9a9c 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #9c9a9c 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #9c9a9c 1px solid; COLOR: #003000; PADDING-TOP: 2px; BORDER-BOTTOM: #9c9a9c 1px solid; BACKGROUND-COLOR: #efefef"
SelectedStyle-CssText="BORDER-RIGHT: #003000 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #003000 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #003000 1px solid; COLOR: white; PADDING-TOP: 2px; BORDER-BOTTOM: #003000 1px solid; BACKGROUND-COLOR: #316531">
<SubMenu ItemSpacing="1" LeftIconCellWidth="7" ShadowDepth="0"
Style-CssText="PADDING-RIGHT: 2px; PADDING-LEFT: 2px; FONT-SIZE: 8pt; PADDING-BOTTOM: 2px; CURSOR: hand; COLOR: #003000; BORDER-TOP-STYLE: none; PADDING-TOP: 2px; FONT-FAMILY: Verdana; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-COLOR: transparent; BORDER-BOTTOM-STYLE: none">
</SubMenu>
</eo:MenuItem>
</LookItems>
<TopGroup Orientation="Vertical">
<Items>
<eo:MenuItem Text-Html="My Account">
</eo:MenuItem>
<eo:MenuItem Text-Html="Our Products">
<SubMenu>
<Items>
<eo:MenuItem Text-Html="Product 1">
</eo:MenuItem>
<eo:MenuItem Text-Html="Product 2">
</eo:MenuItem>
<eo:MenuItem Text-Html="Product 3">
</eo:MenuItem>
</Items>
</SubMenu>
</eo:MenuItem>
<eo:MenuItem Text-Html="Contact Us">
</eo:MenuItem>
<eo:MenuItem Text-Html="Frequently Asked<br />Questions">
</eo:MenuItem>
</Items>
</TopGroup>
</eo:ContextMenu>

</div>
</form>
</body>
</html>

which give me the same strange behavior.
I'm running this in IE 8 version : 8.0.6001.18702

eo_support

Posted: Wednesday, June 10, 2009 11:44:13 AM

Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080

Hi,

Try to add a small offset to your context menu. Change this:

Code: HTML/ASPX

Copy

....
<LookItems>
   <eo:MenuItem ...>
      <SubMenu ItemSpacing="1" ...>
      </SubMenu>
   </eo:MenuItem>
</LookItems>
....

Code: HTML/ASPX

Copy

....
<LookItems>
   <eo:MenuItem ...>
      <SubMenu OffsetX="3" OffsetY="3" ItemSpacing="1" ...>
      </SubMenu>
   </eo:MenuItem>
</LookItems>
....

Notice the new OffsetX and OffsetY added to the sub menu.

Please let us know if that fixes the issue.

Thanks!

bvanacker

Posted: Wednesday, June 10, 2009 11:58:54 AM

Rank: Member
Groups: Member

Joined: 3/27/2009
Posts: 12

Thanks

That solves the problem !

eo_support

Posted: Wednesday, June 10, 2009 12:01:57 PM

Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,080

Great. Glad that it works for you!

You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.

Message