It's easier to use smarty templates here
The main technology of this article: Ajax,php,smarty, in addition to the encapsulation of 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 = = 200) {
if (type==null) {
Callback (Xhr.responsetext);
}
if (type = = ' text ') {
Callback (Xhr.responsetext);
}
if (type = = ' xml ') {
Callback (Xhr.responsexml);
}
if (type = = ' json ') {
Callback (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 = = 200) {
if (type==null) {
Callback (Xhr.responsetext);
}
if (type = = ' text ') {
Callback (Xhr.responsetext);
}
if (type = = ' xml ') {
Callback (Xhr.responsexml);
}
if (type = = ' json ') {
Callback (eval ("+xhr.responsetext+"));
}
}
};
Xhr.send (data);
}
Class is simple and does not introduce
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> numbering </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})" > Previous </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} bar data
{$pagesize} bar data per page
</td>
</tr>
</table>
To introduce smary templates
This implements a simple paging technique
No refresh paging technology, Ajax+smarty