Minifycode 2020-02-13 Viewed 1K times ASP.NET

In this article, you will learn how to use the DropDownList's SelectedIndexChanged event


The SelectedIndexChanged event of ASP.Net DropDownList When an item is changed in ASP.Net DropDownList, the following OnSelectedIndexChanged event handler is executed, Inside the event handler, the selected Text and Value of the DropDownList Selected Item is fetched and displayed using JavaScript Alert message box


<asp:DropDownList ID="ddlCity" runat="server" AutoPostBack = "true" OnSelectedIndexChanged = "OnSelectedIndexChanged">
    <asp:ListItem Text="Delhi" Value="1" />
    <asp:ListItem Text="Mumbai" Value="2" />
    <asp:ListItem Text="Noida" Value="3" />


protected void OnSelectedIndexChanged(object sender, EventArgs e)
    string message = ddlCity.SelectedItem.Text + " - " + ddlCity.SelectedItem.Value;
    ClientScript.RegisterStartupScript(this.GetType(), "alert", "alert('" + message + "');", true);

How to use the DropDownList's SelectedIndexChanged event
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html> <html> <head> <title>Asp.Net Repeater Control</title> </head> <body> <form id="form1" runat="server"> <div style="font:13px Verdana;width:310px;"> <asp:ScriptManager ID="scriptManager" runat="server" EnablePageMethods="true" /> <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional"> <ContentTemplate> <h3>Asp.Net Repeater Control</h3> <%--THE REPEATER CONTROL.--%> <asp:Repeater id="rp" runat="server"> <%--HEADER OF THE REPEATER--%> <HeaderTemplate> <table border="0" width="200px"> </HeaderTemplate> <%--SHOWING ITEMS--%> <ItemTemplate> <tr> <td style="padding:2px; border:solid 1px #CCC;"> <asp:Label Text='<%# Container.DataItem.ToString() %>' runat="server"></asp:Label> </td> </tr> </ItemTemplate> <%--ALTERNATE TEMPLATE (SHOWING ITEMS IN DIFFERENT COLOR--%> <AlternatingItemTemplate> <tr> <td style="padding:2px; border:solid 1px #CCC; background:#EAF7FB; width:200px;"> <asp:Label Text='<%# Container.DataItem.ToString() %>' runat="server"></asp:Label> </td> </tr> </AlternatingItemTemplate> <%--REPEATER FOOTER--%> <FooterTemplate> </table> <div style="padding:20px 0;"> <asp:Label ID="lblFoot" runat="server"></asp:Label> </div> </FooterTemplate> </asp:Repeater> <%--BUTTON CONTROL--%> <asp:Button ID="btVF" Text="View Files" AutoPostBack="true" OnClick="Show" Font-Names="sanserif" Font-Italic="true" Font-Size="155%" runat="server" /> </ContentTemplate> <Triggers> <asp:AsyncPostBackTrigger ControlID="PostBackTrigger" /> </Triggers> </asp:UpdatePanel> </div> </form> </body> </html> using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; using System.IO; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) {} protected void Show(object sender, EventArgs e) { DirectoryInfo Folder = new DirectoryInfo(Server.MapPath("Files\\")); FileInfo[] fileList = Folder.GetFiles("*.*"); //BIND THE FILE LIST WITH THE REPEATER CONTROL. rp.DataSource = fileList; rp.DataBind(); } } Adding the <AlternatingTemplate> below the <ItemTemplate> will show files with a different background color for every alternate row. <AlternatingItemTemplate> <div style="padding:3px; border:solid 1px #FFF; background:#black"> <asp:Label Text='<%# Container.DataItem.ToString() %>' runat="server"></asp:Label> </div> </AlternatingItemTemplate> </AlternatingItemTemplate> <SeparatorTemplate><hr /> </SeparatorTemplate> Add the <HeaderTemplate> element just above the <ItemTemplate> <HeaderTemplate> <div style="padding-bottom:20px"><strong>Files</strong> (Header)</div> </HeaderTemplate> Repeater with <FooterTemplate> element <FooterTemplate> <div style="padding-top:20px"><asp:Label ID="lblFooter" runat="server"></asp:Label></div> </FooterTemplate> Code Behind In C# Control ft = rp.Controls[rep.Controls.Count - 1].Controls[0]; Label lbl_Footer = ft.FindControl("lblFooter") as Label; lbl_Footer.Text = "Showing total <b>" + fileList.Length + "</b> files in the Footer.";