Get Selected item from DropDownList using JQuery

In this asp.net post we will learn how to Get Selected item from DropDownList using JQuery in ASP.Net.

First, Download JQuery library from http://jquery.com. and include in web page at head section.

Design the ASP.Net web form with one Button, one TextBox and one DroDownList control.

The ASP.Net web page design is :

Get Selected item from Dropdownlist using JQuery

Get Selected item from Dropdownlist using JQuery

Write below JQuery code at head section in aspx page.

<head runat=”server”>
<title>JQuery in ASP.Net</title>
<script src=”jquery-1.4.3.min.js” type=”text/javascript”></script>
<script>
$(document).ready(function() {
$(“#Button1″).click(function() {
alert($(‘#<%=DropDownList1.ClientID%> option:selected’).text());
$(‘#<%=TextBox1.ClientID%>’).val($(‘#<%=DropDownList1.ClientID%> option:selected’).text());

});
});
</script>
</head>

The Get Selected item from DropDownList using JQuery example out put is :

Get Selected item from Dropdownlist using JQuery

Get Selected item from Dropdownlist using JQuery

Get Selected item from Dropdownlist using JQuery

Get Selected item from Dropdownlist using JQuery

Get Selected item from Dropdownlist using JQuery

Get Selected item from Dropdownlist using JQuery

Leave a Reply

Your email address will not be published. Required fields are marked *

5 + 5 =


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">