April 28, 2011

Asp.net DropDownList Selected Value with Jquery

Here's final code



<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title></title>

    <script src="js/JScript.js" type="text/javascript"></script>

    <script type="text/javascript">      



        function btnClick() {



            var countryCode = $('#ddlCountry').val();

            var countryName = $('#ddlCountry').find('option:selected').text();



            $('#txtCode').val(countryCode);

            $('#txtName').val(countryName);

        }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>



        <asp:DropDownList ID="ddlCountry" runat="server" Width="145px" ClientIDMode="Static">

            <asp:ListItem Value="AF">Afghanistan</asp:ListItem>

            <asp:ListItem Value="AL">Albania</asp:ListItem>

            <asp:ListItem Value="DZ">Algeria</asp:ListItem>

            <asp:ListItem Value="AS">American Samoa</asp:ListItem>

            <asp:ListItem Value="AD">Andorra</asp:ListItem>

            <asp:ListItem Value="AO">Angola</asp:ListItem>

            <asp:ListItem Value="AI">Anguilla</asp:ListItem>

            <asp:ListItem Value="PK">Pakistan</asp:ListItem>

        </asp:DropDownList>

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

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

        <input id="btn" type="button" value="OK" onclick="btnClick()" />

    </div>

    </form>

</body>

</html>