AJAX work with PHP

ajax increase the web page's interactivity, speed, and usability.


PHP Ajax Example

how a web page can communicate with a web server while a user fill a form (e.g gmail):

start type character in first name field then run js code:

first-name

last-name

age         

first step : first a user type a character in the first name input field the background javascript code deal with it and run code, look this javascript function code :

    <html>
     
      <head>
        
          <script>
          
 function    ajaxrun(value){
            
                                     var  xmlhttp = null;
                             
                 if  ( value <= 0 ){
                 
                    document.getelementbyid ("fn").innerhtml="";
                    
                    return;
                    
                   }
                   
                 if ( window.xmlhttprequest ){
                 
                       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("show").innerhtml= xmlhttp.responsetext;
                         
                        }
                    
                    }
                    
                    
     xmlhttp.open("get", "ajaxhandler.php?v="+value, true )
                    
     xmlhttp.send();
        
               }
               
               </script>
               
             </head>
             
           <body>
           
           <div>
           
        <p>start type character in first name field then run js code:</p>
             
        <form>
             
<p>first-name:<input type="text"  name="fn" id="fn"  onkeyup="ajaxrun(this.value)"/></p>
               
<p>last-name:<input type="text"  name="ln"  id="ln"  onkeyup="ajaxrun(this.value)"/></p>
               
<p>age<input type="text"  name="ag" id="ag"  onkeyup="ajaxrun(this.value)"/><p>
        
        </form>
        
<p>output value: <span id="show"></span></p>
             
     </div>
           
   </body>
         
 <html>

Server Side PHP File

website visitor visit the site and type character in first name field then the keyup mouse event trigger and ajax object send a background request to server and a server side php code handle this request and send back response object, look this server side php code:

   <?php
   
           $urlvalue =  $_get['v']; // get the v parameter from url
           
           if ( strlen($urlvalue)  > 0 ){
              
                $response = $urlvalue;

                echo  "the value send by visitor : ". $response;
                
          } else{
          
                   echo  " please enter a value in form name field ";
                   
               }
               
    ?>