Click here to Skip to main content
Click here to Skip to main content
Go to top

AJAX AutoCompleteExtender using Google Suggest API

, 10 Jul 2008
Rate this:
Please Sign up or sign in to vote.
Example on how to use AutoCompleteExtender to make a search like Google Suggest.

Introduction

This is an example on how to use the AJAX Toolkit's AutoCompleteExtender and make a Google Suggest like application using the Google's Suggest API.

Background

Here, I am trying to make a Google Suggest like site, using the Google Suggest REST API.

Using the code

AJAX needs to be installed if you are using VS 2005. The AutoCompleteExtender needs a feed from a webservice. Here, I have made a Google webservice, called Google.asmx. The AutoCompleteExtender works on the textbox and uses a webservice method. You need to have a webform (default.aspx) and a webservice (google.asmx). Note: I have used VS 2005 with AJAX extensions and the AjaxControlToolkit. Create a new AJAX enabled website from VS 2005. The default.aspx has nothing but a textbox, and the associated AutoCompleteExtender.

First, let's look at the webservice. I have named it google.asmx.

<%@ WebService Language="C#" Class="google" %>
using System;
using System.Collections.Generic;
using System.Web;
using System.Collections;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml;

/// <summary>
/// Summary description for google
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class google : System.Web.Services.WebService
{ 
    [WebMethod]
    public string[] getList(String prefixText)
    {
        XmlDocument doc = new XmlDocument();
        List<String> suggArList = new List<string>();
        string url = "http://google.com/complete/search?output=toolbar&q=" + prefixText;
        doc.Load(url);
        foreach (XmlNode node in doc.SelectNodes("//CompleteSuggestion"))
        {
            string value = node.SelectSingleNode("suggestion/@data").InnerText;
            suggArList.Add(value);
        }
        return suggArList.ToArray();
    }
}

The default.aspx has the script manager, a textbox, a button, and the AutoCompleteExtender associated with the textbox. Check the code.

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.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {
        TextBox1.Focus();
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        string url = "http://www.google.co.in/search?hl=en&q=" + TextBox1.Text;
       Response.Redirect(url);
    }
}

Points of interest

I think the code is self explanatory and easy to understand. AutoCompleteExtender can be implemented for many functionalities like suggesting information to the users while filling a form.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

pabmohan
Web Developer
India India
I am a web developer and working in an Indian Software company having lot of interest in ASP.NET, AJAX, C#. check out http://pabmohan.blogspot.com

Comments and Discussions

 
GeneralMy vote of 5 Pinmemberjayeshvpatel14-Apr-11 19:59 
GeneralGoogle Suggestions License Pinmemberguyzip11-Mar-10 3:53 
QuestionWhy a web service? Pinmemberquandary13-Jan-10 1:58 
AnswerRe: Why a web service? Pinmemberpabmohan13-Jan-10 2:21 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web03 | 2.8.140926.1 | Last Updated 10 Jul 2008
Article Copyright 2008 by pabmohan
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid