Posted by admin | Posted in PHP Tutorial | Posted on 10-08-2010-05-2008
0
This is the JavaScript code stored in the file “poll.js”:
- var xmlhttp;
function getVote(int)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert (“Browser does not support HTTP Request”);
return;
}
var url=”poll_vote.php”;
url=url+”?vote=”+int;
url=url+”&sid=”+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open(“GET”,url,true);
xmlhttp.send(null);
}
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById(“poll”).innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
var objXMLHttp=null;
if (window.XMLHttpRequest)
{
objXMLHttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
objXMLHttp=new ActiveXObject(“Microsoft.XMLHTTP”);
}
return objXMLHttp;
The stateChanged() and GetXmlHttpObject functions are the same as in the PHP AJAX Suggest chapter.
The getVote() Function
This function executes when “yes” or “no” is selected in the HTML form.
- Calls the GetXmlHttpObject() function to create an XMLHTTP object
- Defines the URL (filename) to send to the server
- Adds a parameter (vote) to the URL with the content of the input field
- Adds a random number to prevent the server from using a cached file
- Each time the readyState property changes, the stateChanged() function will be executed
- Opens the XMLHTTP object with the given url.
- Sends an HTTP request to the server
Posted by admin | Posted in PHP Tutorial | Posted on 10-08-2010-05-2008
0
This is the JavaScript code stored in the file “getrss.js”:
- var xmlhttp;
function showRSS(str)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert (“Your browser does not support XML HTTP Request”);
return;
}
var url=”getrss.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(“rssOutput”).innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject(“Microsoft.XMLHTTP”);
}
return null;
}
The stateChanged() and GetXmlHttpObject functions are the same as in the PHP AJAX Suggest chapter.
The showRSS() Function
Every time an option is selected in the input field, this function executes the following:
- Calls the GetXmlHttpObject() function to create an XMLHTTP object
- Defines the URL (filename) to send to the server
- Adds a parameter (q) to the URL with the selected option from the drop-down list
- Adds a random number to prevent the server from using a cached file
- Each time the readyState property changes, the stateChanged() function will be executed
- Opens the XMLHTTP object with the given URL
- Sends an HTTP request to the server
Posted by admin | Posted in PHP Tutorial | Posted on 10-08-2010-05-2008
0
This is the JavaScript code stored in the file “livesearch.js”:
- var xmlhttp;
function showResult(str)
{
if (str.length==0)
{
document.getElementById(“livesearch”).innerHTML=”";
document.getElementById(“livesearch”).style.border=”0px”;
return;
}
xmlhttp=GetXmlHttpObject()
if (xmlhttp==null)
{
alert (“Your browser does not support XML HTTP Request”);
return;
}
var url=”livesearch.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(“livesearch”).innerHTML=xmlhttp.responseText;
document.getElementById(“livesearch”).style.border=”1px solid #A5ACB2″;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject(“Microsoft.XMLHTTP”);
}
return null;
}
The GetXmlHttpObject() function is the same as in the PHP AJAX Suggest chapter.
The showResult() Function
This function executes every time a character is entered in the input field. If there is no input in the text field (str.length == 0), the function sets the return field to empty and removes the border around it. However, if there is any input in the text field, the function executes the following:
- Calls the GetXmlHttpObject() function to create an XMLHTTP object
- Defines the URL (filename) to send to the server
- Adds a parameter (q) to the URL with the content of the input field
- Adds a random number to prevent the server from using a cached file
- Each time the readyState property changes, the stateChanged() function will be executed
- Opens the XMLHTTP object with the given URL
- Sends an HTTP request to the server
The stateChanged() Function
This function executes every time the state of the XMLHTTP object changes. When the state changes to 4 (“complete”), the content of the txtHint placeholder is filled with the response text, and a border is set around the field.
Posted by admin | Posted in PHP Tutorial | Posted on 10-08-2010-05-2008
0
This is the JavaScript code stored in the file “responsexml.js”:
- var xmlhttp;function showUser(str)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert (“Browser does not support HTTP Request”);
return;
}
var url=”responsexml.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)
{
xmlDoc=xmlhttp.responseXML;
document.getElementById(“firstname”).innerHTML=
xmlDoc.getElementsByTagName(“firstname”)[0].childNodes[0].nodeValue;
document.getElementById(“lastname”).innerHTML=
xmlDoc.getElementsByTagName(“lastname”)[0].childNodes[0].nodeValue;
document.getElementById(“job”).innerHTML=
xmlDoc.getElementsByTagName(“job”)[0].childNodes[0].nodeValue;
document.getElementById(“age_text”).innerHTML=”Age: “;
document.getElementById(“age”).innerHTML=
xmlDoc.getElementsByTagName(“age”)[0].childNodes[0].nodeValue;
document.getElementById(“hometown_text”).innerHTML=”<br/>From: “;
document.getElementById(“hometown”).innerHTML=
xmlDoc.getElementsByTagName(“hometown”)[0].childNodes[0].nodeValue;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject(“Microsoft.XMLHTTP”);
}
return null;
}
The showUser() and GetXmlHttpObject functions are the same as in the PHP AJAX and MySQL chapter, you can go to there for an explanation of those.
The stateChanged() Function
When an option in the drop-down box is selected, the function executes the following:
- Sets xmlDoc variable as an XML document, using the responseXML function
- Retrieves data from the XML document, and place it in the correct <span> element
Posted by admin | Posted in PHP Tutorial | Posted on 10-08-2010-05-2008
0
This is the JavaScript code stored in the file “selectuser.js”:
- var xmlhttp;
function showUser(str)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert (“Browser does not support HTTP Request”);
return;
}
var url=”getuser.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()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject(“Microsoft.XMLHTTP”);
}
return null;
}
The stateChanged() and GetXmlHttpObject functions are the same as in the PHP AJAX Suggest chapter, you can go to there for an explanation of those.
Posted by admin | Posted in PHP Tutorial | Posted on 10-08-2010-05-2008
0
This is the JavaScript code stored in the file “selectcd.js”:
- var xmlhttp
function showCD(str)
{
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert (“Your browser does not support AJAX!”);
return;
}
var url=”getcd.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()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject(“Microsoft.XMLHTTP”);
}
return null;
}
The stateChanged() and GetXmlHttpObject functions are the same as in the PHP AJAX Suggest chapter, you can go to there for an explanation of those.
Posted by admin | Posted in PHP Tutorial | Posted on 10-08-2010-05-2008
0
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 XMLHTTP!”);
return;
}
var url=”gethint.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()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject(“Microsoft.XMLHTTP”);
}
return null;
}