Home | Contact Us | FAQ | Search & Site Map | Link to Us
Sign In | Join | Other 45 Sites in Network
HomeAnnouncementsFree MagazinesWhite PapersSubmit Content
Discussion GroupsASP.NETWindows FormsLanguages.NET FrameworkVisual Studio.NET
Articles.NET FrameworkASP.NETToolsWindows Forms
.NET DirectoryOpen Source ProjectsUser GroupsWeb Resources
Related Topics
Visual Basic 6SQL ServerMS AccessOther DB ProductsMS Server ProductsMore Topics ...

.NET Forum / ASP.NET / Building Controls / March 2007

Tip: Looking for answers? Try searching our database.

[AJAX] custom control implementing IScriptControl : no key events notification in firefox

Thread view: 
Enable EMail Alerts  Start New Thread
Thread rating: 
Patrick Ruzand - 13 Mar 2007 16:11 GMT
Hi,

I have written a very simple custom control that renders itself as a DIV.
This custom control implements the System.Web.Extensions.IScriptControl
interface.
Here is an extract of the server code:

public partial class MyControl : UserControl, IScriptControl
{
   public override void RenderControl(HtmlTextWriter writer) {
       // Some style attributes are set here
       writer.RenderBeginTag(HtmlTextWriterTag.Div);
       writer.RenderEndTag();
       base.RenderControl(writer);
   }

   protected override void OnPreRender(EventArgs e) {
       if (!this.DesignMode) {
           // Test for ScriptManager and register if it exists
           ScriptManager sm = ScriptManager.GetCurrent(Page);
           if (sm == null)
               throw new HttpException("A ScriptManager control must exist
on the current page.");
           sm.RegisterScriptControl(this);
       }
       base.OnPreRender(e);
   }

   protected override void Render(HtmlTextWriter writer) {
       if (!this.DesignMode) {
           ScriptManager sm = ScriptManager.GetCurrent(Page);
           if (sm == null)
               throw new HttpException("A ScriptManager control must exist
on the current page.");
           sm.RegisterScriptDescriptors(this);
       }
       base.Render(writer);
   }

   public System.Collections.Generic.IEnumerable<ScriptDescriptor>
GetScriptDescriptors() {
       ScriptControlDescriptor descriptor = new
ScriptControlDescriptor("Sample.MyControl", this.ID);
       return new ScriptDescriptor[] { descriptor };
   }

   public System.Collections.Generic.IEnumerable<ScriptReference>
GetScriptReferences() {
       ScriptReference reference =
           new ScriptReference("mycontrol.js");
       return new ScriptReference[] { reference };
   }
}

On the client side, this control has a corresponding javascript class.
In the initialize method, I add a dummy handler on the 'keydown' event
that pops an alert message.
Here is the corresponding javascript code:

Type.registerNamespace("Sample");

Sample.MyControl = function(element) {
   Sample.MyControl.initializeBase(this, [element]);
   this._keydownHandler = null;
}

Sample.MyControl.prototype = {
   initialize : function() {
       Sample.MyControl.callBaseMethod(this, 'initialize');
       this._keydownHandler = Function.createDelegate(this,
this._onkeydown);
       $addHandler(this.get_element(), 'keydown', this._keydownHandler);
   },

   dispose :  function() {
       var elt = this.get_element();
       if (elt) {
           $removeHandler(elt, 'keydown', this._keydownHandler);
       }
       this._keydownHandler = null;
       Sample.MyControl.callBaseMethod(this, 'dispose');
   },

   _onkeydown : function(e) {
       alert('onkeydown');
   }
}

Sample.MyControl.registerClass('Sample.MyControl', Sys.UI.Control);

if (typeof(Sys) !== 'undefined')
   Sys.Application.notifyScriptLoaded();

My problem is while it works well under IE, it does not work in Firefox.
I may surely have done a silly mistake, but I can't find it til now...
Let me know if you need more information.

Thanks for your help,

Signature

Patrick

Walter Wang [MSFT] - 14 Mar 2007 08:10 GMT
Hi Patrick,

According to this tutorial:
http://ajax.asp.net/docs/tutorials/IScriptControlTutorial1.aspx, you should
use the ClientID instead of ID property when creating the
ScriptControlDescriptor since this will be used at client-side:

   public System.Collections.Generic.IEnumerable<ScriptDescriptor>
GetScriptDescriptors()
   {
       ScriptControlDescriptor descriptor = new
ScriptControlDescriptor("Sample.MyControl", this.ClientID);
       return new ScriptDescriptor[] { descriptor };
   }

Also, I'm having trouble to use your code on a new UserControl, would you
please post the complete code including the .ascx content? Thanks.

Sincerely,
Walter Wang (wawang@online.microsoft.com, remove 'online.')
Microsoft Online Community Support

==================================================
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/subscriptions/managednewsgroups/default.aspx#notif
ications. If you are using Outlook Express, please make sure you clear the
check box "Tools/Options/Read: Get 300 headers at a time" to see your reply
promptly.

Note: The MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response from the community or a Microsoft Support
Engineer within 1 business day is acceptable. Please note that each follow
up response may take approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution. The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions or complex
project analysis and dump analysis issues. Issues of this nature are best
handled working with a dedicated Microsoft Support Engineer by contacting
Microsoft Customer Support Services (CSS) at
http://msdn.microsoft.com/subscriptions/support/default.aspx.
==================================================

This posting is provided "AS IS" with no warranties, and confers no rights.
Patrick Ruzand - 14 Mar 2007 10:30 GMT
Hi,

> Hi Patrick,
>
[quoted text clipped - 3 lines]
> use the ClientID instead of ID property when creating the
> ScriptControlDescriptor since this will be used at client-side:

Ok, thanks. I fixed it. But the probleme remains.

> Also, I'm having trouble to use your code on a new UserControl, would you
> please post the complete code including the .ascx content? Thanks.

I have put my VS2005 website here:
http://www.cijoint.fr/cij1228731447228.zip

Do not hesitate to tell me if you prefer that I post copy/paste
the source code in a message in this group.

Note that it is a testcase and not my real project which is by far more
complicated.

Thanks for your help,
Patrick
Walter Wang [MSFT] - 15 Mar 2007 11:00 GMT
Hi Patrick,

Downloading the code from your website is fine.

I can now see the issue you mentioned clearly. However, I don't think this
issue is related to asp.net at all: consider following simple html page:

<!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>
   <title>Untitled Page</title>
</head>
<body>
   <div id="mydiv" style="width:100px;height:100px;background-color:blue"
onkeydown="javascript:alert('onkeydown')"></div>
   <input type="text" id="mytxt" onkeydown="javascript:alert('mytxt')" />
</body>
</html>

Try this html page in IE and FireFox, you will see when you click on the
div and press any key, FireFox will not show a messagebox. While the
textbox's onkeydown event works fine on both IE and FireFox. I guess this
is how FireFox handles div's onkeydown event? I suggest you check this on
FireFox's support site.

By the way, you should always use ClientID when generating client-side
content, which means you need to change the code in your OnRenderControl to:

writer.AddAttribute(HtmlTextWriterAttribute.Id, this.ClientID);

Hope this helps.

Regards,
Walter Wang (wawang@online.microsoft.com, remove 'online.')
Microsoft Online Community Support

==================================================
When responding to posts, please "Reply to Group" via your newsreader so
that others may learn and benefit from your issue.
==================================================

This posting is provided "AS IS" with no warranties, and confers no rights.
Patrick Ruzand - 15 Mar 2007 15:13 GMT
Hi Walter,

I made some progress on this issue. I finally found a workaround.
Please find below my comments.

> I can now see the issue you mentioned clearly. However, I don't think this
> issue is related to asp.net at all: consider following simple html page:
[quoted text clipped - 14 lines]
> Try this html page in IE and FireFox, you will see when you click on the
> div and press any key, FireFox will not show a messagebox.

Indeed, but here you use the 'onkeydown' html element attribute.

You will find below the code of an html page that basically does what
the MS Ajax library is doing at init time using the DOM API.
As it is, it reproduces the behavior I have with MS js lib.
That is, the keydown event handler is not called.

Doing more tests, I found that in order to the key event  handler is
called under Firefox, the div elt must have its 'tabIndex' property set
to -1.
In this case, the keyboard event handlers are called as expected, as under
IE.
(To see the fixed behavior in the sample below, uncomment the line
"elt.tabIndex = -1;").

I don't know whether such a workaround could be integrated into the MS ajax
js
library, as it might be too intrusive, and whether it is a bug or not.
I really don't know so I let you decide what to do with that. On my side,
the fix is easy and the issue is fixed.

> By the way, you should always use ClientID when generating client-side
> content, which means you need to change the code in your OnRenderControl
> to:
>
> writer.AddAttribute(HtmlTextWriterAttribute.Id, this.ClientID);

Yes, thanks. It seems I wrote my sample too fast :-)

Thanks for your help,

Patrick
Patrick Ruzand - 15 Mar 2007 15:18 GMT
> Hi Walter,
>
> I made some progress on this issue. I finally found a workaround.
> Please find below my comments.
[...]
> You will find below the code of an html page that basically does what
> the MS Ajax library is doing at init time using the DOM API.
> As it is, it reproduces the behavior I have with MS js lib.

it's better with the code...
---8<---8<---8<---8<---8<---8<---8<---8<---8<---8<---8<---
<!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>

<title>Untitled Page</title>

</head>

<body>

<script type="text/javascript">

function wireEventHandler(target, eventName, handler) {

var elt = document.getElementById(target);

if (elt.addEventListener) {

// Begin Firefox workaround

// *** Uncomment the line below to fix the issue ***

// elt.tabIndex = -1;

// End Firefox workaround

elt.addEventListener(eventName, handler, true);

}

}

function foo(e) {

alert('onkeydown: ' + e.target.id);

}

</script>

<input type="text" id="text" />

<div id="mydiv" style="width:100px;height:100px;background-color:blue"
></div>

<div style="left: 5px; width: 500px; position: absolute; top: 105px; height:
500px">

<div id="MyControl1"
style="background-color:red;position:relative;left:5px;top:5px;width:500px;height:500px;">

</div>

</div>

<script type="text/javascript">

wireEventHandler('MyControl1','keydown', foo);

</script>

</body>

</html>

Free Magazines

Get these publications absolutely FREE for up to 12 months. There are no hidden fees and no obligation. Simply choose a title, complete the application form and submit it. Read more ...

Oracle MagazineNetwork ComputingComputer WorldBio-IT WorldeWeekInformation WeekInfosecurity
 
Sign In
Join
My Latest Posts
My Monitored Threads
My Blog
My Photo Gallery
My Profile
My Homepage

Start New Thread
Enable EMail Alerts
Rate this Thread



©2008 Advenet LLC   Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.