DropDownList Client Side Event| KT.UI for ASP.NET AJAX

DropDownList Client Side Event in ASP.NET

Home > How to > DropDownList Client Event

KT.UI for ASP.NET AJAX DropDownList Library has been perfectly develoepd to enable users to create and set a variety of DropDownList controls, such as DropDownList elements settings, DropDownList features defining, DropDownList templates customizing, DropDownList style items specifications, as well as DropDownList client side event settings. This page mainly focuses on DropDownList client side events.

We are going to explain DropDownList client side events from following three modules:

Brief introductions to the entire supportable DropDownList client side events of KT.UI DropDownList control
Sample JavaScript codes for setting and programming user-defined DropDownList client side events
Other relevant guides on PerDropDownList server side event and client side template

Overview of DropDownList Client Side Events

We give following table list that contains various client side events, please read to be well informed of the detailed interpretations.

OnClientDropDownOpening : this event happens before the drop-down list is opened.
OnClientDropDownOpened : this event starts after the drop-down list has been opened.
OnClientItemSelecting: this event fires before the item's selection.
OnClientItemSelected: this event happens after the item has been selected.
OnClientSelectedIndexChanged: this event occurs after the SelectedIndex has been changed according to a user operation.
OnClientDropDownClosing: this event fires before the drop-down list closes.
OnClientDropDownClosed: this event occurs after the drop-down is closed.
OnClientLoad: this event happens after the PerDropDownList control has been completely initialized on the client-side.
OnClientItemDataBound: this event fires for any DropDownList item that is set up during web service binding.

JavaScript Sample Codes for DropDownList Client Side Events

This part is assigned to offer the demo javascript codes to users to write a javascript function that can be called when the DropDownList client side events occur.

Please refer to following detailed sample codes.


<script type="text/javascript">
            function logEvent(eventInfo) {
                var EventLogConsole = $get("<%=EventLogConsole1.ClientID%>");
                EventLogConsole.innerHTML += eventInfo + "<br/>";
            }
            function onDropDownOpening(sender) {
                logEvent("Drop Down opening");
            }

            function onDropDownOpened(sender) {
                logEvent("Drop Down opened");
            }

            function onDropDownClosing(sender) {
                logEvent("Drop Down closing");
            }

            function onDropDownClosed(sender) {
                logEvent("Drop Down closed");
            }

            function onSelectedIndexChanged(sender, args) {
                var selectedItem = sender.get_selectedItem();
                var selectedItemText = selectedItem != null ? selectedItem.get_text() : sender.get_text();

                logEvent("Index changed to Item '" + selectedItemText + "'");
            }

            function onItemSelecting(sender, args) {
                logEvent("ItemSelecting: " + args.get_item().get_text());
            }

            function onItemSelected(sender, args) {
                logEvent("ItemSelected: " + args.get_item().get_text());
            }

            function onItemDataBound(sender, args) {
                logEvent("Item databound. Item text: " + args.get_item().get_text());
            }
            /*]]>*/
        </script>

More Related DropDownList Server Programming Events

Besides DropDownList client side event guide, we also offer users the detailed explanations of DropDownList server side event and client side template within ASP.NET programming project. Please check out following quick links.

ASP.NET AJAX UI Controls

ASP.NET AJAX Chart UI Control ASP.NET AJAX Grid UI Control ASP.NET AJAX Barcode UI Control ASP.NET AJAX Button UI Control ASP.NET AJAX Calendar UI Control ASP.NET AJAX NavigationBar UI Control ASP.NET AJAX Captcha UI Control ASP.NET AJAX Color Editor UI Control ASP.NET AJAX ComboBox UI Control ASP.NET AJAX DataPager UI Control ASP.NET AJAX Dock UI Control

ASP.NET AJAX DropDownList UI Control

Overview Getting Started

Features

Virtual Scrolling

Client Prpgramming

Data Binding Template

DropDownList Event

Server Programming

Data Binding to Array Template DropDownList Event ASP.NET AJAX DropDownTree UI Control ASP.NET AJAX HtmlEditor UI Control ASP.NET AJAX FileManager UI Control ASP.NET AJAX Filter UI Control ASP.NET AJAX Input UI Control ASP.NET AJAX ListBox UI Control ASP.NET AJAX ListView UI Control ASP.NET AJAX ToolBar UI Control ASP.NET AJAX TabControl UI Control ASP.NET AJAX Menu UI Control ASP.NET AJAX ToolTip UI Control