Search This Blog

Tuesday 10 March 2015

How to Implement Autocomplete textbox in ASP.Net Or AJAX AutoCompleteExtender Example in ASP.Net

Step 1 :- AutoFill.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AutoFill.aspx.cs" Inherits="Demo.AutoFill" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ToolkitScriptManager ID="ScriptManager1" runat="server"></asp:ToolkitScriptManager>
        <div>
            <b>Searching Name in Database Record</b>
            <br />
            <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
            <asp:AutoCompleteExtender ID="AutoCompleteExtender2" runat="server" TargetControlID="TextBox2" ServiceMethod="FillTextBoxFromDatabase" MinimumPrefixLength="1" CompletionInterval="10" UseContextKey="True"></asp:AutoCompleteExtender>
        </div>
    </form>
</body>
</html>

Step 2 :- AutoFill.aspx.cs

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Demo
{
    public partial class AutoFill : System.Web.UI.Page
    {
        static SqlConnection con;

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
            }
        }

        [WebMethod]
        public static List<string> FillTextBoxFromDatabase(string prefixText)
        {
            List<string> listRegionName = new List<string>();

            con = new SqlConnection("server=Server Name; database=Database Name; uid=User ID; pwd=Password");

            SqlCommand cmd = new SqlCommand();

            cmd.CommandText = "select RegionID, RegionName from IC_RegionMaster where RegionName like @SearchText + '%'";

            cmd.Parameters.AddWithValue("@SearchText", prefixText);

            cmd.Connection = con;

            con.Open();

            SqlDataReader dr = cmd.ExecuteReader();

            while (dr.Read())
            {
                listRegionName.Add(dr["RegionName"].ToString());
            }

            con.Close();

            return listRegionName;
        }
    }
}

Note :-


How to Implement Autocomplete textbox using DataTable.Select Method in ASP.Net Or AJAX AutoCompleteExtender Example in ASP.Net

 Step 1:- AutoFill.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AutoFill.aspx.cs" Inherits="Demo.AutoFill" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ToolkitScriptManager ID="ScriptManager1" runat="server"></asp:ToolkitScriptManager>
        <div>
           <b>Searching Name in DataTable Record</b>
            <br />
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <asp:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" TargetControlID="TextBox1" ServiceMethod="FillTextBoxFromDataTable" MinimumPrefixLength="1" CompletionInterval="10" UseContextKey="True"></asp:AutoCompleteExtender>
        </div>
    </form>
</body>
</html>

Step 2:- AutoFill.aspx.cs

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Demo
{
    public partial class AutoFill : System.Web.UI.Page
    {
        static SqlConnection con;
        static DataTable dt, dt1 = null;
        static string[] nameArray = { "Ravi", "Gopal", "Ramesh", "Albert", "Sidharth", "Yasu", "Basu", "Pinky", "Sonam", "Ram", "Shyam" };
      
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                dt = new DataTable();
                dt.Columns.Add("ID", typeof(int));
                dt.Columns.Add("Name", typeof(string));

                DataRow dr;

                for (int i = 1; i < nameArray.Count(); i++)
                {
                    dr = dt.NewRow();

                    dr[0] = i;
                    dr[1] = nameArray[i];

                    dt.Rows.Add(dr);
                }
            }
        }

        [WebMethod]
        public static List<string> FillTextBoxFromDataTable(string prefixText)
        {
            List<string> listName = new List<string>();

            DataView dw = new DataView(dt);

            dt1 = new DataTable();

            dt1 = dw.ToTable("Selected", false, "Name");

            for (int i = 0; i < dt1.Rows.Count; i++)
            {
                listName.Add(dt1.Rows[i]["Name"].ToString());
            }

            // OR

            //string expression = "Name like '" + prefixText + "%'";

            //DataRow[] dr = dt.Select(expression);

            //for (int i = 0; i < dr.Count(); i++)
            //{
            //    listName.Add(dr[i].ItemArray[1].ToString());
            //}

            return listName;
        }
    }
}


Note :-

Download AjaxControlToolkit.dll