Introduction:
Here I will explain how to raise dropdownlist selectedindexchanged event in JavaScript using asp.net.
Description:
In previous articles I explained How to bind dropdownlist using JQuery and how to get dropdownlist selected value and text using JQuery and many articles relating to JQuery. Now I will explain how to raise dropdownlist selectedindexchanged event in JavaScript using asp.net.
In previous articles I explained How to bind dropdownlist using JQuery and how to get dropdownlist selected value and text using JQuery and many articles relating to JQuery. Now I will explain how to raise dropdownlist selectedindexchanged event in JavaScript using asp.net.
Generally
we will use onchange event in JavScript
to raise dropdownlist selectedindexchanged event in JavaScript like as shown
below
<script type="text/javascript">
function GetCountryDetails() {
var parm =
document.getElementById("ddlCountry");
var strUser =
parm.options[parm.selectedIndex].text;
document.getElementById('lbltxt').innerHTML = strUser;
document.getElementById('lblid').innerHTML =
parm.options[parm.selectedIndex].value;
}
</script>
<asp:DropDownList ID="ddlCountry" runat="server"
onchange="GetCountryDetails()">
|
Example
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Dropdownlist
selectedindexchanged event in JavaScript</title>
<script type="text/javascript">
function GetCountryDetails() {
var parm =
document.getElementById("ddlCountry");
var strCountry =
parm.options[parm.selectedIndex].text;
document.getElementById('lbltxt').innerHTML = strCountry;
document.getElementById('lblid').innerHTML =
parm.options[parm.selectedIndex].value;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table width="50%">
<tr><td align="right">Select
Country:</td>
<td>
<asp:DropDownList ID="ddlCountry" runat="server"
onchange="GetCountryDetails()">
<asp:ListItem Text="Select" Value="0" />
<asp:ListItem Text="Australia" Value="1" />
<asp:ListItem Text="India" Value="2" />
<asp:ListItem Text="England" Value="3" />
<asp:ListItem Text="USA" Value="4" />
<asp:ListItem Text="China" Value="5" />
</asp:DropDownList>
</td>
</tr>
<tr><td align="right" style="font-family:Verdana;
font-size:10pt;
color:Black">Selected
Text:</td>
<td><b><label id="lbltxt" /></b></td>
</tr>
<tr><td align="right">Selected
text value:</td>
<td><b><label id="lblid" /></b></td>
</tr>
</table>
</form>
</body>
</html>
|
Demo
To
check demo change dropdown values
|
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
Subscribe by RSS
Subscribe by Email
|
|||
7 comments :
I want code for how to add comment on webpage
I want the Code Like Country Dropdownlist by Selecting respective country State dropdown records can be bind through JQuery
How to assign data to drop down list based condition from one dropdownlist to other dropdownlist with in single table.
Example :I have two droupdownlist(ddl1,ddl2)in this ddl1 I have a mangerslist(m1,m2..etc) & m1 contains emplyees(e1,e2,e5..etc)&m2 contains
employees(e3,e4..etc).If I select m1 in ddl1 I want to display e1,e2,e5..etc in ddl2
please help me.
note: m1,m2.etc and e1,e2,e3,e4,e5..etc all are containing in single table
Amazing work!
Hi, your function is not working on Gridview dropdown onchange event.
You solve my JavaScript problme, thanks.
But, it is not work with master page. How is that possible ?
Note: Only a member of this blog may post a comment.