PHP uses Jquery+ajax to realize multi-function operation of paging query

Last Update:2017-09-16 Source: Internet

Author: User

Tags prev

Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

1. First master page ajax_pag.php

The code is as follows:

<!         DOCTYPE html>Header{margin-top:20px; }    </style> <body> <div style= "margin-top:20px; margin-top:20px; " >Key Words:<input id= "Key" type= "text" name= "GJZ"/> <input type= "button" value= "Query" id= "CK"/> </div> <tableclass= "Table table-bordered Header" > <thead> <tr> <th> Area code &LT ;/th> <th> Region name </th> <th> Parent Code </th> </tr&            Gt </thead> <tbody id= "list" > </tbody> </table> <div style= "Ma rgin:0 Auto; width:500px; " > <ulclass= "pagination" id= "Fenye" > </ul> </div> </body> 
2. Then do the paging query JS page ajax_pag.js
The code is as follows:
//Ajax Paging started        varts = 10;//number of bars to display per page        varpage = 1;//Current Page$ (document). Ready (function(e) {//Page Load DataLoad (); //Load a paging listloadlist (); $("#ck"). Click (function(){                //Page Load DataLoad (); //Load a paging listloadlist (); })})                                //ways to load Data        functionLoad () {varGJZ = $ ("#key").Val (); $.Ajax ({async:false,URL: "Pagechuli.php",Data: {PAGE:PAGE,TS:TS,GJZ:GJZ},//page is the number of pages displayed;Type: "POST",DataType: "JSON",Success:function(data) {varstr = "";  for(vark in data) {STR+ = "<tr><td>" +data[k][0]+ "</td><td>" +data[k][1]+ "</td><td>" +data[k][2]+ " </td></tr> "; }                                    $("#list"). html (str);//Put the stitched string in the thody you want to display.                                }                            })                        }           //Load a paging list        functionloadlist () {varstr = ""; //Previous Pagestr+= "<li><a id= ' prev ' >&laquo;</a></li>"; //Load List             for(vari=page-4;i<page+5;i++){                //Restriction conditions                if(I>0 && i<=Zys ()) {                //judging the current page                if(i==page) {STR+ = "<li class= ' active ' ><a>" +i+ "</a></li>"; }Else{str+ = "<li><a class= ' item ' >" +i+ "</a></li>"; }        }            }            //Next Pagestr+= "<li><a id= ' Next ' >&raquo;</a></li>"; $("#fenye").html (str); $("#prev"). Click (function(){                if(page>1) {page--; }                //Page Load DataLoad (); //Load a paging listloadlist (); })                        $(". Item"). Click (function(){                varP = $ (this). text ();//takes a string and converts it to an integer.page =parseint (P); //Page Load DataLoad (); //Load a paging listloadlist (); })                        $("#next"). Click (function(){                if(page<Zys ()) {Page++; }                //Page Load DataLoad (); //Load a paging listloadlist (); })                    }                    //Total Pages    functionZys () {varZys = 0; $.Ajax ({async:false,URL: "Zyschuli.php",DataType: "TEXT",Success:function(data) {Zys= Math.Ceil(data/ts);        }        }); returnZys; }           
3. Finally do paging query processing page pagechuli.php
The code is as follows:
<?PHP$GJZ=$_post["GJZ"];$page=$_post["Page"];//Get page display values$ts=$_post["TS"];//get the number of bars per page display valuerequire_once"./dbda.class.php";$db=NewDbda ();$TJ= "1=1";if(!Empty($_post["GJZ"])){    $GJZ=$_post["GJZ"]; $TJ= "AreaName like '%{$GJZ}% ' or areacode like '%{$GJZ}% ' or parentareacode like '%{$GJZ}%‘ ";}$TG= ($page-1) *$ts;//each page shows $ts data, which shows the $TG data of the current page. $sql= "SELECT * from Chinastates where {$TJ} limit {$TG},{$ts}";Echo $db->jsonquery ($sql, 0)
Widget: Processing page for total pages zyschuli.php
<? PHP require_once "./dbda.class.php"; $db New Dbda (); $sql = "SELECT count (*) from chinastates"; Echo $db->strquery ($sql, 0);
Effect
Keyword query:
PHP uses Jquery+ajax to realize multi-function operation of paging query

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More