AJAX ASP/PHP

AJAX ASP/PHP instance

AJAX is used to create more dynamic applications.

ASP: Active Server Pages is a server-side scripting environment developed by Microsoft that can be used to create dynamic interactive web pages and build powerful web applications.

PHP: Hypertext Preprocessor, a hypertext preprocessor, is a common open source scripting language. Grammar absorbs the characteristics of C language, Java and Perl, is easy to learn, widely used, mainly applicable to the field of Web development.

This section will introduce you to several ASP/PHP instances related to AJAX.

AJAX ASP/PHP instance

The following example shows you how a Web page communicates with a web server when a user types a character in an input box: Type a letter (A - Z) in the input box below:

Instance resolution - showHint() function

The function showHint() is executed when the user types characters in the input box above. The function is triggered onkeyup event:

function showHint(str)        
{        
var xmlhttp;        
if (str.length==0)        
  {        
  document.getElementById("txtHint").innerHTML="";        
  return;        
  }        
if (window.XMLHttpRequest)        
  {// code for IE7+, Firefox, Chrome, Opera, Safari        
  xmlhttp=new XMLHttpRequest();        
  }        
else        
  {// code for IE6, IE5        
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");        
  }        
xmlhttp.onreadystatechange=function()        
  {        
  if (xmlhttp.readyState==4 && xmlhttp.status==200)        
    {        
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;        
    }        
  }        
xmlhttp.open("GET","gethint.html?q="+str,true);        
xmlhttp.send();        
}

Source code parsing:

If the input box is empty (str.length,0), the function txtHint and exits the function.

If the input box is not empty, showHint() performs the following tasks:

• Create an XMLHttpRequest object
• The function is executed when the server response is ready
• Send the request to the file on the server
• Note that we added a parameter q to q (with input box)

AJAX Server Page - ASP and PHP

The server page called by JavaScript above is an ASP file named "gethint .asp."

Let's create two versions of the server file, one written in ASP and the other in PHP.

THEP file

The source code .asp "gethint" checks an array of names and returns the name to the browser:

<%        
response.expires=-1        
dim a(30)        
'Fill up array with names        
a(1)="Anna"        
a(2)="Brittany"
a(3)="Cinderella"
a(4)="Diana"        
a(5)="Eva"        
a(6)="Fiona"        
a(7)="Gunda"        
a(8)="Hege"        
a(9)="Inga"        
a(10)="Johanna"        
a(11)="Kitty"        
a(12)="Linda"        
a(13)="Nina"        
a(14)="Ophelia"        
a(15)="Petunia"        
a(16)="Amanda"        
a(17)="Raquel"        
a(18)="Cindy"        
a(19)="Doris"        
a(20)="Eve"        
a(21)="Evita"        
a(22)="Sunniva"        
a(23)="Tove"        
a(24)="Unni"        
a(25)="Violet"        
a(26)="Liza"        
a(27)="Elizabeth"        
a(28)="Ellen"        
a(29)="Wenche"        
a(30)="Vicky"        
'get the q parameter from URL        
q=ucase(request.querystring("q"))        
'lookup all hints from array if length of q>0        
if len(q)>0 then        
  hint=""        
  for i=1 to 30        
    if q=ucase(mid(a(i),1,len(q))) then        
      if hint="" then        
        hint=a(i)        
      else        
        hint=hint & " , " & a(i)        
      end if        
    end if        
  next        
end if        
'Output "no suggestion" if no hint were found        
'or output the correct values        
if hint="" then        
  response.write("no suggestion")        
else        
  response.write(hint)        
end if        
%>

PHP file

The following code is written in PHP, which is the same as the ASP code above.

<?php        
// Fill up array with names        
$a[]="Anna";        
$a[]="Brittany";        
$a[]="Cinderella";        
$a[]="Diana";        
$a[]="Eva";        
$a[]="Fiona";        
$a[]="Gunda";        
$a[]="Hege";        
$a[]="Inga";        
$a[]="Johanna";        
$a[]="Kitty";        
$a[]="Linda";        
$a[]="Nina";        
$a[]="Ophelia";        
$a[]="Petunia";        
$a[]="Amanda";        
$a[]="Raquel";        
$a[]="Cindy";        
$a[]="Doris";        
$a[]="Eve";        
$a[]="Evita";        
$a[]="Sunniva";        
$a[]="Tove";        
$a[]="Unni";        
$a[]="Violet";        
$a[]="Liza";        
$a[]="Elizabeth";       
$a[]="Ellen";        
$a[]="Wenche";        
$a[]="Vicky";        
//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<count($a); $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;        
?>

In the next section, we'll cover the AJAX database!

Related tutorials

Classic ASP tutorial

PHP tutorial