April 25, 2015 by Nitesh

How To Clear Items of ASP.Net DropDownList Control Using jQuery


In this post, we will see how can we clear all items of a ASP.Net DropDownList control using jQuery.

To start with, we will define a ASP.Net DropDownList control on our .aspx page and a button with the help of which we will be clearing the items of the DropDownList control. We assign it a specific class using the CssClass property that we can refer to in jQuery.

<asp:dropdownlist ID="lstPlayers" CssClass="lst-clear" runat="server">
            <asp:listitem Text="Sachin" Value="Sachin"></asp:listitem>
            <asp:listitem Text="Sehwag" Value="Sehwag"></asp:listitem>
            <asp:listitem Text="Dravid" Value="Dravid"></asp:listitem>
            <asp:listitem Text="Yuvraj" Value="Yuvraj"></asp:listitem>
            <asp:listitem Text="MS Dhoni" Value="MS Dhoni"></asp:listitem>
<input type="button" id="btnClear" value="Clear Items" />

After our controls are defined, we bind the click event of the button to clear the items using the .empty() function as below –

    <script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script type="text/javascript">
            $(function () {            
                $("#btnClear").click(function () {

Hope you like this. Keep learning and sharing!


Support us!

If you like this site please help and make click on any of these buttons!

Powered by WordPress Popup