Client-side API / Events

This tutorial demonstrates how you can dynamically attach and detach event handling code. Use OnClientMultiEvent to attach multiple event handlers at start-up time.

Click 'Check' menuitem to make certain that 'OnClientItemClicked' is still exist.
Click 'Detach' menuitem to detach event handler from OnClientItemClicked event.
Click 'Attach' menuitem to attach event handler to OnClientItemClicked event.
Click 'Attach' button to attach event handler to OnClientMouseOver event.
Click 'Detach' button to detach event handler from OnClientMouseOver event.

Ex.: function eventHandler(sender, eventArgs);
// 'sender' represents a menu object on which the event occurred.
// 'eventArgs' specifies the data associated with an event; 'eventArgs.Item' represents an instance of the particular menuitem.

OnClientItemMouseOver : setText

<cu:Menu ID="Menu1" runat="server" Orientation="Horizontal"
OnClientMultiEvent="multiEvent">
    <RootMenu Orientation="Horizontal">
        <cu:MenuItem Text="Check">
        </cu:MenuItem>
        <cu:MenuItem Text="Attach">
        </cu:MenuItem>
        <cu:MenuItem Text="Detach">
        </cu:MenuItem>
    </RootMenu>
</cu:Menu>

<script type="text/javascript" language="javascript">

        function multiEvent(sender)
        {
            // fired BEFORE a regular click event is fired    	                
            sender.AttachEventHandler("OnClientItemClicking", confirmEvent);
            sender.AttachEventHandler("OnClientItemClicked", completeEvent);
            enableAttachButton(sender, false);
        }
      
        function confirmEvent(sender, eventArgs)
        {
            if (eventArgs.Item.Text == "Detach")
            {
                if (sender.IsEventHandlerExist("OnClientItemClicked", completeEvent))
                {
                    if (confirm("Detach handler?") == true)
                    {
	                    enableAttachButton(sender, true);    	                
	                    sender.DetachEventHandler("OnClientItemClicked", completeEvent);
	                }
                }
            }
            if (eventArgs.Item.Text == "Attach")
            {
                if (!sender.IsEventHandlerExist("OnClientItemClicked", completeEvent))
                {
                    sender.AttachEventHandler("OnClientItemClicked", completeEvent);
                    eventArgs.Item.EnableItem(false);
                }
            }
        }
        
        function completeEvent(sender, eventArgs)
        {
             alert("OnClientItemClicked raised");
        }
        
        function enableAttachButton(sender, state)
        {
            var item = sender.FindItemByText("Attach");
	        if (item) { item.EnableItem(state); }
        }
        
        function setText(sender, eventArgs)
        {
             document.getElementById("Text1").value = eventArgs.Item.Text;
        }
</script>