Auto complete comes of age

By | | JavaScript

Google Suggest, the latest bag of tricks from Google Labs, is a perfect example of how modern web applications are breaking out of the mold and becoming more interactive. It uses XMLHttpRequest to run queries against Google as yout type, proving an auto-complete box with the most likely results. As you might expect from Google, it’s slick, intuitive and fits right in to their bare-bones interface.

The JavaScript that powers the feature is pretty well obfuscated, so if you want to see how it works your best bet is to install the Firefox/Mozilla Live HTTP Headers extension, set it up as a sidebar and watch what happens when you use the site. Basically, for every character you type it retrieves a page like this and evals the resulting string of JavaScript. It’s the same kind of technique they use for Gmail.

XMLHttpRequest is a technology with amazing potential, and this is just the tip of the iceburg. The web’s about to get a whole lot richer.

The Ultimate JavaScript Bundle: 2 books + 1 course

Buy now $39 Normally $117 - save 66%

Or get access to all SitePoint's Premium Content with a Learnable membership

{ 40 comments }

dan November 3, 2008 at 1:37 am
Anonymous June 19, 2008 at 11:39 pm

is there any way to get the browser cache which pops up (autocomplete) when you re-enter the values in page. where you already entered?

i am manually writing an auto complete feature for text boxes. I need a mechanism to cache the values when user does submit and populating those values in auto complete(i am including some constant values also), if they re-visit the same page in same session.

Anonymous May 30, 2008 at 4:57 pm

One of the greatest features about Firefox is the fact that anyone can write an extension to improve its functionality.

제일페차 July 3, 2006 at 7:44 pm

main1

manoloweb March 4, 2005 at 11:28 pm

http://manoloweb.blogspot.com/2005/03/instant-editor.html
This is a field editor I just wrote, it is only an idea, I believe many users will find an ocean of possibilities around it :-)

Ben Balbo February 27, 2005 at 9:02 pm

Just a comment to everyone who’s so against copyrighting… a copyright is implicit. They wrote it, so they have copyright. It’s nothing like software patents.

If you write anything, it’s your copyright. It becomes your copyright on creation. If I write anything – it’s my copyright. Unless I post a comment on a web site, in which case I may be giving my copyright to the publisher/owner of the site :-)

(c)2005, Ben Balbo, where applicable

Dat Nguyen January 25, 2005 at 1:16 am

Question:

Does XMLHttpRequest have the same limitations as Microsoft.XMLHttp? I was using Microsoft.XMLHttp for remote script callbacks, but I discovered that it can only send at most two requests to a server at the same time. Any new http requests are blocked until any previous requests are completed, even in asynchronous mode. I just assumed XMLHttpRequest is the same way. Does someone know if this is true?

moltar January 20, 2005 at 11:28 am

Gavi Narra: that dictionary looks really cool!

TaylorAtCTS January 20, 2005 at 7:50 am

Very interesting… thanks guys

Brad Williams January 7, 2005 at 7:54 pm

How is XMLHttpRequest any better than using hidden Iframe as people have been doing for years to retrieve data in background?

http://www.ashleyit.com/rs/

Hank Fay January 6, 2005 at 9:31 am

I created a website using Javascript and a hidden frame to do roundtrips and then called a friend at a top-50 to look at it; he couldn’t see anything. Turns out their firewall strips all script. I stopped thinking of page-embedded script as a solution.

Gavi Narra December 27, 2004 at 12:15 am

I created a dictionary using the same technique as Google Suggest. The backend is SQL server. There is also a “how does it work?” section with complete source code.

http://www.objectgraph.com/dictionary

LOGIKonline December 23, 2004 at 6:07 pm

Seems pointless to copyright a technology that is not even new to the web. It is actually about 2 years behind other companies doing the same thing. Not nearly as nice scripting. dbCombo.net for all of you not aware.

Dorsey December 23, 2004 at 5:46 pm

