[CLOSED] KeyMap in Panel not working in mozilla
Hi
The following code works fine in IE8 but not in Mozilla. What am I doing wrong?
Code:
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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></title>
</head>
<body style="padding:30px">
<form id="form1" runat="server">
<ext:ResourceManager runat="server" ID="resourceManager1" Theme="Gray"/>
<ext:panel IDMode="Static" ID="Taskboard" runat="server" width="200" height="500" title="Title">
<KeyMap runat="server">
<ext:keybinding>
<keys>
<ext:key code="ENTER" />
</keys>
<Listeners>
<Event Handler="alert('Enter Pressed');" />
</Listeners>
</ext:keybinding>
</KeyMap>
<Items>
</Items>
</ext:panel>
</form>
</body>
</html>
RE: [CLOSED] KeyMap in Panel not working in mozilla
Hi,
The key intersepting works when control or inner items have focus. Empty panel has no elements which can accept focus. Therefore I am not sure why do you expect to see alert. For example, if put TextField inside panel then after focusing on that field and press ENTER you will see alert.
I am not sure why IE8 allows focus for div elements (IE always has own standards) but do not expect it from all browsers
RE: [CLOSED] KeyMap in Panel not working in mozilla
Hi again
I'm sure it's a perfectly correkt answer, but it isn't helpfull.
Let me ask in another way. Why do panels have a keymap, if you can't use it, and what is the magic word you have to write to get keyboard functionality working in panels like grids and treepanels.
Can I read it in your documentation? Then please do supply me with a link.
Yours sincerly
Klavs Martens
RE: [CLOSED] KeyMap in Panel not working in mozilla
Hi,
KeyMap is used to intercept key from children mostly. Also some inheritors can implement own focusing functionality (like Window)
For example, we can implement simple focusing implementation for Panel (do not expect many from this implementation, it is for example only, it might doesn't work with complex example, depends from panel's content)
Code:
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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></title>
</head>
<body style="padding:30px">
<form id="form1" runat="server">
<ext:ResourceManager runat="server" ID="resourceManager1" Theme="Gray"/>
<ext:panel IDMode="Static" ID="Taskboard" runat="server" width="200" height="500" title="Title">
<Content>
<a href="#" class="x-grid3-focus" tabIndex="-1"></a>
<ext:TextField runat="server" />
</Content>
<KeyMap runat="server">
<ext:keybinding StopEvent="true">
<keys>
<ext:key code="ENTER" />
</keys>
<Listeners>
<Event Handler="Ext.Msg.alert('','ENTER');" />
</Listeners>
</ext:keybinding>
</KeyMap>
<Listeners>
<AfterRender Handler="this.el.on('click', function(e){if(e.getTarget('.x-panel-body',1) || e.getTarget('.x-panel-header')){this.el.child('.x-grid3-focus').focus();}}, this)" />
</Listeners>
</ext:panel>
</form>
</body>
</html>