Ajax+smarty technology implementation without refreshing paging _ajax related

It's easier to use the Smarty template here

The main technology of this article: Ajax,php,smarty, and also encapsulates a very simple class

Class:

　　(function () {function $ (id) {return document.getElementById (ID);} $.init=function () {Try{return new XMLHttpRequest () ;}
catch (e) {}; Try{return new ActiveXObject (' Microsoft.XMLHTTP ');}
catch (e) {} alert (' Please change browser '); } $.get=function (Url,data,callback,type) {var xhr = this.init (); url = '? ' +new Date (). GetTime (); if (data!=null) {URL +
= ' & ' +data;
} xhr.open (' Get ', url); Xhr.onreadystatechange = function () {if (xhr.readystate = = 4 && Xhr.status =) {if (type==null) {callback (XHR).
ResponseText); } if (type = = ' text ') {callback (xhr.responsetext);} if (type = = ' xml ') {callback (xhr.responsexml);} if (type = = ' json ') {CA
Llback (eval ("+xhr.responsetext+"));
}} xhr.send (null); } $.post = function (url,data,callback,type) {var xhr = This.init (); Xhr.open (' post ', url); Xhr.setrequestheader (' Content
-type ', ' application/x-www-form-urlencoded '); Xhr.onreadystatechange = function () {if (xhr.readystate = = 4 && Xhr.status =) {if (type==null) {callback (XHR). ResponseText);
} if (type = = ' text ') {callback (xhr.responsetext);} if (type = = ' xml ') {callback (xhr.responsexml);} if (type = = ' json ') {C
Allback (eval ("+xhr.responsetext+")); 
}
}
};
Xhr.send (data); }

Class is very simple, do not introduce the

Html:

　　Window.onload=function () {init (2);} function del (id,p) {$.get (' del.php ', ' id= ' +id,function (msg) {if (msg==1) {init (P);

}} function init (p) {$.get (' page.php ', ' page= ' +p,function (msg) {$ (' result '). innerhtml=msg;});
PHP: <?php header (' Content-type:text/html;charset=utf-8 ');
mysql_connect (' localhost ', ' root ', ' root ');
mysql_select_db (' DB2 ');
mysql_query (' Set names UTF8 ');
$re =mysql_query (' Select COUNT (*) as num from Catgory ');
$hang =mysql_fetch_assoc ($re);
$row 1= $hang [' num ']; $page =isset ($_get[' page ')?
$_get[' page ']:1;
$pagesize = 2;
$total =ceil ($row 1/$pagesize);
$prev = $page-1;
$next = $page +1;
if ($prev <1) {$prev =1} if ($next > $total) {$next = $total;} $offset = ($page-1) * $pagesize;
$result =mysql_query ("select * from Catgory limit". $offset. ', ' $pagesize);
$ct =mysql_num_rows ($result);
$data =array ();
for ($i =0; $i < $ct; $i + +) {$r =mysql_fetch_assoc ($result); $data []= $r;} include (' libs/smarty.class.php ');
$Smarty =new Smarty ();
$Smarty->assign (' data ', $data); $Smarty->assign ('Page ', $page);
$Smarty->assign (' pagesize ', $pagesize);
$Smarty->assign (' Total ', $total);
$Smarty->assign (' prev ', $prev);
$Smarty->assign (' Next ', $next);
$Smarty->assign (' Row1 ', $row 1);
$str = $Smarty->fetch (' page.html '); Echo $str;

Smarty:

<table border= "1" rules= "All" width= ">
<tr>
<td> No. </td>
<td> brand </ td>
<td>pid</td>
<td> Delete </td>
</tr>
{foreach from= $data item= ' Value '}
<tr>
<td>{$value [' id ']}</td>
<td>{$value [' Name ']}</td>
<td>{$value [' pid ']}</td>
<td><a href= "#", onclick= "Del" ({$value [' id ']},{$page}] > Delete </td>
</tr>
{/foreach}
<tr>
<td colspan= "3" >
total {$total} page
{$page} page
<a href= "#", onclick= "init ({$prev})" > Prev </a>
<a href= "#", onclick= "Init" ({ $next}) "> Next </a>
<a href=" # ", onclick=" init (1) "> first page </a>
<a href=" # ", onclick=" Init ({$total}) "> last page </a>
total {$row 1} data
per page {$pagesize} data
</td>
</tr>
</table>

To introduce a smary template

The above mentioned is small set to introduce the Ajax+smarty technology to achieve no refresh paging, I hope to help!