After an author has spent many hours/days/weeks/months designing, developing, testing, and releasing code, someone thinks copyrighting it to protect the author’s intellectual property is ‘evil’? It’s been well established, at least in the U.S., that software is copyrightable and belongs to the author, just as any other written work such as plays, music, poetry, etc. does, and no one questions the copyright of those.

I’m all for open source because of the community behind it, and because I try to add my two bits whenever I can as a way of giving something back. Pirating non-open source code without the author’s permission is taking food from his/her mouth.

Larry December 23, 2004 at 5:26 pm

I looked at the example that Richard linked to and it does not do auto complete.

It is also important to understand the difference between Copyright and Patent law. The Copyright of script, prevents me from copying it, but does not prevent me from using the concepts. A patent on the concepts (“means” in patent law) for the script prevent me from developing my own version, even if I hadn’t seen this one before.

Going back to the example that Richard linked to; Google wouldn’t be able to patent using XMLHTTP with a drop down and a partial match list because the example could be used as prior art. They could however add the auto complete function to their patent filing and then we couldn’t use a similar function without some licensing deal with them or finding a different method to do it.

The sad part about patent law is we don’t know if they have already filed for a patent for this and if someone duplicates it they could end up owing a lot of money to them unless they have some patent they would like to cross license, or money to invest.

Dr Livingston December 23, 2004 at 9:40 am

Completely pointless patenting a peice of client side javascript, regardless of what it achieves – it’s in the users cache.

As for the ‘wow’ factor it’s no bad though not new either. Good to see xmlHttpRefresh being taken up as it, to me anyways, is a technology to combat Flash 8)

gdape December 22, 2004 at 9:25 pm

however you look at it copyrighting code is evil, which flies in the face of their mantra. The suits have arrived at the googleplex.

Richard@Home December 20, 2004 at 7:40 am

They can’t copyright ‘The combination of using xmpHTTPRequest along with auto complete and a dropdown box’ as they aren’t the first to implement it.

I’ve seen it on a couple of blogs over the last year or so.

Here’s one example: http://blog.bitflux.ch/archive/spotlight_like_livesearch_added.html

Larry December 15, 2004 at 12:51 am

It’s not the copyright I would worry about, it would be a potential patent they could have filed that no one knows about yet.

The combination of using xmpHTTPRequest along with auto complete and a dropdown box may have never been documented or done before.

With a bit of time it is possible to work with their code and adapt it for other useful things.

I had a page that used xmlHTTPRequest for auto complete but I didn’t have a dropdown box. I took their code and adapted it for what I was doing, but they still have bugs in it (it’s only a beta) and I didn’t like the way it’s coded (possibly for other future uses). I’m now writing a “clean room” version of this code to duplicate the functionality, but I still will have to worry about patent problems.

Companies like Google patent this kind of stuff, not so they can keep other competitors from duplicating their technology, but to have something to trade if another competitor accuses Google of violating their patents. This keep us small developers from being able to compete, which is exactly the opposite of why patents laws were established in the first place.

jb007irl December 14, 2004 at 8:51 am

Type in “www.” (without the quotes) and guess what pops up as the first suggestion?

It’s http://www.yahoo.com! I would have thought http://www.google.com comes before http://www.yahoo.com (alphabetically).

pb December 14, 2004 at 1:20 am

Could Sitepoint or someone *please* do an article in *plain* english about how to in a cross-platform fashion do the httpxmlrequest + dhtml + javascript to make GETs/POSTs and parse/display the results in the browser? The information to date on this is sorely, sorely lacking.

andre December 13, 2004 at 9:06 pm

i don’t think it’s gonna be much load on their servers. web servers, yes, but they’ve got thousands of them anyway :P for sure they’ve got a cache that answers all these search queries

Jordan December 13, 2004 at 12:56 pm

mrsmiley, the suggestions it gives you aren’t sites, they’re queries. They’re not sorted by PageRank like regular Google search results — rather, I think they’re sorted by frequency queried. That is, the suggestions that pop up are the most frequently searched-for terms that begin with whatever you’ve typed in. Since you’re probably one of the only people out there searching for “Reality Edge Media”, it doesn’t show up.

