how to use Ajax Toolkit AutoCompleteExtender Control in ASP.Net Web Application

Leave a Comment
In this tutorial, we have to learn how to use Ajax Toolkit AutoCompleteExtender Control in ASP.Net Web Application in C#.

First Create Empty ASP.Net Web Application and below code into Default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="AjaxAutoCompleteDemo.Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <div>
        <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
        <cc1:AutoCompleteExtender ID="AutoCompleteExtender1" runat="server" TargetControlID="txtName"
MinimumPrefixLength="1" EnableCaching="true" CompletionSetCount="1" CompletionInterval="1000" ServiceMethod="SelectMatchRecord"  FirstRowSelected = "false" />
    </div>
    </form>
</body>
</html>

Now add below code to Default.aspx.cs page.
using System;
using System.Collections.Generic;
using System.Data;
using System.Data.SqlClient;
namespace AjaxAutoCompleteDemo
{
    public partial class Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
        }
        [System.Web.Script.Services.ScriptMethod()]
        [System.Web.Services.WebMethod]
        public static string[] SelectMatchRecord(string prefixText)
        {
            SqlConnection con = new SqlConnection(@"Data Source=(LocalDB)\v11.0;AttachDbFilename='c:\users\ka.patel\documents\visual studio 2012\Projects\AjaxAutoCompleteDemo\AjaxAutoCompleteDemo\App_Data\Database.mdf';Integrated Security=True");
            SqlCommand com = new SqlCommand("Select Name From Student where Name like @Name+'%'", con);
            com.Parameters.AddWithValue("@Name",prefixText);
            com.CommandType = CommandType.Text;
            DataTable dt = new DataTable();
            SqlDataAdapter sdt = new SqlDataAdapter(com);
            sdt.Fill(dt);
            //var objQuoteMst = new clsBms_quote_mst { Policy_Number = prefixText.Trim() };
            //DataTable dtTemp = objQuoteMst.SelectAllPolicyNo();
            var lstMatchRecord = new List<string>();
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                lstMatchRecord.Add(dt.Rows[i]["Name"].ToString());
            }
            return lstMatchRecord.ToArray();
        }
    }
}

You can see in above we have used static method that return Name of Student list and we will specify this method to autocompleteextender control(ServiceMethod="SelectMatchRecord").

Download Complete Source Code

0 comments:

Post a Comment