Click here to Skip to main content
15,885,782 members
Articles / Web Development / HTML

Google Suggest like Dictionary

Rate me:
Please Sign up or sign in to vote.
4.87/5 (78 votes)
26 Dec 20043 min read 307.7K   3.2K   206  
An implementation of Google suggest using remote scripting.
<html>
	<head>
		<script>
var req;

function Initialize()
{
	try
	{
		req=new ActiveXObject("Msxml2.XMLHTTP");
	}
	catch(e)
	{
		try
		{
			req=new ActiveXObject("Microsoft.XMLHTTP");
		}
		catch(oc)
		{
			req=null;
		}
	}

	if(!req&&typeof XMLHttpRequest!="undefined")
	{
		req=new XMLHttpRequest();
	}
	
}

function SendQuery(key)
{
	Initialize();
	var url="http://www.objectgraph.com/dictionary/dict.aspx?k="+key;
	
	if(req!=null)
	{
		req.onreadystatechange = Process;
		req.open("GET", url, true);
        req.send(null);
        
	}
	
}

function Process()
{
	if (req.readyState == 4) 
        {
        // only if "OK"
			if (req.status == 200) 
			{
				if(req.responseText=="")
					HideDiv("autocomplete");
				else
				{
					ShowDiv("autocomplete");
					document.getElementById("autocomplete").innerHTML =req.responseText;
				}
			}
			else 
			{
				document.getElementById("autocomplete").innerHTML="There was a problem retrieving data:<br>"+req.statusText;
			}
		}
}

function ShowDiv(divid) 
{
   if (document.layers) document.layers[divid].visibility="show";
   else document.getElementById(divid).style.visibility="visible";
}

function HideDiv(divid) 
{
   if (document.layers) document.layers[divid].visibility="hide";
   else document.getElementById(divid).style.visibility="hidden";
}

function BodyLoad()
{
	HideDiv("autocomplete");
	document.form1.keyword.focus();
	
}
</script>
	<style type="text/css"> 
		<!-- 
		.box { border: 1px solid #000000; }
		.heading {
			font-family: Georgia, "Times New Roman", Times, serif;
			font-weight: bold;
			font-size: 24px;
		}
		.style1 {color: #0033FF}
		.style2 {color: #CC0066}
		.style3 {color: #CC0000}
		.style4 {color: #33CCCC}
		.style6 {color: #669900}
		.style7 {color: #FF0066}
		.style8 {color: #FF6600}
		-->
	</style>
	<title>ObjectGraph Dictionary</title></head>
	<body onload="BodyLoad();">
		<div align="center" class="heading">
		  <p><a href="http://www.objectgraph.com"><img src="../images/logo.jpg" width="145" height="34" border="0"></a></p>
		  <p><span class="style2">D</span><span class="style1">i</span><span class="style3">ct</span><span class="style4">i</span><span class="style3">o</span><span class="style6">n</span><span class="style7">a</span><span class="style8">r</span>y <br>
	      </p>
		</div>
		<div align="center"><em><a href="how.html">how does it work? </a></em>
    </div>
		<form name="form1">
		<center>
			<input name="keyword" onKeyUp="SendQuery(this.value)" style="WIDTH:500px" autocomplete="off">
			<div align="left" class="box" id="autocomplete" style="WIDTH:500px;BACKGROUND-COLOR:#ccccff"></div>
		</center>
		</form>
	    <p align="center">&nbsp;</p>
	</body>
</html>

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
Web Developer
United States United States
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions