|
|
Rank: Member
Groups: Member
Joined: 3/2/2010
Posts: 11
|
Hi there
I have a menu control with a submenu that has another submenu which is a custom item with a dropdownlist in it. It all works great until I try to select from the dropdownlist. As soon as the mouse leaves the submenu area it collapses and the dropdownlist vanishes with the menu.
I've tried using cancelbubble on the customitem and that didn't seem to help.
Here's a quick diagram of my menu structure for clarity:
[Menu]
|
[Submenu] -> [Submenu with dropdownlist]
Any ideas?
Thanks
[Edit]: I finally found another post with similar issues and I followed your suggestion. I set the CollapseDelay to 0 and made the menu only expand when clicked. Is this the only way to make this work?
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi,
Yes. Setting CollapseDelay to 0 is the only way for this situation.
Thanks!
|
|
Rank: Member
Groups: Member
Joined: 3/2/2010
Posts: 11
|
OK, thanks.
That all seemed to work but now something else has cropped up.
The first time I click on the dropdownlist it fires the Javascript as I expect and I close the menu as I expect but the second time I use the dropdownlist and every subsequent time it causes an exception in one of the eo javascript files.
I know it's a bit vague but the error occurs in a huge long line of code where it says 'this.something' and this is null. The code looks like gibberish so that's why I'm kind of vague.
Does that sound familiar?
When I run in Firefox from VS it doesn't complain but when using IE to debug it stops and shows me the exception. When the project is deployed and used via IE6 it shows the Javascript error in the status bar.
I can probably give you more info if needed but I was hoping you may know what the problem is by experience. Maybe the way that I'm collapsing the menu?
Thanks
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi,
We do not know what causes that. Please try to isolate the problem into a separate test page and post the test page. Once we have that we will try to run it here and see if we can see the same problem. As soon as we can see it here, it should not be difficult for us to find out what's wrong.
Thanks!
|
|
Rank: Member
Groups: Member
Joined: 3/2/2010
Posts: 11
|
Hi again
I've been able to partially pin down the problem but I'm pressed for time and I'm not sure I can produce a sample that will break the same way.
What's happening is that the dropdownlist extends out over a grid in a callback panel.
When I select an item from the dropdown there is no problem unless the mouseclick that selects the item happens to be directly over an item in the grid.
If it is over a grid item the JS error occurs.
One of the lines that is breaking is below:
The problem seems to be that this.ak is null and it shouldn't be.
function _eofldr_br(a){this.ar(false);if(!this.as||!this.am){this.as=true;this.ak.at(true,a,this.an);}
After digging around with the properties in this code I can see that 'a' is of type mouseover.
So, whenever I'm clicking an event is being passed onto the grid as well as the dropdown and that is causing the problem. Just a guess - you're hooking into the click event and the current object is not the grid but actually my dropdown even though the click is in the area of the grid.
Does any of that make sense?
It's definitely the click that's doing it because if I select an item that's over the grid using the enter key the error does not occur.
Any ideas?
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi,
Unfortunately we do need you to isolate the problem into a test page first. Without that it will be like shooting in the dark and it will cost both of us more time to pin it down. It's much costy to do can you try this can you try that kind of troubleshooting without knowing exactly what the problem is. We need such a page not only to find out what's causing the problem, but also to verify whatever solution/fix we come up will indeed work for you.
Thanks!
|
|
Rank: Member
Groups: Member
Joined: 3/2/2010
Posts: 11
|
Hi, thanks for the reply and I fully understand your comments about debugging. I've managed to pare it down to the basics and I have a sample page that shows the bug in action. This page has a menu at the top and a grid in a callback panel. When it first loads you can click on the Advanced Search button and then click to see the dropdown list and when you make a selection it works just fine. After that the grid is now populated and if you choose any selection from the dropdown list again that sits over the grid itself you will see the error occur. Below is the ASPX markup and the accompanying VB.NET code to make the page function. I look forward to your response. Thanks!
Code: HTML/ASPX
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="mess.aspx.vb" Inherits="mess" %>
<%@ 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>
</head>
<body>
<form id="form1" runat="server">
<div>
<eo:CustomItem ID="ciSelect" runat="server" height="18px" CancelBubble="true">
<asp:DropDownList ID="ddl" runat="server" Height="18px" >
</asp:DropDownList>
</eo:CustomItem>
<eo:Menu ID="mnuToolbar" runat="server" Width="800px" ControlSkinID="None"
CollapseDelay="0" ExpandOnClick="EnabledAlways">
<LookItems>
<eo:MenuItem HoverStyle-CssText="border-bottom-color:#255068;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#255068;border-left-style:solid;border-left-width:1px;border-right-color:#255068;border-right-style:solid;border-right-width:1px;border-top-color:#255068;border-top-style:solid;border-top-width:1px;padding-bottom:3px;padding-left:4px;padding-right:4px;padding-top:3px;"
Image-HoverUrl="00000210" Image-Mode="ItemBackground" Image-Url="Blank"
ItemID="_TopLevelItem"
NormalStyle-CssText="padding-bottom:4px;padding-left:5px;padding-right:5px;padding-top:4px;">
<SubMenu ItemSpacing="2" LeftIconCellWidth="28" SideImage="00000209"
Style-CssText="background-color:#f1f1f1;border-bottom-color:#979797;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#979797;border-left-style:solid;border-left-width:1px;border-right-color:#979797;border-right-style:solid;border-right-width:1px;border-top-color:#979797;border-top-style:solid;border-top-width:1px;cursor:hand;font-family:Verdana;font-size:8pt;padding-bottom:2px;padding-left:2px;padding-right:2px;padding-top:2px;">
</SubMenu>
</eo:MenuItem>
<eo:MenuItem IsSeparator="True" ItemID="_Separator"
NormalStyle-CssText="margin-left: 28px; width: 1px; height: 1px; background-color: #e0e0e0;">
</eo:MenuItem>
<eo:MenuItem Height="24"
HoverStyle-CssText="border-right: #a8d8eb 1px solid; padding-right: 4px; border-top: #a8d8eb 1px solid; padding-left: 1px; padding-bottom: 1px; border-left: #a8d8eb 1px solid; padding-top: 1px; border-bottom: #a8d8eb 1px solid; cursor: default;"
Image-HoverUrl="00000204" Image-Mode="ItemBackground" Image-Url="Blank"
ItemID="_Default"
NormalStyle-CssText="padding-right: 5px; padding-left: 2px; padding-bottom: 2px; padding-top: 2px;"
Text-Padding-Right="30">
<SubMenu ItemSpacing="2" LeftIconCellWidth="28" SideImage="00000209"
Style-CssText="background-color:#f1f1f1;border-bottom-color:#979797;border-bottom-style:solid;border-bottom-width:1px;border-left-color:#979797;border-left-style:solid;border-left-width:1px;border-right-color:#979797;border-right-style:solid;border-right-width:1px;border-top-color:#979797;border-top-style:solid;border-top-width:1px;font-family:Verdana;font-size:8pt;padding-bottom:2px;padding-left:2px;padding-right:2px;padding-top:2px;">
</SubMenu>
</eo:MenuItem>
</LookItems>
<TopGroup ItemSpacing="6"
Style-CssText="background-image:url(00000200);color:white;font-family:Verdana;font-size:12px;padding-bottom:5px;padding-left:5px;padding-right:5px;padding-top:5px;">
<Items>
<eo:MenuItem Text-Html="Advanced Search">
<SubMenu>
<Items>
<eo:MenuItem HoverStyle-CssText="" LookID="None" Text-Html="Search From List">
<SubMenu KeepExpandedOnClick="True">
<Items>
<eo:MenuItem CustomItemID="ciSelect" Text-Html="SearchFromList">
<SubMenu KeepExpandedOnClick="True">
</SubMenu>
</eo:MenuItem>
</Items>
</SubMenu>
</eo:MenuItem>
</Items>
</SubMenu>
</eo:MenuItem>
</Items>
</TopGroup>
</eo:Menu>
<eo:CallbackPanel ID="CallBackGrid" runat="server" Height="400px" Width="600px" >
<eo:Grid ID="Grid" runat="server" Width="600px" BorderColor="#828790"
BorderWidth="1px" ColumnHeaderAscImage="00050204"
ColumnHeaderDescImage="00050205" ColumnHeaderDividerImage="00050203"
ColumnHeaderHeight="24" Font-Bold="False"
Font-Italic="False" Font-Names="Tahoma" Font-Overline="False"
Font-Size="8.75pt" Font-Strikeout="False" Font-Underline="False"
GridLineColor="240, 240, 240" GridLines="Both" Height="600px"
ItemHeight="19" ClientSideOnItemSelected="show_member_detail" KeyField="ID">
<FooterStyle CssText="padding-bottom:4px;padding-left:4px;padding-right:4px;padding-top:4px;" />
<ItemStyles>
<eo:GridItemStyleSet>
<ItemStyle CssText="background-color: white" />
<ItemHoverStyle CssText="background-image: url(00050206); background-repeat: repeat-x" />
<SelectedStyle CssText="background-image: url(00050207); background-repeat: repeat-x" />
<CellStyle CssText="padding-left:8px;padding-top:2px;white-space:nowrap;" />
</eo:GridItemStyleSet>
</ItemStyles>
<ColumnTemplates>
<eo:TextBoxColumn>
<TextBoxStyle CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 8.75pt; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; FONT-FAMILY: Tahoma" />
</eo:TextBoxColumn>
<eo:DateTimeColumn>
</eo:DateTimeColumn>
<eo:MaskedEditColumn>
<MaskedEdit runat="server" ControlSkinID="None"
TextBoxStyle-CssText="BORDER-RIGHT: #7f9db9 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #7f9db9 1px solid; PADDING-LEFT: 2px; PADDING-BOTTOM: 1px; MARGIN: 0px; BORDER-LEFT: #7f9db9 1px solid; PADDING-TOP: 2px; BORDER-BOTTOM: #7f9db9 1px solid; font-family:Courier New;font-size:8pt;">
</MaskedEdit>
</eo:MaskedEditColumn>
</ColumnTemplates>
<ColumnHeaderHoverStyle CssText="background-image:url('00050202');padding-left:8px;padding-top:4px;" />
<Columns>
<eo:TextBoxColumn DataField="Surname" Name="Surname" ReadOnly="True"
Width="120" AllowSort="True" DataType="String" HeaderText="Surname">
</eo:TextBoxColumn>
</Columns>
<ColumnHeaderStyle CssText="background-image:url('00050201');padding-left:8px;padding-top:4px;" />
</eo:Grid>
</eo:CallbackPanel>
</div>
</form>
<script type="text/javascript">
function Search(txt) {
//Callback
eo_Callback('CallBackGrid', 'SearchByBranch_' + txt);
//Collapse menu
var mnuClassObj = eo_GetObject('mnuToolbar');
mnuClassObj.getTopGroup().getItemByIndex(0).collapseSubMenu();
}
</script>
</body>
</html>
Code: Visual Basic.NET
Partial Class mess
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
'Add items to dropdown
ddl.Items.Add(New ListItem("a", "1"))
ddl.Items.Add(New ListItem("b", "2"))
ddl.Items.Add(New ListItem("c", "3"))
ddl.Items.Add(New ListItem("d", "4"))
ddl.Items.Add(New ListItem("e", "5"))
ddl.Items.Add(New ListItem("f", "6"))
ddl.Items.Add(New ListItem("g", "7"))
ddl.Items.Add(New ListItem("h", "8"))
ddl.Items.Add(New ListItem("i", "9"))
ddl.Items.Add(New ListItem("j", "10"))
ddl.Attributes.Add("onChange", "Search(this.value);")
End Sub
Protected Sub CallbackGrid_Execute(ByVal sender As Object, ByVal e As EO.Web.CallbackEventArgs) Handles CallBackGrid.Execute
Dim str As String = e.Parameter.ToString
'Refresh Grid
Dim objFiller As GridFiller
Dim Fillers As New List(Of GridFiller)
For f As Integer = 1 To 30
objFiller = New GridFiller
objFiller.ID = f
objFiller.Surname = "Surname" & f
Fillers.Add(objFiller)
Next f
Grid.DataSource = Fillers
Grid.DataBind()
End Sub
End Class
Public Class GridFiller
Public ID As Integer
Public _Surname As String
Public Property Surname() As String
Get
Return _Surname
End Get
Set(ByVal value As String)
_surname = value
End Set
End Property
End Class
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi,
What version do you use? We tried your code with the latest version and we do not see any errors.
Thanks!
|
|
Rank: Member
Groups: Member
Joined: 3/2/2010
Posts: 11
|
Hi there
Version 7.0.57.2
Is that the current version?
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Hi,
The current version is 7.0.62 (It's displayed on the download page). Please see if that version works for you. If it still does not work for you, we will need you to send your test project to us. We will PM you as to where to send.
Thanks!
|
|
Rank: Member
Groups: Member
Joined: 3/2/2010
Posts: 11
|
Looks like the current version doesn't have the problem. Wow, what a waste of time that was  I only downloaded the latest version 2 weeks ago and you guys have done 5 builds since. Impressive work. Thanks for your help.
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,194
|
Glad to see that it works for you. Please feel free to let us know if you run into any other issues.
Thanks!
|
|