PHP+Ajax 實現分頁技術

2024-09-01 08:30:05

字體：大中小

來源：轉載

供稿：網友

基于php和ajax的分頁技術代碼，下面有兩個php文件，一個是sn_inq.php，另一個是sn_show.php，前一個php文件調用后一個php文件，實現ajax分頁，運行sn_inq即可實現效果，不過得修改數據庫哦。具體代碼如下：紅色標注的地方要特別注意修改哦！

我的數據庫名是inv，表名是sn，字段有：sn_id,sn_plant,sn_sales,sn_act,sn_type,sn_sts.....

1.sn_inq.php

//getFormValue 用于獲取表單中所有輸入控件的值，并將輸入值組成一個字符串傳到服務器。

//showcomment(page) 用于顯示分頁數據，被查詢按鈕onclick 事件調用， url為后臺處理數據并輸出XML格式數據的文件url。

//displayLoading用于顯示Loading，提示用戶等待

function displayLoading(element) {
var image = document.createElement("img");
image.setAttribute("src","progressbar.gif");
image.setAttribute("title","loading...");
var text = document.createTextNode("loading……");
element.appendChild(image);
element.appendChild(text);
}

//removeLoading用于去掉Loading

function removeLoading(element){
var image = element.getElementsByTagName("img");
for(var i=0;i<image.length;i++){
element.removeChild(image[i]);
}
}

//ajax

aj.get = function(targetUrl, resultHandle) {
aj.targetUrl = targetUrl;
aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
aj.resultHandle = resultHandle;
if(window.XMLHttpRequest) {
aj.XMLHttpRequest.open('GET', aj.targetUrl);
aj.XMLHttpRequest.send(null);
} else {
aj.XMLHttpRequest.open("GET", targetUrl, true);
aj.XMLHttpRequest.send();
}
}

aj.post = function(targetUrl, sendString, resultHandle) {
aj.targetUrl = targetUrl;
aj.sendString = sendString;
aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
aj.resultHandle = resultHandle;
aj.XMLHttpRequest.open('POST', targetUrl);
aj.XMLHttpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
aj.XMLHttpRequest.send(aj.sendString);
}
return aj;
}

<?php

//注意：此處如果有filesedset的話，form表單一定要放在fieldset里面，否則出錯。
echo '<form name="form1" action="" method="post">
<table cellpadding="0" cellspacing="1">
<tr>
<th class="criteria">SN</th>
<td>
<input type="text" name="sn_id_1" value="'._POST['sn_id_1'].'" size="16" maxlength="8"/> to
<input type="text" name="sn_id_2" value="'._POST['sn_id_2'].'" size="16" maxlength="8"/>
<input type="button" name="sn_submit" value="Search" onClick="showcomment(1)"/>
</td>
</tr>
</table>
</form>
<div id="show"></div>';

2.sn_show.php:

<?php
//page function
function showpage(total){
global page,pagenav,middle,num,pagenum,offset,prepg,nextpg;
//獲取page=18中的page的值，假如不存在page，那么頁數就是1。
page=isset(_REQUEST['page'])?intval(_REQUEST['page']):1;
//每層分頁條顯示4個分頁連接
middle = '4';
//每頁顯示10條數據
num=10;
//獲得總頁數,也是最后一頁
pagenum=ceil(total/num);
//獲得首頁
page=min(pagenum,page);
//上一頁
prepg=page-1;
//下一頁
nextpg=(page==pagenum ? 0 : page+1);
offset=(page-1)*num;

if(pagenum<=1) return false;

if(prepg){
pagenav.=' <a href="javascript：;" onclick="javascript：showcomment(1);">'.iconv('gb2312','gb2312','首頁').'</a> ';
pagenav.=' <a href="javascript：;" onclick="javascript：showcomment('.prepg.');">'.iconv('gb2312','gb2312','上一頁').'</a> ';
}else{
pagenav.="<font color='gray'>".iconv('gb2312','gb2312','首頁')."</font>"."&nbsp";
pagenav.="<font color='gray'>".iconv('gb2312','gb2312','上一頁')."</font>";
}

if(nextpg){
pagenav.=' <a href="javascript：;" onclick="javascript：showcomment('.nextpg.');">'.iconv('gb2312','gb2312','下一頁').'</a> ';
pagenav.=' <a href="javascript：;" onclick="javascript：showcomment('.pagenum.');">'.iconv('gb2312','gb2312','尾頁').'</a> ';
}else{
pagenav.="<font color='gray'>".iconv('gb2312','gb2312','下一頁')."</font>"."&nbsp";
pagenav.="<font color='gray'>".iconv('gb2312','gb2312','尾頁')."</font>"."&nbsp";
}

pagenav.='</select>'.iconv('gb2312','gb2312','共 ') . pagenum .'&nbsp'.iconv('gb2312','gb2312','頁');
for(h=(page-middle<1?1:page-middle);h<=(page+middle>pagenum?pagenum:page+middle);h++){
if(h==page){
pagenav.="<b> h </b>";
}else{
pagenav.="  <a href=/"javascript：showcomment(".h.");/">".iconv('gb2312','gb2312',h)."</a>  ";
}
}

pagenav.="    ";
pagenav.=iconv('gb2312','gb2312','轉到 ');

pagenav.="<select id='JumpSelect' name='NowPage' size='1' onchange=/"showcomment(this.value);/">";
for (i = 1; i <= pagenum;i++){
if(page == i){
pagenav.= "<option value='".i."' selected>".i."</option>";
}else{
pagenav.= "<option value='".i."' >".i."</option>";
}
}
pagenav.="</select>";
pagenav.="頁";
return pagenav;
}

