×
INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!
  • Students Click Here

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Students Click Here

Jobs

PHP and JavaScript

AJAX and PHP by Lrnmore
Posted: 16 Sep 05 (Edited 16 Sep 05)

This is a "working" example of AJAX and how it enables the client to "request" data from
the server without refresh of the page.

Included is a listing of helpful resources. You will need to do your own research as to
which types of "request" you will need to utilize.

mkSel.html

CODE

<html>
<head>
<title>AJAX Example</title>
<script type="text/javascript">

//global variable
var selArr = new Array();

/***  from http://jibbering.com/2002/4/httprequest.html  an article by Jim Ley***/

var xmlhttp
/*@cc_on @*/
/*@if (@_jscript_version >= 5)
  try {
  xmlhttp = new ActiveXObject("Msxml2.XMLHTTP")
 } catch (e) {
  try {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP")
  } catch (E) {
   xmlhttp = false;
  }
 }
@else
 xmlhttp = false;
@end @*/
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
 try {
  xmlhttp = new XMLHttpRequest();
 } catch (e) {
  xmlhttp=false;
 }
}


/***  Blame me if anything goes wrong below ;)  ***/

function getData(val) {
if(val.length == 0) return;
url="server4.php?pet=" + val;
xmlhttp.open("GET",url,true);
xmlhttp.setRequestHeader("If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT");
xmlhttp.setRequestHeader("Content-Type", "text/xml");
  xmlhttp.onreadystatechange=function() {
   if (xmlhttp.readyState==4 && xmlhttp.status==200) {
   selArr = xmlhttp.responseText.split(",");
   mkSel2();
   }
  }
xmlhttp.send(null);
}

function mkSel2(){
var selObj = document.forms['f1'].elements['sel2'];
selObj.options.length = 0;
     for(var j = 0; j < selArr.length; j++){
     selObj[selObj.options.length] = new Option(selArr[j], selArr[j]);
     }
}  
</script>
</head>
<body>
<form name="f1">
<select name="sel1" onchange="getData(this.value)">
        <option value = "">Pick One
        <option value = "cats">Cats
        <option value = "dogs">Dogs
        <option value = "horses">Horses
</select>
<p>
<select name="sel2">
        <option value = "">Pick One
</select>
</p>
</form>
</body>
</html>

server4.php

CODE

<?php
$phpArr = array("cats" => 'Pick One,Fluffy,Tiger,Garfield',
                 "dogs" => 'Pick One,Spot,Skip,Woff',
                 "horses" => 'Pick One,Ed,Dolly,Boots');

if(isset($_GET['pet'])){
   echo $phpArr[$_GET['pet']];
   }
?>

Links:
Conditional Compilation
http://en.wikipedia.org/wiki/XMLHttpRequest
http://jibbering.com/2002/4/httprequest.html
http://www.google.com/search?hl=en&lr=&amp;q=AJAX

Notes:
IE has a bad tendency to "cache" the info, see the wiki link


Anyhow, do your own research and testing to make sure it's right for your application.

Back to PHP FAQ Index
Back to PHP Forum

My Archive

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close