Ben December 13, 2004 at 7:53 am

Really why is this news? Becasue google did it? PHP.net did this ages ago (with an “obfuscated” script as well) http://simon.incutio.com/archive/2003/11/13/goodAndUgly

mrsmiley December 12, 2004 at 4:23 pm

They seem to be limiting its results somehow. I dont think it handles multiple words very well. For example, I search google normally for my business name “Reality Edge Media” and I come back as top listing. If I type it into the google auto complete box, I dont even rate a mention. Not even if you put quotes around it. Maybe only sites with a minimum PR are listed in the return set?

Arielladog December 11, 2004 at 11:03 pm

After aquiring the famed Oddpost, Yahoo now also has autocomplete. XMLHttpRequest via JS really is starting to finally show up in useful situations. However, to do an address lookup so quickly (assuming it’s not all cached) is pretty amazing.

Anonymous December 11, 2004 at 8:16 pm

The php.net site had this functionality in the manual. This is over a year ago and was in beta, I don’t where it is now

HarryF December 11, 2004 at 3:36 pm

Interested to see they’re also using the approach of delivering a response which is eval()-able Javascript (**cough** ;)), rather than, say, XML. Makes a great way to pack data which is probably unique to Javascript, given that the browser JS runtime guarantees security.

tariquesani December 11, 2004 at 2:55 am

Take a look at jpspan http://jpspan.sf.net to effortlessly roll out something similar using php + js

Tom Morris December 11, 2004 at 2:08 am

The code has been stripped of comments, white space, and any extra characters, but I’d hardly call it obfuscated.

One thing looking at the code shows is that there are lots of latent capabilities. For example, they seem to allow for both CSS and non-CSS as well as supporting browsers which don’t have support for XMLHttpRequest by setting a cookie and forcing a page refresh.

M36Teen December 10, 2004 at 5:29 pm

Cool, I needed that link! I’m not sure what that had to do with this, but I’m glad you posted it! ;)

michie December 10, 2004 at 4:52 pm

Search companies such as Yahoo and MSN have been using XMLHTTPRequest on their sites before, so nothing really new here.

danut December 10, 2004 at 3:41 pm

For other documentation please se other web links. It’s easy. Don’t worry . Look ta the links.
[URL=http://www.my-best-jobs.com/advice%20resources/start%20business/index.php]Start own business[/URL]

dave December 10, 2004 at 1:48 pm

This looks very similar to what I have been using for a while now, which is an adaptation of what I found at http://blog4.bitflux.ch/wiki/LiveSearch

Nothing real new there, why on earth would they hide the js and copywrite it?

But it is nice to have a major player upping the ante with respect to using javascript to enhance user interaction with the data on the page.

Yousf December 10, 2004 at 1:37 pm

Thats G R E A T!!!!
I like it very much! I love you Google guys!
but isn’t this a huge load on their servers?

Andrew Wooster December 10, 2004 at 1:36 pm
M36Teen December 10, 2004 at 1:04 pm

So, if I take it, and mod 3 lines, what happens? lol

Cool though.

Skunk December 10, 2004 at 12:37 pm

They’re not copyrighting the concept of auto-complete, just their particular JavaScript file that implements it. That’s perfectly legal , and it means that should someone copy and paste that exact script for their own site Google could send in the lawyers (although I very much doubt that they would).

A more interesting question is whether or not short scripts should be copyrightable – I’ve seen plenty of scripts on sites like the JavaScript Source which are only two or three lines but come with a lengthy copyright notice.

Nicholas C. Zakas December 10, 2004 at 12:05 pm

Don’t forget this oldie by goodie, posted right here at Sitepoint: http://www.sitepoint.com/article/life-autocomplete-textboxes. :)

Dangermouse December 10, 2004 at 11:58 am

Thats pretty neat.

How can they copyright javascript? Its not like auto complete is a new idea

Comments on this entry are closed.