Auto Complete functionality using Ajax in ASP.NET


Auto Complete​​ Functionality​​ Using Ajax in​​ ASP.NET:

Below is the textbox where you need to type for the product name then auto complete​​ extender will​​ start to fetch the record from list , see the second scree :

Before starting you download Ajax control toolkit from nugget package manger then add this to your toolbox by selecting choose items.. then select your​​ AjaxControlToolkit.dll​​ after clicking on browse button then click ok. It will add all ajax control to your toolbox, then drag on your .aspx page.

 

After typing L in the text box below is the output:​​ 

After typing La, now it more filter based on text:

 

Here I am giving the definition of auto complete .aspx page :

<%@​​ Page​​ Language="C#"​​ AutoEventWireup="true"​​ CodeBehind="frmAutoComplete.aspx.cs"​​ Inherits="DotNetMindsWebBlogPost.frmAutoComplete"​​ %>

 

<!DOCTYPE​​ html>

<%@​​ Register​​ Assembly="AjaxControlToolkit"​​ Namespace="AjaxControlToolkit"​​ TagPrefix="asp"​​ %>

<html​​ xmlns="http://www.w3.org/1999/xhtml">

<head​​ runat="server">

 ​​ ​​ ​​​​ <title></title>

</head>

<body>

 ​​ ​​ ​​​​ <form​​ id="form1"​​ runat="server">

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ <div>

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ <asp:ScriptManager​​ ID="ScriptManager1"​​ runat="server"

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ EnablePageMethods="true">

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ </asp:ScriptManager>

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ <asp:TextBox​​ ID="txtProduct"​​ runat="server"​​ Placeholder="Search By Entering Starting letters of Product Name"​​ Width="500"></asp:TextBox>

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ <asp:AutoCompleteExtender​​ ServiceMethod="GetCompletionList"​​ MinimumPrefixLength="1"​​ CompletionInterval="0"​​ EnableCaching="false"​​ CompletionSetCount="10"​​ TargetControlID="txtProduct"

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ ID="autoCompleteExtender2"​​ runat="server"​​ FirstRowSelected="false"></asp:AutoCompleteExtender>

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ </div>

 

 ​​ ​​ ​​​​ </form>

</body>

</html>

 

 

 

Here is the definition of code behind file:

 

using​​ System.Collections.Generic;

using​​ System.Linq;

 

namespace​​ DotNetMindsWebBlogPost

{

 ​​ ​​ ​​​​ public​​ partial​​ class​​ frmAutoComplete​​ : System.Web.UI.Page

 ​​ ​​ ​​​​ {

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ [System.Web.Script.Services.ScriptMethod()]

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ [System.Web.Services.WebMethod]

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ public​​ static​​ string[] GetCompletionList(string​​ prefixText,​​ int​​ count)

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ {  ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ 

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ List<string> productList =​​ ProductManager.Autocomplete(prefixText);

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ // Find All Matching Products

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ var​​ list =​​ from​​ p​​ in​​ productList

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ where​​ p.ToUpper().Contains(prefixText.ToUpper())

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ select​​ p;

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ //Convert to Array as We need to return Array

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ string[] prefixTextArray = list.ToArray<string>();

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ // Where(x => (x.Name.ToLower().Contains(Name.ToLower())));

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ //Return Selected Products

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ return​​ prefixTextArray;

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ }

 ​​ ​​ ​​​​ } ​​ 

 

 ​​ ​​ ​​​​ public​​ static​​ class​​ ProductManager

 ​​ ​​ ​​​​ {

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ public​​ static​​ List<string> Autocomplete(string​​ searchText)

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ {

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ List<string> lstProduct =​​ new​​ List<string>();

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ lstProduct.Add("Laptop HP");

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ lstProduct.Add("Laptop Lenovo");

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ lstProduct.Add("Mobile Samsung");

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ lstProduct.Add("Mobile Microsoft");

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ lstProduct.Add("Speaker");

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ lstProduct.Add("Tab");

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ return​​ lstProduct;

 

 

 ​​ ​​ ​​ ​​ ​​ ​​ ​​​​ }

 ​​ ​​ ​​​​ }

}

 


Recommended Book for MVC : List of Some Important books for .NET Framework, C#, MVC, WCF



 

 

(Visited 78 times, 1 visits today)

Leave a Reply

Your email address will not be published. Required fields are marked *