Thursday, July 26, 2012

Asp.net jQuery DropDown Change Event Handler


The Selected Item Changed event of the DropDown control can be handled using the .change() event handler of jQuery as follows.

$("#drpCountry").change(function(e) {
    ..           
});

Example

Note: Change the reference of the jQuery
jquery-1.7.2.js files to point to your local directory.

<
html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>DropDownList</title>
    <script type="text/javascript"
src="JavaScript/jquery-1.7.2.js"></script>
    <script type="text/javascript"
language="javascript">
    $(document).ready(function() {
        //
        // Change Event Handler
        $("#drpCountry").change(function(e) {
            alert('New Selected Item : ' + $('#drpCountry option:selected').text());
        });
    });
    </script>
</head>
<body>
    <form id="fromDropDownList" runat="server">
    <div>
        Country:
        <asp:DropDownList ID="drpCountry" runat="server">
            <asp:ListItem Value="USA">United States</asp:ListItem>
            <asp:ListItem Value="UK">United Kingdom</asp:ListItem>
        </asp:DropDownList>       
    </div>
    </form>
</body>
</html>


Search Flipkart Products:
Flipkart.com

No comments: