The AJAX HTML Page

This is the HTML page. It contains a simple HTML form and a link to a JavaScript.

First Name:

<input type="text" id="txt1" onkeyup="showHint(this.value)"/>
<p>Suggestions: <span id="txtHint"></span></p>

The JavaScript code is listed below.
The AJAX JavaScript

This is the JavaScript code, stored in the file “clienthint.js”:

var xmlHttp

function showHint(str)
{
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="tutorialz.php";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}

function stateChanged()
{
if (xmlHttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}

The AJAX Server Page -PHP

There is no such thing as an AJAX server. AJAX pages can be served by any internet server.

AJAX PHP Example

The code in the “tutorialz.php” page just checks an array of names and returns the corresponding names to the client:

Note: Code below is tutorialz.php
PHP Example

// Fill up array with names
$a[]="Google";
$a[]="Yahoo";
$a[]="Hotmail";
$a[]="Java";
$a[]="PHP";
$a[]="Asp";
$a[]="Ajax";
$a[]="Javascript";
$a[]="Ruby";
$a[]="Ecllipse";
$a[]="Dreamweaver";
$a[]="Flash";
$a[]="Photoshop";
$a[]="Fireworks";
$a[]="Flex";
$a[]="hass";
$a[]="marcelo";
$a[]="luciano";
$a[]="thiago";
$a[]="pallero";
$a[]="mozin";
$a[]="angush";
$a[]="gary";
$a[]="mike";
$a[]="perotti";
$a[]="michael";
$a[]="angelo";
$a[]="remoiv";
$a[]="asne";
$a[]="jack";

//get the q parameter from URL
$q=$_GET["q"];

//lookup all hints from array if length of q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i
{
if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
{
if ($hint=="")
{
$hint=$a[$i];
}
else
{
$hint=$hint." , ".$a[$i];
}
}
}
}

// Set output to "no suggestion" if no hint were found
// or to the correct values
if ($hint == "")
{
$response="no suggestion";
}
else
{
$response=$hint;
}

//output the response
echo $response;

Ajax Page With PHP, 5.0 out of 10 based on 1 rating

Incoming search terms:

• ajax page php (7)
• ajax page in php (7)
• colorbox ajax pagination (6)
• html tutorial 5 case 3 (5)
• automatic ajax splash screen (4)
• ajax pages can be served by (4)
• onchange yii dropdownlist (2)
• fetch value into combobox from database using symfony (2)
• xampp javascript demo listbox (2)
• auto textbox search in php demos (2)
• javascript tutorial 5 case 3 (2)
• Yii ajaxPager (2)
• jquery multiple recipients php (2)
• yii dropdownlist example ajax onchange (2)
• select onchange symfony (2)
• simple ajax php example (2)
• ajax onchange yii dropdownlist (2)
• yii how to make country dropdown list through xml file (2)
• javascript and ajax tutorial 5 case 3 (2)
• return a page from php to ajax (1)
• PHP ajax login (1)
• php ajax page (1)
• php dollar nkeyup=showhint(this value) (1)
• php in ajax pages (1)
• php ajax countdown (1)
• php ajax combobox (1)
• pass textbox array values with ajax (1)
• jquery ajax get two drop downs back (1)
• jquery ajax onchange php code (1)
• jstl capitalize first letter (1)
• listbox syntax example in yii (1)
• login page using ajax code (1)
• onchange dropDownList Ajax yii (1)
• dropdownlist get by month yii (1)
• onkeyup search in yii (1)
• page php with ajax (1)
• search and display data in php using textbox onchange (1)
• search multiple data from a table by name and Date in php (1)
• select fields ajax symfony2 (1)
• yii ajax onchange dropdownlist (1)

You will also be interested in ,

• Tag cloud using php, mysql and ajax with filter
• Simple auto suggest script using ajax php css and tags from wordpress
• Ajax and Jquery
• Simple Ajax with PHP click tracker
• Autosuggestion / Autocomplete script using PHP and Ajax
• Automatic Ajax Loading Images With Prototype
• Quick method to prevent cross site scripting in php
• Mysql backup via cron using php and email the file
• Check whether url or domain exists using php
• Speed up wordpress using .htaccess part 2