We use this extender on binded Dropdownlist.

Initial chamber

Step 1: Open Visual Studio 2010 and create an empty website. Give a suitable name dropdownlist_demo.

Step 2: In Solution Explorer you will get your empty website. Add a web form SQL Database. Follow these steps:

For Web Form:

dropdownlist_demo (Your Empty Website) - Right Click, Add New Item, then Web Form. Name it dropdownlist_demo.aspx.

For SQL Server Database:

dropdownlist_demo (Your Empty Website) - Right Click, Add New Item, then SQL Server Database. Add Database inside the App_Data_folder.

Database chamber

Step 3: Go to your Database [Database.mdf], we will create two tables - tbl_Data and tbl_save. Go to the database.mdf - Table and Add New table, Design your table like the following:

Table - tbl_data (Don’t forget to make ID - Identity Specification - Yes)

table design

Show table data

table

Design chamber

Step 4: Now open your dropdownlist_demo.aspx file, where we create our design for Dropdownlist in ASP.NET.

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
  2. <%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7. <title></title>
  8. <style type="text/css">
  9. .style1 {
  10. width: 576px;
  11. }
  12. </style>
  13. </head>
  15. <body>
  16. <form id="form1" runat="server">
  17. <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"> </asp:ToolkitScriptManager>
  18. <div>
  19. <table style="width:100%;">
  20. <tr>
  21. <td> </td>
  22. <td class="style1"> </td>
  23. <td> </td>
  24. </tr>
  25. <tr>
  26. <td> </td>
  27. <td class="style1">
  28. <asp:DropDownList ID="DropDownList1" runat="server" AppendDataBoundItems="True" DataTextField="country" DataValueField="country" Height="33px" style="margin-left: 267px">
  29. <asp:ListItem>--Select Country--</asp:ListItem>
  30. </asp:DropDownList>
  31. <asp:ListSearchExtender ID="DropDownList1_ListSearchExtender" runat="server" Enabled="True" PromptPosition="Top" PromptText="Type to Search" TargetControlID="DropDownList1"> </asp:ListSearchExtender>
  32. </td>
  33. <td> </td>
  34. </tr>
  35. <tr>
  36. <td> </td>
  37. <td class="style1"> </td>
  38. <td> </td>
  39. </tr>
  40. </table>
  41. </div>
  42. </form>
  43. </body>
  45. </html>
Code chamber

Step 5: Open your dropdownlist_demo.aspx.cs and write some code so that our application starts working.

dropdownlist_demo.aspx.cs
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Web;
  5. using System.Web.UI;
  6. using System.Web.UI.WebControls;
  7. using System.Data;
  8. using System.Data.SqlClient;
  10. public partial class _Default : System.Web.UI.Page
  11. {
  12. protected void Page_Load(object sender, EventArgs e)
  13. {
  14. if (!Page.IsPostBack)
  15. {
  16. refreshdata();
  17. }
  18. }
  21. public void refreshdata()
  22. {
  24. SqlConnection con = new SqlConnection(@"Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True");
  26. SqlCommand cmd = new SqlCommand("select * from tbl_data", con);
  27. SqlDataAdapter sda = new SqlDataAdapter(cmd);
  28. DataTable dt = new DataTable();
  29. sda.Fill(dt);
  31. DropDownList1.DataSource = dt;
  32. DropDownList1.DataBind();
  34. }
  35. }
Output chamber

Output

select country

Hope you liked this. Have a good day!
Thank you for reading.