Sys.UI.DomEvent $addHandler Method
Provides a shortcut to the addHandler method of the Sys.UI.DomEvent class. This member is static and can be invoked without creating an instance of the class.
$addHandler(element, eventName, handler);
Parameters
Term |
Definition |
|---|---|
element |
The DOM element that exposes the event. |
eventName |
The name of the event. |
handler |
The event handler to add. |
Remarks
For details about the method that this shortcut represents, see Sys.UI.DomEvent addHandler Method.
Example
The following example shows how to associate an event handler with an element by using the $addHandler shortcut method.
<%@ Page Language="VB" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html >
<head id="Head1" runat="server">
<title>$addHandler Example</title>
<style type="text/css">
#UpdatePanel1 {
width:300px; height:100px;
}
</style>
</head>
<body>
<h1>$addHandler Example</h1>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"/>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="False" UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" GroupingText="Update Panel">
<asp:Label ID="Label1" runat="server" Text="Click button to see event details."></asp:Label>
<br /><br />
<asp:Button ID="Button1" runat="server" Text="Button" AccessKey="b" />
<br /><br />
<asp:Label ID="Label2" runat="server"></asp:Label>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
<script type="text/javascript">
$addHandler($get("Button1"), "click", processEventInfo);
var myArray = ['altKey', 'button', 'charCode', 'clientX', 'clientY',
'ctrlKey', 'offsetX', 'offsetY', 'screenX', 'screenY',
'shiftKey', 'target', 'type'];
// Event handler displays element properties specified in array
function processEventInfo(eventElement) {
var result = '';
for (var i = 0, l = myArray.length; i < l; i++) {
var arrayVal = myArray[i];
if (typeof(arrayVal) !== 'undefined') {
// Example: eventElement.clientX
result += arrayVal + " = " + eval("eventElement." + arrayVal) + '<br/>';
}
}
$get('Label2').innerHTML = result;
}
</script>
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html >
<head id="Head1" runat="server">
<title>$addHandler Example</title>
<style type="text/css">
#UpdatePanel1 {
width:300px; height:100px;
}
</style>
</head>
<body>
<h1>$addHandler Example</h1>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"/>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" ChildrenAsTriggers="False" UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server" GroupingText="Update Panel">
<asp:Label ID="Label1" runat="server" Text="Click button to see event details."></asp:Label>
<br /><br />
<asp:Button ID="Button1" runat="server" Text="Button" AccessKey="b" />
<br /><br />
<asp:Label ID="Label2" runat="server"></asp:Label>
</asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
<script type="text/javascript">
$addHandler($get("Button1"), "click", processEventInfo);
var myArray = ['altKey', 'button', 'charCode', 'clientX', 'clientY',
'ctrlKey', 'offsetX', 'offsetY', 'screenX', 'screenY',
'shiftKey', 'target', 'type'];
// Event handler displays element properties specified in array
function processEventInfo(eventElement) {
var result = '';
for (var i = 0, l = myArray.length; i < l; i++) {
var arrayVal = myArray[i];
if (typeof(arrayVal) !== 'undefined') {
// Example: eventElement.clientX
result += arrayVal + " = " + eval("eventElement." + arrayVal) + '<br/>';
}
}
$get('Label2').innerHTML = result;
}
</script>