主页
软件技术
返回
PHP+Ajax实现分页技术

        基于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 用于获取表单中所有输入控件的值,并将输入值组成一个字符串传到服务器。

        <script type="text/javascript"> function getFormValue(form){

        var str='';

        var ft,fv;

        for (var i=0; i<form.elements.length; i++){ fv = form.elements[i];

        ft = fv.type.toLowerCase();

        switch(ft){

        case 'select-one':

        str+=fv.name+'='+escape(fv.value)+'&'; break;

        case 'radio':

        if (fv.checked){

        str+=fv.name+'='+escape(fv.value)+'&'; }

        break;

        case 'checkbox':

        if (fv.checked){

        str+=fv.name+'='+escape(fv.value)+'&'; }

        break;

        case 'text':

        str+=fv.name+'='+escape(fv.value)+'&'; break;

        case 'password':

        str+=fv.name+'='+escape(fv.value)+'&'; break;

        case 'hidden':

        str+=fv.name+'='+escape(fv.value)+'&'; break;

        case 'textarea':

        str+=fv.name+'='+escape(fv.value)+'&'; break;

        default:

        break;

        }

        }

        return str.split(/s/).join('') }

        //showcomment(page) 用于显示分页数据,被查询按钮onclick 事件调用, url为后台处理数据并输出XML格式数据的文件url。

        function showcomment(page) {

        var x = new Ajax('statusid', 'XML'); url =

        'sn_show.php?page='+page+'&'+getFormValue(document.form1);

        x.get(url , function(s) {

        if(s.lastChild){

        getbyid("show").innerHTML = "Loading……"; getbyid("show").innerHTML = s.lastChild.firstChild.nodeValue; removeLoading(document.getElementById("show"));

        }

        else{

        document.form1.submit();

        }

        });

        }

        //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

        function Ajax(statusId, recvType) {

        var aj = new Object();

        displayLoading(document.getElementById("show"));

        var clientHeight = scrollTop = 0;

        if(navigator.userAgent.toLowerCase().indexOf('opera') > -1)

        {

        clientHeight = document.body.clientHeight;

        scrollTop = document.body.scrollTop;

        } else {

        clientHeight = document.documentElement.clientHeight;

        scrollTop = document.documentElement.scrollTop;

        }

        if(document.getElementById(statusId)) {

        aj.statusId = document.getElementById(statusId);

        document.getElementById(statusId).style.top = 10+"px";

        } else {

        var divElement = document.createElement("DIV");

        divElement.id = "xspace-tipDiv";

        divElement.className = "xspace-ajaxdiv";

        divElement.style.cssText = "width:200px; height:40px; line-height: 40px; text-align: center;";

        divElement.style.left = 10+"px";

        divElement.style.top = 10+"px";//(clientHeight +scrollTop - 60)

        divElement.id = statusId;

        document.body.appendChild(divElement);

        aj.statusId = divElement;

        }

        aj.targetUrl = '';

        aj.sendString = '';

        aj.recvType = recvType ? recvType : 'HTML';//HTML XML

        aj.resultHandle = null;

        aj.createXMLHttpRequest = function() {

        var request = false;

        if(window.XMLHttpRequest) {

        request = new XMLHttpRequest();

        if(request.overrideMimeType) {

        request.overrideMimeType('text/xml');

        }

        } else if(window.ActiveXObject) {

        var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP',

        'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];

        for(var i=0; i<versions.length; i++) {

        try {

        request = new ActiveXObject(versions[i]);

        if(request) {

        return request;

        }

        } catch(e) {

        //alert(e.message);

        }

        }

        }

        return request;

        }

        aj.XMLHttpRequest = aj.createXMLHttpRequest();

        aj.processHandle = function() {

        aj.statusId.style.display = '';

        if(aj.XMLHttpRequest.readyState == 4) {

        if(aj.XMLHttpRequest.status == 200) {

        if(aj.recvType == 'HTML') {

        aj.resultHandle(aj.XMLHttpRequest.responseText);

        } else if(aj.recvType == 'XML') {

        aj.resultHandle(aj.XMLHttpRequest.responseXML);

        }

        aj.statusId.style.display = 'none';

        } else {

        aj.statusId.innerHTML = xml_http_load_failed;

        }

        }

        }

        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;

        }

        function getbyid(id) {

        if (document.getElementById) { return document.getElementById(id); } else if (document.all) {

        return document.all[id];

        } else if (document.layers) { return document.layers[id];

        } else {

        return null;

        }

        }

        </script>

        <?php

        //注意:此处如果有filesedset的话,form表单一定要放在fieldset

        里面,否则出错。

        echo '<form name="form1" action="" method="post">

        <table cellpadding="0" cellspacing="1"> <tr>

        <th>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.="&nbsp;&nbsp;<a href="javascript:

        showcomment(".h.");">".iconv('gb2312','gb2312',h)."</a>&nb

        sp;&nbsp;";

        }

        }

        pagenav.="&nbsp;&nbsp;&nbsp;&nbsp;"; 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> <legend>LIST</legend>

        <table>

        <tr>

        <th>No</th>

        <th>SN</th>

        <th>Plant</th>

        <th>Sales</th>

        <th>Act</th>

        <th>Type</th>

        <th>Status</th>

        <th>Release Date</th>

        <th>Approve Date</th>

        <th>Reject Date</th>

        <th>Cancel Date</th>

        <th>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 style="cursor:hand" >';

        }else{

        echo '<tr 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';

        }

        ?>

         

        


顺德一座电梯天桥工程造价为720万 却有下行无上行
2012一级建造师《项目管理》正版考试用书增值服务第四次(二)
安全工程师2015年辅导:铅冶炼防尘防毒技术规程(GB/T17398—1998)1
[广东]著名大学校区一期工程施工组织设计(直饮水 高空水炮)
[北京]综合办公楼装修改造工程施工组织设计
2014年1-12月重庆铜材产量统计(分月度)
用新思维新举措努力实现建筑产业现代化新跨越
江苏响水县2015年度安全工程师考试报名时间为5月12日-26日
信息发布:名易软件http://www.myidp.net