Click here to Skip to main content
15,886,873 members
Articles / Web Development / HTML

AJAX AutoComplete/AutoSuggest TextBox

Rate me:
Please Sign up or sign in to vote.
4.86/5 (51 votes)
2 Oct 20074 min read 881.2K   7K   147  
An article on AJAX AutoSuggest control
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Collections.Generic;
using System.Web.UI.HtmlControls;

public partial class DataViewBinding : System.Web.UI.Page
{
	#region Session Variables
	private DataTable _dtBands
	{
		get { return (DataTable)Session["_dtBands"]; }
		set { Session["_dtBands"] = value; }
	}
	#endregion

	protected void Page_Load(object sender, EventArgs e)
    {
		if (!this.IsPostBack)
		{
			FillDataTable();
		}
    }
	
	protected override void OnInit(EventArgs e)
	{
		base.OnInit(e);
		this.asbFavoriteBand.TextChanged += new Anthem.AutoSuggestBox.TextChangedEventHandler(asbFavoriteBand_TextChanged);
		this.asbFavoriteBand.SelectedValueChanged += new Anthem.AutoSuggestBox.SelectedValueChangedHandler(asbFavoriteBand_SelectedValueChanged);
		this.btnValidate.Click += new EventHandler(btnValidate_Click);
	}


	#region FillDataTable
	/// <summary>
	/// This method fills the datatable that is used in this example
	/// On a real world application you usually would use a database
	/// </summary>
	private void FillDataTable()
	{
		_dtBands = new DataTable();
		_dtBands.Columns.Add(new DataColumn("BandID", typeof(int)));
		_dtBands.Columns.Add(new DataColumn("BandName", typeof(string)));

		DataRow row = _dtBands.NewRow();
		row["BandID"] = 1;
		row["BandName"] = "Dream Theater";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 2;
		row["BandName"] = "Pain of Salvation";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 3;
		row["BandName"] = "Savatage";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 4;
		row["BandName"] = "Iron Maiden";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 5;
		row["BandName"] = "Symphony X";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 6;
		row["BandName"] = "Angra";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 7;
		row["BandName"] = "Metallica";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 8;
		row["BandName"] = "System of a Down";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 9;
		row["BandName"] = "Whitesnake";
		_dtBands.Rows.Add(row);

		row = _dtBands.NewRow();
		row["BandID"] = 10;
		row["BandName"] = "Van Halen";
		_dtBands.Rows.Add(row);
	}
	#endregion

	void asbFavoriteBand_SelectedValueChanged(object source, EventArgs e)
	{
		lblID.Text = asbFavoriteBand.SelectedValue;
		lblName.Text = asbFavoriteBand.Text;
		//Tells the anthem library to update the controls
		lblID.UpdateAfterCallBack = true;
		lblName.UpdateAfterCallBack = true;
	}

	/// <summary>
	/// This event handler is used to fill the suggest list that appears as the user types
	/// Usually you would query a database, but for the sake of simplicity we are querying an in-memory datatable
	/// </summary>	
	void asbFavoriteBand_TextChanged(object source, Anthem.AutoSuggestEventArgs e)
	{
		//Creates a dataview of the session's datatable		
		DataView dv = new DataView(_dtBands);
		//Filters the datatable based on the CurrentText property
		dv.RowFilter = string.Format("BandName LIKE '%{0}%'", e.CurrentText);
		//Sets the dataview as the control's datasource				
		asbFavoriteBand.DataSource = dv;
		asbFavoriteBand.DataBind();
	}

	void btnValidate_Click(object sender, EventArgs e)
	{
		if (this.IsValid)		
			lblIsValid.Text = "Yes";		
		else
			lblIsValid.Text = "No";

		lblIsValid.UpdateAfterCallBack = true;
	}
}

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article has no explicit license attached to it but may contain usage terms in the article text or the download files themselves. If in doubt please contact the author via the discussion board below.

A list of licenses authors might use can be found here


Written By
Software Developer (Senior) Intelligent Coder
Canada Canada
I've been developing .NET enterprise applications since 2000.

I am originally from Rio de Janeiro and I am currently working at http://www.intelligentcoder.com in Ontario.

I also have my own startup where we offer client intake forms.

Comments and Discussions