//connect to database
function db_link()
{
access_id = "root";
db_name = "inv";
@ db = mysql_connect('localhost', access_id, '831025') or
die("Could not connect to database. Please contact with IT supporting team ASAP.");
mysql_query("SET NAMES 'GBK'");
mysql_select_db(db_name);
return db;
}
link = db_link();

//get inquiry criteria,用 POST取得數據也行
sn_id_1 = _REQUEST['sn_id_1'];
sn_id_2 = _REQUEST['sn_id_2'];

//inquiry total pages
sn_sql = "SELECT * FROM sn WHERE 1 ";
if (sn_id_1 != ''){
sn_sql .= "AND sn_id >= '".sn_id_1."' ";
}
if (sn_id_2 != ''){
sn_sql .= "AND sn_id <= '".sn_id_2."' ";
}
sn_sql .= "ORDER BY sn_id DESC ";

sn_res = mysql_query(sn_sql);
total = mysql_num_rows(sn_res);

//show page
pageshow = showpage(total);

//inquiry current page
sn_sql .= " limit offset,num";
sn_res = mysql_query(sn_sql);
sn_num = mysql_num_rows(sn_res);

//output inquiry result as XML
header("Content-Type: text/xml");
if(total > 0){
echo '<?xml version="1.0" encoding="gb2312"?>';
echo '<root>';
echo '<![CDATA[';
echo '<fieldset class="inquiry">
<legend>LIST</legend>
<table class="list">
<tr>
<th class="header">No</th>
<th class="header">SN</th>
<th class="header">Plant</th>
<th class="header">Sales</th>
<th class="header">Act</th>
<th class="header">Type</th>
<th class="header">Status</th>
<th class="header">Release Date</th>
<th class="header">Approve Date</th>
<th class="header">Reject Date</th>
<th class="header">Cancel Date</th>
<th class="header">Close Date</th>
</tr>';
num = offset;
for (i = 0; i < sn_num; i++) {
sn_row = mysql_fetch_array(sn_res);
if (i % 2 == 0) {
echo '<tr class="even" style="cursor:hand" >';
}else{
echo '<tr class="odd" style="cursor:hand" >';
}
echo'<td class="list center">'.(num+1).'</td>
<td class="list right blue">'.sn_row['sn_id'].'</td>
<td class="list center">'.sn_row['sn_plant'].'</td>
<td class="list right">'.sn_row['sn_sales'].'</td>
<td class="list center red">'.sn_row['sn_act'].'</td>
<td class="list center">'.sn_row['sn_type'].'</td>
<td class="list center">'.sn_row['sn_sts'].'</td>
<td class="list left">'.substr(sn_row['sn_rel_date'],0,10).'</td>
<td class="list left">'.substr(sn_row['sn_apv_date'],0,10).'</td>
<td class="list left">'.substr(sn_row['sn_rej_date'],0,10).'</td>
<td class="list left">'.substr(sn_row['sn_can_date'],0,10).'</td>
<td class="list left">'.substr(sn_row['sn_cls_date'],0,10).'</td>
</tr>';
num++;
}
echo '</table>';
echo '<div>'.pageshow.'</div>';
echo '</fieldset>';
echo ']]>';
echo '</root>';
}else{
echo 'find nothing';
}