ASP.NET Tutorial/Ajax/AutoComplete
Using Text and Value Pairs with the AutoCompleteExtender
<source lang="csharp">
<%@ Page Language="C#" %> <%@ Register TagPrefix="ajax" Namespace="AjaxControlToolkit"
Assembly="AjaxControlToolkit" %>
<%@ Import Namespace="System.Collections.Generic" %> <%@ Import Namespace="System.Linq" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
[System.Web.Services.WebMethod]
public static string[] GetSuggestions(string prefixText, int count)
{
MyDatabaseDataContext db = new MyDatabaseDataContext();
List<Product> products = db.Products
.Where( m => m.Title.StartsWith(prefixText) )
.OrderBy( m => m.Title )
.Take(count)
.ToList();
return products
.Select( m => AutoCompleteExtender.CreateAutoCompleteItem(
m.Title, m.Id.ToString()))
.ToArray();
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
lblSelectedProductTitle.Text = txtProductTitle.Text;
lblSelectedProductId.Text = ace1Value.Value;
}
</script> <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server">
<title>AutoComplete Page Method</title>
<script type="text/javascript">
function ace1_itemSelected(sender, e)
{
var ace1Value = $get("<%= ace1Value.ClientID %>");
ace1Value.value = e.get_value();
}
</script>
</head> <body>
<form id="form1" runat="server">
<asp:ScriptManager ID="sm1" runat="server" />
<asp:Label
id="lblProductTitle"
Text="Product:"
AssociatedControlID="txtProductTitle"
Runat="server" />
<asp:TextBox
id="txtProductTitle"
AutoComplete="off"
Runat="server" />
<ajax:AutoCompleteExtender
id="ace1"
TargetControlID="txtProductTitle"
ServiceMethod="GetSuggestions"
MinimumPrefixLength="1"
OnClientItemSelected="ace1_itemSelected"
FirstRowSelected="true"
runat="server" />
<asp:HiddenField
id="ace1Value"
Runat="server" />
<asp:Button
id="btnSubmit"
Text="Submit"
OnClick="btnSubmit_Click"
Runat="server" />
Title:
<asp:Label
id="lblSelectedProductTitle"
runat="server" />
Primary Key:
<asp:Label
id="lblSelectedProductId"
runat="server" />
</form>
</body> </html></source>
Using the AutoComplete Control
<source lang="csharp">
<%@ Page Language="C#" %> <%@ Register TagPrefix="ajax" Namespace="AjaxControlToolkit"
Assembly="AjaxControlToolkit" %>
<%@ Import Namespace="System.Linq" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
[System.Web.Services.WebMethod]
public static string[] GetSuggestions(string prefixText, int count)
{
MyDatabaseDataContext db = new MyDatabaseDataContext();
return db.Products
.Where( m => m.Title.StartsWith(prefixText) )
.OrderBy( m => m.Title )
.Select( m => m.Title)
.Take(count)
.ToArray();
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
lblSelectedProductTitle.Text = txtProductTitle.Text;
}
</script> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">
<title>AutoComplete Page Method</title>
</head> <body>
<form id="form1" runat="server">
<asp:ScriptManager ID="sm1" runat="server" />
<asp:Label
id="lblProductTitle"
Text="Product:"
AssociatedControlID="txtProductTitle"
Runat="server" />
<asp:TextBox
id="txtProductTitle"
AutoComplete="off"
Runat="server" />
<ajax:AutoCompleteExtender
id="ace1"
TargetControlID="txtProductTitle"
ServiceMethod="GetSuggestions"
MinimumPrefixLength="1"
runat="server" />
<asp:Button
id="btnSubmit"
Text="Submit"
OnClick="btnSubmit_Click"
Runat="server" />
<asp:Label
id="lblSelectedProductTitle"
runat="server" />
</form>
</body> </html></source>
Using the AutoCompleteExtender with a Web Service Method
<source lang="csharp">
File: FileService.asmx <%@ WebService Language="C#" Class="FileService" %> using System; using System.Web; using System.Web.Services; using System.Web.Services.Protocols; using System.IO; using System.Linq; [WebService(Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.Web.Script.Services.ScriptService] public class FileService : System.Web.Services.WebService {
[WebMethod]
public string[] GetSuggestions(string prefixText, int count)
{
DirectoryInfo dir = new DirectoryInfo("c:\\windows");
return dir
.GetFiles()
.Where( f => f.Name.StartsWith(prefixText) )
.Select( f => f.Name )
.ToArray();
}
}
File: AutoCompleteWebService.aspx <%@ Page Language="C#" %> <%@ Register TagPrefix="ajax" Namespace="AjaxControlToolkit"
Assembly="AjaxControlToolkit" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void btnSubmit_Click(object sender, EventArgs e)
{
lblSelectedFileName.Text = txtFileName.Text;
}
</script> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server">
<title>Show AutoComplete Web Service</title>
</head> <body>
<form id="form1" runat="server">
<asp:ScriptManager ID="sm1" runat="server" />
<asp:Label
id="lblFileName"
Text="File Name:"
AssociatedControlID="txtFileName"
Runat="server" />
<asp:TextBox
id="txtFileName"
AutoComplete="off"
Runat="server" />
<ajax:AutoCompleteExtender
id="ace1"
TargetControlID="txtFileName"
ServiceMethod="GetSuggestions"
ServicePath="~/FileService.asmx"
MinimumPrefixLength="1"
runat="server" />
<asp:Button
id="btnSubmit"
Text="Submit"
OnClick="btnSubmit_Click"
Runat="server"/>
<asp:Label
id="lblSelectedFileName"
runat="server" />
</form>
</body> </html></source>
