PHP Ajax Local Refresh implementation No refresh Publish article Comments (compatible with the main browser)

PHP Tutorial Ajax Local Refresh Implementation No refresh Publish article Comments (compatible master browser)

Commenting on the site, the traditional publishing process is simply: Publish-> submit page form-> wait to refresh the page,

In this way, when the network is more crowded, often need a long wait, today introduced with Php+ajax implementation page without refreshing hair

Table comments, I hope to be a beginner of Ajax Phper help. So first, we need a basic AJAX development box

Frame, the file Ajax.js contains this framework, the code is as follows:

var Http_request=false;

function send_request (URL) {//initialization, specifying handler functions, sending requested functions

Http_request=false;

Start initializing the XMLHttpRequest object

if (window. XMLHttpRequest) {//mozilla browser

Http_request=new XMLHttpRequest ();

if (http_request.overridemimetype) {//Set MIME category

Http_request.overridemimetype ("Text/xml");

}

}

else if (window. ActiveXObject) {//ie browser

try{

Http_request=new ActiveXObject ("msxml2.xmlhttp");

}catch (e) {

try{

Http_request=new ActiveXObject ("Microsoft.XMLHTTP");

}catch (e) {}

}

}

if (!http_request) {//exception, failed to create object instance

Window.alert ("Create XMLHTTP object failed!") ");

return false;

}

Http_request.onreadystatechange=processrequest;

Determine how to send the request, the URL, and whether to execute the next code synchronously

Http_request.open ("Get", url,true);

Http_request.send (NULL);

}

Functions that process return information

function ProcessRequest () {

if (http_request.readystate==4) {//Judge object state

if (http_request.status==200) {//information returned successfully, start processing information

document.getElementById (reobj). Innerhtml=http_request.responsetext;

}

else{//page is not normal

Alert ("The page you requested is not normal!") ");

}

}

}

function Checkfourm (obj) {

var F=document.fourm;

var Newfourm=f.newfourm.value;

var Username=f.username.value;

var Id=f.id.value;

if (username== "") {

document.getElementById (obj). innerhtml= "

<font color=red> You must log in first! </font> ";

return false;

}

else if (newfourm== "") {

document.getElementById (obj). innerhtml= " <font

Color=red> you haven't filled in the comments yet! </font> ";

return false;

}

else{

document.getElementById (obj). innerhtml= "Sending data ...";

Send_request (' sendnewfourm.php?

Username= ' +username+ ' &newfourm= ' +newfourm+ ' &id= ' +id);

Reobj=obj;

}

}

First, you create a XMLHttp variable that is used as a XMLHttpRequest object. Set its value to null.
Then Test window. Whether the XMLHttpRequest object is available. In the new version of Firefox, Mozilla, Opera

And Safari browsers, this object is available.
If available, use it to create a new object: Xmlhttp=new XMLHttpRequest ()
Detects window if it is not available. ActiveXObject is available. In Internet Explorer version

In versions 5.5 and higher, this object is available.
If available, use it to create a new object: Xmlhttp=new ActiveXObject ()

There is a bit of Ajax based on the annotation, should all be able to read this code, we can see that when we start to comment

On the time, in a specific location first show: sending data .... The callback function is then invoked to process the data. then please

Look at the server-side code:
<?php

Header (' content-type:text/html;charset=gb2312 ');//Avoid the output of Chinese garbled, Linux does not need

To

$username =trim ($_get[' username '));

$newfourm =trim ($_get[' Newfourm '));

$id =$_get[' id '];

$time =date ("y-m-d");

Include (' inc/config.inc.php ');

Include (' inc/dbclass.php ');

$db =new db;//from Database Tutorial action class generation instance

$db->mysql Tutorial ($dbhost, $dbuser, $dbpassword, $dbname);//Call connection parameter function

$db->createcon ()//call to create a join function

$addsql = "INSERT into Cr_fourm values (0, ' $newfourm ', ' $username ', ' $time ', $id)";

$db->query ($addsql);

echo " <font color=red> Comment has been published successfully! </font> ";

Echo $addsql;

$db->close ();//Close database connection

?>
Because Jsvascript adopts UTF8 encoding, the return information of AJAX loopback server under Windows will appear garbled,

Therefore, it is very necessary to apply the first sentence in win. The middle segment two contains files are database operations classes and databases

Configuration information, I am personally accustomed to the basic database operations written as a class, easy to invoke. Here to believe that everyone has been base

This understanding of how this program works, gives the HTML code for the page:
<table width= "100%" border= "0" cellspacing= "0" cellpadding= "0" >

<tr>

<TD align= "center" ><?php Echo $rows _p[p_info];? ></td>

</tr>

<tr>

<TD align= "center" ><br><br><iframe frameborder= "0" scrolling= "Auto"

Src= "showfourm.php?picid=<?= $id;? > "

style=height:250px; Visibility:inherit; width:98%; Z-index:2 ></iframe>

</td>

</tr>

<tr>

<TD align= "center" ><br><br>

<div align= "center" id= "result" ></div>

<form name= "Fourm" >

<table width= "100%" border= "0" cellspacing= "0" cellpadding= "0" >

<tr>

<TD height= > Express Comment <span class= "STYLE1" > (must first login) user

Name:

<input name= "username" type= "text" value= "<?= $username?>"

Readonly>

</span></td>

</tr>

<tr>

<TD height= "align=" "Center" valign= "Middle" ><textarea

Name= "Newfourm" class= "F" id= "Newfourm" ></textarea></td>

</tr>

<tr>

<TD height= > <input name= "Submit" type= "button" value= "comment"

onclick= "Checkfourm (' result ')" >

<input name= "reset" type= "reset" id= "reset" value= "re-fill" >

<input name= "id" type= "hidden id=" id "value=" <?php echo "$id";?

> "></td>

</tr>

</table>

</form>

</td>

</tr>

</table>

About AJAX compatibility processing as follows

Some programmers like to use the latest and fastest version of the XMLHttpRequest object.

The following example attempts to load Microsoft's latest version of "Msxml2.xmlhttp", which is available in Internet Explorer 6

, if it fails to load, then back to "Microsoft.XMLHTTP", in Internet Explorer 5.5 and later versions

Available in.

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;
}

Code Explanation:
First, create the XMLHttp variable that is used as the XMLHttpRequest object. Set its value to null.
Create objects according to Web standards (Mozilla, Opera, and Safari): Xmlhttp=new XMLHttpRequest ()
Create objects in Microsoft's way, available in Internet Explorer 6 and higher: xmlhttp=new

ActiveXObject ("Msxml2.xmlhttp")
If you catch an error, try an older method (Internet Explorer 5.5): xmlhttp=new

ActiveXObject ("Microsoft.XMLHTTP")