使用PHP和jQuery制作分页和表格
- 格式:docx
- 大小:160.77 KB
- 文档页数:11
在Thinkphp中使⽤ajax实现⽆刷新分页的⽅法在Thinkphp⽬录的Lib\ORG\Util\⽬录⾥新建AjaxPage.class.php,写⼊⼀下内容:<?php// +----------------------------------------------------------------------// | ThinkPHP [ WE CAN DO IT JUST THINK IT ]// +----------------------------------------------------------------------// | Copyright (c) 2009 All rights reserved.// +----------------------------------------------------------------------// | Licensed ( /licenses/LICENSE-2.0 )// +----------------------------------------------------------------------// | Author: liu21st <liu21st@>// +----------------------------------------------------------------------// $Id: Page.class.php 2712 2012-02-06 10:12:49Z liu21st $class AjaxPage {// 分页栏每页显⽰的页数public $rollPage = 5;// 页数跳转时要带的参数public $parameter ;// 默认列表每页显⽰⾏数public $listRows = 20;// 起始⾏数public $firstRow ;// 分页总页⾯数protected $totalPages ;// 总⾏数protected $totalRows ;// 当前页数protected $nowPage ;// 分页的栏的总页数protected $coolPages ;// 分页显⽰定制protected $config = array('header'=>'条记录','prev'=>'上⼀页','next'=>'下⼀页','first'=>'第⼀页','last'=>'最后⼀页','theme'=>' %totalRow% %header% %nowPage%/%totalPage% 页 %upPage% %downPage% %first% %prePage% %linkPage% %nextPage% %end% // 默认分页变量名protected $varPage;public function __construct($totalRows,$listRows='',$ajax_func,$parameter='') {$this->totalRows = $totalRows;$this->ajax_func = $ajax_func;$this->parameter = $parameter;$this->varPage = C('VAR_PAGE') ? C('VAR_PAGE') : 'p' ;if(!empty($listRows)) {$this->listRows = intval($listRows);}$this->totalPages = ceil($this->totalRows/$this->listRows); //总页数$this->coolPages = ceil($this->totalPages/$this->rollPage);$this->nowPage = !empty($_GET[$this->varPage])?intval($_GET[$this->varPage]):1;if(!empty($this->totalPages) && $this->nowPage>$this->totalPages) {$this->nowPage = $this->totalPages;}$this->firstRow = $this->listRows*($this->nowPage-1);}public function setConfig($name,$value) {if(isset($this->config[$name])) {$this->config[$name] = $value;}}public function show() {if(0 == $this->totalRows) return '';$p = $this->varPage;$nowCoolPage = ceil($this->nowPage/$this->rollPage);$url = $_SERVER['REQUEST_URI'].(strpos($_SERVER['REQUEST_URI'],'?')?'':"?").$this->parameter;$parse = parse_url($url);if(isset($parse['query'])) {parse_str($parse['query'],$params);unset($params[$p]);$url = $parse['path'].'?'.http_build_query($params);}//上下翻页字符串$upRow = $this->nowPage-1;$downRow = $this->nowPage+1;if ($upRow>0){$upPage="<a id='big' href='javascript:".$this->ajax_func."(".$upRow.")'>".$this->config['prev']."</a>";}else{$upPage="";}if ($downRow <= $this->totalPages){$downPage="<a id='big' href='javascript:".$this->ajax_func."(".$downRow.")'>".$this->config['next']."</a>";}else{$downPage="";}// << < > >>if($nowCoolPage == 1){$theFirst = "";$prePage = "";}else{$preRow = $this->nowPage-$this->rollPage;$prePage = "<a id='big' href='javascript:".$this->ajax_func."(".$preRow.")'>上".$this->rollPage."页</a>";$theFirst = "<a id='big' href='javascript:".$this->ajax_func."(1)' >".$this->config['first']."</a>";}if($nowCoolPage == $this->coolPages){$nextPage = "";$theEnd="";}else{$nextRow = $this->nowPage+$this->rollPage;$theEndRow = $this->totalPages;$nextPage = "<a id='big' href='javascript:".$this->ajax_func."(".$nextRow.")' >下".$this->rollPage."页</a>";$theEnd = "<a id='big' href='javascript:".$this->ajax_func."(".$theEndRow.")' >".$this->config['last']."</a>";}// 1 2 3 4 5$linkPage = "";for($i=1;$i<=$this->rollPage;$i++){$page=($nowCoolPage-1)*$this->rollPage+$i;if($page!=$this->nowPage){if($page<=$this->totalPages){$linkPage .= " <a id='big' href='javascript:".$this->ajax_func."(".$page.")'> ".$page." </a>";}else{break;}}else{if($this->totalPages != 1){$linkPage .= " <span class='current'>".$page."</span>";}}}$pageStr = str_replace(array('%header%','%nowPage%','%totalRow%','%totalPage%','%upPage%','%downPage%','%first%','%prePage%','%linkPage%','%nextPage%','%end%'),array($this->config['header'],$this->nowPage,$this->totalRows,$this->totalPages,$upPage,$downPage,$theFirst,$prePage,$linkPage,$nextPage,$theEnd),$this->config['theme']);return $pageStr;}}>控制器⾥写⼊以下内容:<?phpclass UserAction extends Action{public function user(){import("ORG.Util.AjaxPage");// 导⼊分页类注意导⼊的是⾃⼰写的AjaxPage类$credit = M('user');$count = $credit->count(); //计算记录数$limitRows = 5; // 设置每页记录数$p = new AjaxPage($count, $limitRows,"user"); //第三个参数是你需要调⽤换页的ajax函数名$limit_value = $p->firstRow . "," . $p->listRows;$data = $credit->order('id desc')->limit($limit_value)->select(); // 查询数据$page = $p->show(); // 产⽣分页信息,AJAX的连接在此处⽣成$this->assign('list',$data);$this->assign('page',$page);$this->display();}}>模板⽂件如下:<html><head><title>Ajax⽆刷新分页</title><script type="text/javascript" src="../Public/jquery-1.7.2.min.js"></script><script type="text/javascript">function user(id){ //user函数名⼀定要和action中的第三个参数⼀致上⾯有var id = id;$.get('User/user', {'p':id}, function(data){ //⽤get⽅法发送信息到UserAction中的user⽅法$("#user").replaceWith("<div id='user'>"+data+"</div>"); //user⼀定要和tpl中的⼀致});}</script></head><body><div id='user'> <!--这⾥的user和下⾯js中的test要⼀致--><volist id='list' name='list'> <!--内容输出--><{$list.id}> <{$ername}><br/></volist><{$page}> <!--分页输出--></div></body></html>以上所述是⼩编给⼤家介绍的在Thinkphp中使⽤ajax实现⽆刷新分页的⽅法,希望对⼤家有所帮助,如果⼤家有任何疑问请给我留⾔,⼩编会及时回复⼤家的。
(实⽤篇)jQuery+PHP+MySQL实现⼆级联动下拉菜单⼆级联动下拉菜单选择应⽤在在很多地⽅,⽐如说省市下拉联动,商品⼤⼩类下拉选择联动。
本⽂将通过实例讲解使⽤jQuery+PHP+MySQL来实现⼤⼩分类⼆级下拉联动效果。
先看下效果实现的效果就是当选择⼤类时,⼩类下拉框⾥的选项内容也随着改变。
实现原理:根据⼤类的值,通过jQuery把值传给后台PHP处理,PHP通过查询MySQl数据库,得到相应的⼩类,并返回JSON数据给前端处理。
XHTML⾸先我们要建⽴两个下拉选择框,第⼀个是⼤类,第⼆个是⼩类。
⼤类的值可以是预先写好,也可以是从数据库读取。
<label>⼤类:</label><select name="bigname" id="bigname"><option value="1">前端技术</option><option value="2">程序开发</option><option value="3">数据库</option></select><label>⼩类:</label><select name="smallname" id="smallname"></select>jQuery先写⼀个函数,获取⼤类选择框的值,并通过$.getJSON⽅法传递给后台server.php,读取后台返回的JSON数据,并通过$.each⽅法遍历JSON数据,将对应的值写⼊⼀个option字符串,最后将option追加到⼩类⾥。
function getSelectVal(){$.getJSON("server.php",{bigname:$("#bigname").val()},function(json){var smallname = $("#smallname");$("option",smallname).remove(); //清空原有的选项$.each(json,function(index,array){var option = "<option value='"+array['id']+"'>"+array['title']+"</option>";smallname.append(option);});});}注意,在遍历JSON数据追加之前⼀定要先将⼩类⾥的原有的项清空。
一、电子信息技术 (2)(一)软件.................................................................................................... 错误!未定义书签。
(二)微电子技术 ...................................................................................... 错误!未定义书签。
(三)计算机及网络技术 ............................................................................ 错误!未定义书签。
(四)通信技术............................................................................................ 错误!未定义书签。
(五)广播电视技术 .................................................................................. 错误!未定义书签。
(六)新型电子元器件 ................................................................................ 错误!未定义书签。
(七)信息安全技术 .................................................................................... 错误!未定义书签。
(八)智能交通技术 .................................................................................... 错误!未定义书签。
php 分页计算公式PHP分页计算公式是指在PHP编程中,用于计算分页的公式。
分页是指将大量数据按照一定的规则分为多个页面显示,常用于网站的数据展示和浏览。
在开发网站时,经常需要使用分页功能来提高用户体验和减少数据加载的压力。
在PHP中,常用的分页计算公式如下:1. 计算总页数总页数 = 总记录数 / 每页显示的记录数2. 计算起始记录位置起始记录位置 = (当前页码 - 1) * 每页显示的记录数3. 判断是否有上一页有上一页 = 当前页码 > 14. 判断是否有下一页有下一页 = 当前页码 < 总页数通过使用这些分页计算公式,可以实现在PHP中进行数据分页的功能。
下面将详细介绍如何使用这些公式实现分页功能。
需要获取总记录数和每页显示的记录数。
总记录数可以通过查询数据库、读取文件等方式获得,每页显示的记录数一般可以根据需求进行设定。
然后,需要获取当前页码。
当前页码可以通过URL参数、表单提交等方式获得,需要注意对用户输入的合法性进行校验,避免非法输入导致错误。
接下来,可以根据总记录数和每页显示的记录数计算出总页数。
需要注意处理除不尽的情况,可以使用向上取整的方式保证总页数的准确性。
然后,可以根据当前页码和每页显示的记录数计算出起始记录位置。
起始记录位置决定了每页显示的数据的起始位置,通过在查询数据库时添加LIMIT子句,可以从指定位置开始获取数据。
根据当前页码和总页数判断是否有上一页和下一页。
如果当前页码大于1,则说明存在上一页;如果当前页码小于总页数,则说明存在下一页。
在实现分页功能时,还需要注意处理边界情况。
例如,当总记录数为0时,应该禁用上一页和下一页的链接;当只有一页时,不显示分页导航等。
PHP分页计算公式是开发网站中常用的公式,可以帮助实现数据分页的功能。
通过合理使用这些公式,可以提高用户体验和减少数据加载的压力。
在实际应用中,需要根据具体需求进行调整和优化,以达到最佳的效果。
一、电子信息技术 (2)(一)软件.................................................................................................... 错误!未定义书签。
(二)微电子技术 ...................................................................................... 错误!未定义书签。
(三)计算机及网络技术 ............................................................................ 错误!未定义书签。
(四)通信技术............................................................................................ 错误!未定义书签。
(五)广播电视技术 .................................................................................. 错误!未定义书签。
(六)新型电子元器件 ................................................................................ 错误!未定义书签。
(七)信息安全技术 .................................................................................... 错误!未定义书签。
(八)智能交通技术 .................................................................................... 错误!未定义书签。
分页显示一种非常常见的浏览和显示量数据的方法,属于web编程中最常处理的之一。
对于web编程的老手来说,编写这种代码实在和呼吸一样自然,但对于初学者来说,常常对这个问题摸不着头绪,因此特地撰写此文对这个问题进行详细的讲解。
分页原理:所谓分页显示,也就将数据库中的结果集人为的分成一段一段的来显示,这里需要两个初始的参数:每页多少条记录($PageSize)?当前第几页($CurrentPageID)?现在只要再给一个结果集,就可以显示某段特定的结果出来。
至于其他的参数,比如:上一页($PReviousPageID)、下一页($NextPageID)、总页数($numPages)等等,都可以根据前边这几个东西得到。
以MySQL数据库为例,如果要从表内截取某段内容,sql语句可以用:select*fromtablelimitoffset,rows。
看看一组sql语句,尝试一下发现其中的规率。
前10条记录:select*fromtablelimit0,10第11至20条记录:select*fromtablelimit10,10第21至30条记录:select*fromtablelimit20,10……这一组sql语句其实就当$PageSize=10的时候取表内每一页数据的sql语句,们可以总结出这样一个模板:select*fromtablelimit($CurrentPageID-1)*$PageSize,$PageSize拿这个模板代入对应的值和上边那一组sql语句对照一下看看不那么回事。
搞定了最重要的如何获取数据的问题以后,剩下的就仅仅传递参数,构造合适的sql语句然后使用php从数据库内获取数据并显示了。
1。
ThinkPHP的分页功能使用介绍,超级详细的说明XCoderStudioThinkPHP官方的文档对分页功能的介绍不是特别多,只是简单聊了几句,这主要还是因为ThinkPHP是开放源码的,所以很多东西都是可以自己去查看的,而且这样我们可以从查看别人的源码中学习到一些别人写程序的技巧。
一、创建分页对象(Think\Page)在ThinkPHP 3.1及之前,分页功能可能是放在/Lib/Org/Util中的,到了ThinkPHP 3.2后,分页功能已经整合到了Library/Think中了。
而且ThinkPHP 3.2已经采用了命名机制,所以创建一个分页对象可以有两种方法:// 创建分页对象Page的方法一use Think/Page;$pageNav = new Page();// 创建分页对象Page的方法二$pageNav = new \Think\Page();分页对象Page可以接收三个参数,有两个必要的参数,其定义如下:new Page($totalRows, $listRows, $parameter = array())第一个参数是总的记录数据,及总共有多少条数据;第二个参数是每页显示的数据量;第三个参数是一个数组,Page类会检测这个数组中是否还有页码数据,如果有,则将当前页面定义到这个页码数据中,不会检测其他设置。
二、配置分页对象1、配置传递参数这个参数指的是在URL中传递的页码数据的变量名称,默认的是p=pageid,可以通过在config.php配置文件中设置一个返回变量VAR_PAGE,比如我想将这个变量名称改为page,则如下设置:‘VAR_PAGE’=> ‘page’2、配置显示模式设置分页功能的显示模式是通过setConfig()方法来完成的,可以设置的内容如下:// 分页显示定制private $config = array('header' => '<span class="rows">共 %TOTAL_ROW% 条记录</span>','prev' => '<<','next' => '>>','first' => '1...','last' => '...%TOTAL_PAGE%','theme' => '%FIRST% %UP_PAGE% %LINK_PAGE% %DOWN_PAGE% %END %',);上面内容是直接从Page类中拷贝过来的,具体意义非常明确,其中theme就是定义页面导航的显示内容格式。
php完美结合mysql数据库记录分页显示.txt生活是过出来的,不是想出来的。
放得下的是曾经,放不下的是记忆。
无论我在哪里,我离你都只有一转身的距离。
在php网络数据库编程时,不可避免的要考虑到数据库记录结果的显示问题,为了呈现美观页面并加快页面的载入速度,就需要对数据库记录进行分页显示。
现把与php完美结合的mysql数据库记录的分页显示实例拿出来与大家共享。
mysql数据库为xinxiku,数据表为joke。
其定义sql语句如下:create table joke (id int(5) not null auto_increment,biaoti varchar(40) not null,neirong text not null,primary key (id));字段说明:id :记录号,自动递增且为主键biaoti :标题neirong :内容<html><head><title>分页显示的实现方法</title><meta http-equiv="content-type" content="text/html; charset=gb2312"><script language="javascript">/* 定义一弹出窗口,来显示具体内容*/function popwin(url){window.open(url,"","left=340, top=190, height=280, width=400, resizable=yes, scrollbars=yes, status=no, toolbar=no, menubar=no, location=no");}</script></head><body leftmargin=0 topmargin=0 rightmargin=0 ><?php//连接数据库$db=mysql_connect("localhost","root","");mysql_select_db("xinxiku",$db);//设定每一页显示的记录数$pagesize=15;//取得记录总数,计算总页数用$res=mysql_query("select count(*) from joke " ,$db);$myrow = mysql_fetch_array($res);$numrows=$myrow[0];//计算总页数$pages=intval($numrows/$pagesize);if ($numrows%$pagesize)$pages++;//判断页数设置与否,如无则定义为首页if (!isset($page))$page=1;//判断转到页数if (isset($ys))if ($ys>$pages)$page=$pages;else$page=$ys;//计算记录偏移量$offset=$pagesize*($page-1);//取记录$res=mysql_query("select id,biaoti from joke order by id desc limit $offset,$pagesize" ,$db);//循环显示记录if ($myrow = mysql_fetch_array($res)){$i=0;?><table width="101%" border="0" cellspacing="0" cellpadding="0"><tr><td width="5%" bgcolor="#e1e9fb"></td><td width="95%" bgcolor="#e1e9fb"><font color="#ff6666" size="2">内容</font></td> </tr><?phpdo {$i++;?><tr><td width="5%" bgcolor="#e6f2ff"><?php echo $i;?></td><td width="95%" bgcolor="#e6f2ff"><font size="2"><a href="javascript:popwin('jokenr.php?id=<?php echo $myrow[0];?>')" ><?php echo $myrow[1];?></a></font></td></tr><?php}while ($myrow = mysql_fetch_array($res));echo "</table>" ;}//显示总页数echo "<div align='center'>共有".$pages."页(".$page."/".$pages.")<br>";//显示分页数for ($i=1;$i<$page;$i++)echo "<a href='fy.php?page=".$i."'>第".$i ."页</a> ";echo "第".$page."页 ";for ($i=$page+1;$i<=$pages;$i++)echo "<a href='fy.php?page=".$i."'>第".$i ."页</a> ";echo "<br>";//显示转到页数echo "<form action='fy.php' method='post'> ";//计算首页、上一页、下一页、尾页的页数值$first=1;$prev=$page-1;$next=$page+1;$last=$pages;if ($page>1){echo "<a href='fy.php?page=".$first."'>首页</a> ";echo "<a href='fy.php?page=".$prev."'>上一页</a> ";}if ($page<$pages){echo "<a href='fy.php?page=".$next."'>下一页</a> ";echo "<a href='fy.php?page=".$last."'>尾页</a> ";}echo "转到<input type=text name='ys' size='2' value=".$page.">页";echo "<input type=submit name='submit' value='go'>";echo "</form>";echo "</div>";?></body></html>程序说明:1、变量说明变量$page :存放当前要显示的页数。
Thinkphp5之ajax分页实现_paginate()参数详细Thinkphp5 做数据搜索需要带关键词分页,如何将查询条件带⼊到分页中,本⽂详细介绍Thinkphp5 分页带参数⼀、基本使⽤⽅法:$list = Db::name('user')->where('status',1)->paginate(10);⼆、查看thinkphp5 paginate()函数paginate()函数可以带三个参数:$listRows 每页数量数组表⽰配置参数$simple 是否简洁模式或者总记录数如果为true,那么分页的就是只有上⼀页和下⼀页$config 配置参数具体可以⾃⼰传⼊或者在配置⽂件中配置$config 参数具体配置参数描述list_rows每页数量page当前页path url路径query url额外参数fragment url锚点var_page分页变量type分页类名三、解决⽅案:$list = Db::name('user')->where('status',1)->paginate(10,false,['type' => 'Bootstrap','var_page' => 'page',//使⽤jqery ⽆刷新分页'path'=>'javascript:AjaxPage([PAGE]);'//第⼀种⽅法,使⽤数组⽅式传⼊参数'query' => ['keyword'=>$keyword],// 第⼆种⽅法,使⽤函数助⼿传⼊参数// 'query' => request()->param(),]);使⽤时在html模板页相应位置放⼊{$list->render()}<!-- 分页 --><div class="row"><div id="result">{$list->render()}</div></div>此时页⾯⾥会⽣成⼀个页码界⾯.虽然⽅法很简单,但是存在⼀个问题,每次点击页⾯都要刷新,⽤户体验很不好,所以要在tp5原有分页类的基础上加⼀个ajax操作,直接上代码:模板jquery_ajax代码:<script>var AjaxPage = function(page){$.ajax({url:'http://xxx/public/index.php/back/topic/ajaxList',type:'post',dataType:'json',data: {apage:page},success:function(data){//console.log(data)$("#result").html(data.page);}});}</script>控制器controller\Topic.php//显⽰分类管理界⾯public function listAction(){$list = model('Topic')->paginate(10,false,['type' => 'Bootstrap','var_page' => 'page','path'=>'javascript:AjaxPage([PAGE]);',//使⽤函数助⼿传⼊参数'query' => request()->param(),]);// $res = $mem->getList();$this->assign('list',$list);return $this->fetch('list');}public function ajaxListAction(){$page = request()->param('apage');if (!empty($page)) {$rel = model('topic')->paginate(10,false,['type' => 'Bootstrap','var_page' => 'page','page' => $page,'path'=>'javascript:AjaxPage([PAGE]);',]);$page = $rel->render();}return json(['list'=>$rel,'page'=>$page]);}因为使⽤了模型⽅法,还要定义⼀个模型类model\Topic.php<?php/*** Created by PhpStorm.* User: houzhyan* mail: houzhyan@* Locator: http://www.phpclass.top* Date: 2017/10/23* Time: 11:58*/namespace app\back\model;use think\Model;class Topic extends Model {}测试结果:。
前端开发技术实现分页功能的方法现如今,互联网的快速发展使得网页的内容变得越来越丰富和庞大,这就给前端开发带来了很大的挑战。
用户很难一次性加载并浏览完全部的内容。
因此,实现分页功能成为了前端开发过程中必备的技术之一。
分页是一种将数据分割成不同页面进行展示的方式,用户可以通过点击分页器或滚动来浏览内容,从而提升用户体验和性能。
在前端开发中,实现分页功能有以下几种方法。
1. 传统分页最常见的分页方式就是传统的分页方式。
在这种方式下,后端会根据前端传递的页码和每页显示数量,返回对应页码的数据。
前端收到数据后,根据返回的数据进行渲染。
该方式简单易懂,但有一定的性能问题,因为每次加载新的页面都需要向后端请求数据。
2. 懒加载懒加载是一种更加智能和高效的分页方式。
它会根据用户的滚动行为动态加载新的数据,而不是一次性将所有数据加载完毕。
懒加载可以提升整体的页面加载速度,并且减轻了服务器的压力。
在懒加载中,分页功能可以通过监听滚动事件,当用户滚动到页面底部时,自动加载下一页的数据。
这种方式可以利用一些插件或库来实现,如Intersection Observer。
3. 无限滚动无限滚动是一种类似于懒加载的方式,它可以无限地加载数据,用户可以不断滚动浏览新的内容。
在无限滚动中,页面会根据用户的滚动行为自动加载下一页的内容,并在当前内容末尾添加新的数据。
这种方式可以提升用户的浏览体验,并减少页面的跳转次数。
它可以通过监听滚动事件,当用户滚动到页面底部时,自动加载下一页的数据。
同样的,也可以使用一些插件或库来实现。
4. 利用URL参数前端还可以通过URL参数来实现分页功能。
在这种方式下,用户的操作会通过改变URL参数的方式来实现分页。
当用户点击分页器时,会改变URL参数的值,并重新加载页面。
前端可以通过解析URL参数来获取相应的页码,并从后端请求对应页码的数据。
这种方式能够在用户操作后进行前进或后退,方便用户对内容的查看和导航。
JQUERY LIGERUI服务器分页1.请求的url:<s:urlvalue=”/pages/terminal/cardFactoryManage1.jsp”/>2.jsp页面展示:cardFactoryManage1.jsp<script type="text/javascript">$(function(){$("#maingrid").ligerGrid({columns: [{ display: '厂商编号', name: 'factoryId', width:'10%' },{ display: '厂商名称', name: 'factoryName',width:'15%',type:'int' },{ display: '厂商初始秘钥', name: 'initKey',width:'30%',type:'int' },{ display: '联系人', name: 'contactor', width:'10%', type: 'int'},{ display: '联系人电话', name: 'contactPhone',width:'12%',type:'int' },{ display: '厂商状态', name: 'status', width: '10%', align: 'center',render:function(rowdata,rowindex){if(rowdata.status=='0'){return '未使用';}else if(rowdata.status=='1'){return '正在使用';}else if(rowdata.status=='2'){return '暂停';} } },{ display: '操作',width:"10%", isSort: false, render: function (rowdata, rowindex, value){var h = "";if (!rowdata._editing){// h += "<a href='javascript:beginEdit(" + rowindex + ")'>修改</a> ";// h += "<a href='javascript:deleteRow(" + rowindex + ")'>删除</a> ";}else{h += "<a href='javascript:endEdit(" + rowindex rowindex + ")'>提交</a> ";h += "<a href='javascript:cancelEdit("+ rowindex + ")'>取消</a> ";}return h;}}],onSelectRow: function (rowdata, rowindex){$("#txtrowindex").val(rowindex);},pageSize: 15,sortName : null,sortOrder:null,root :'Rows', //数据源字段名record:'Total', //数据源记录数字段名段名pageParmName :'page', //页索引参数名,(提交给交给服务器)pagesizeParmName:'pagesize', //页记录数参数名,(提(提交给服务器)dataAciton : 'server',url:'<s:urlvalue="/swipeCardFactory!allswipeCardFactory.ac"/>',});$('#maingrid').ligerGrid().set('dataAction','server');});3.请求的action// 分页开始public class SwipeCardFactoryAction extends BaseAction { private int page = 1;private int pageSize = 15;public int getPage() {return page;}public void setPage(int page) {this.page = page;}public int getPageSize() {return pageSize;}public void setPageSize(int pageSize) {this.pageSize = pageSize;}public void allswipeCardFactory() {swipeCardFactoryList = swipeCardFactoryService.selectAllSwipeCardFactory();List<SwipeCardFactory>list=newArrayList<SwipeCardFactory>();int num = page * pageSize;int count = (page - 1) * pageSize;for(int i=count;i<(num<=swipeCardFactoryList.size()?num :swipeCardFactoryList.size()); i++) {list.add(swipeCardFactoryList.get(i));}JSONArray array = JSONArray.fromObject(list);JSONObject object = new JSONObject();object.put("Rows", array.toString());object.put("Total", swipeCardFactoryList.size());swipeList = object.toString();System.out.println(swipeList);try {getResponse().getWriter().write(swipeList);} catch (IOException e) {e.printStackTrace();}}}。
jQueryEasyUIAPI中⽂⽂档-表格树(Treegrid)TreeGrid由 $.fn.datagrid.defaults扩展⽽来。
default由$.fn.treegrid.defaults重载。
Treegrid⽤来在表格中显⽰层级数据。
它基于datagrid,结合了treeview和editable grid。
Treegrid可以⾃定义,异步展开⾏数据,在多列中展⽰层级数据。
依赖控件datagrid⽤法⽤HTML标记⽣成treegrid. 在⼤多数情况下,treegrid和datagrid 拥有相同的结构和格式;<table id="tt" class="easyui-treegrid" style="width:600px;height:400px"data-options="url:'get_data.php',idField:'id',treeField:'name'"><thead><tr><th data-options="field:'name',width:180">Task Name</th><th data-options="field:'persons',width:60,align:'right'">Persons</th><th data-options="field:'begin',width:80">Begin Date</th><th data-options="field:'end',width:80">End Date</th></tr></thead></table>⽤javascript⽣成treegrid<table id="tt" style="width:600px;height:400px"></table>$('#tt').treegrid({url:'get_data.php',idField:'id',treeField:'name',columns:[[{title:'Task Name',field:'name',width:180},{field:'persons',title:'Persons',width:60,align:'right'},{field:'begin',title:'Begin Date',width:80},{field:'end',title:'End Date',width:80}]]});属性属性扩展⾃datagrid, 下⾯是为treegrid新增的属性:名称类型描述缺省值idField string树节点的key值。
THINKPHP5分页page,limit,paginate
limit:限制结果数量
显示10个条记录,我理解用法是最近10条记录
如果加上2个参数,底10行开始的25条记录,第几个开始的多少个数据
PAGE:分页
page方法则是更人性化的进行分页查询的方法,limit虽然也可以.
如果使用limit方法,我们要查询第一页和第二页(假设我们每页输出10条数据)写法如下:
显而易见的是,使用page方法你不需要计算每个分页数据的起始位置,page方法内部会自动计算。
page方法还可以和limit方法配合使用,例如:
每页25条数据,显示第三页
则用于设置每页显示的数量,也就是说上面的写法等同于:
例如:
DATATABLES的分页方法同样好用(如图红色部分标准样式)
缺点:排版相对固定样式不利于个性化设计界面,而且是一次性独处所有数据,对大数据时间过长(应该是渲染时间而不是查询数据的时间) 优点:对于搜索提交界面用因为是一次性数据,切换页签时页面不会刷新,另外特有的冲当前字段检索非常方便,是从所有数据页面中检索.
考虑性能的话用LIMIT来显示查询数量.。
php+ajax+jquery 书第二章学生管理一、概述本章将介绍如何使用php、ajax和jquery实现学生管理系统的基本功能。
通过本章的学习,您将掌握如何使用ajax进行异步数据请求,以及如何使用jquery处理数据和实现交互效果。
二、技术要点1. php:php是一种服务器端脚本语言,用于处理和生成网页内容。
在本章中,我们将介绍如何使用php进行数据库操作和数据展示。
2. ajax:ajax是一种使用javascript和xml来与服务器交换数据并更新部分网页的技术。
在本章中,我们将介绍如何使用ajax进行异步数据请求,以及如何处理数据返回。
3. jquery:jquery是一种快速、简洁的javascript库,用于简化javascript编程。
在本章中,我们将介绍如何使用jquery处理数据和实现交互效果,如动画、表单验证等。
三、实现步骤1. 数据库设计:设计学生管理系统的数据库结构,包括学生表、课程表、选课表等。
2. 页面布局:设计学生管理系统的页面布局,包括学生列表页、学生详情页、新增学生页等。
3. 页面初始化:在页面加载时,使用jquery获取数据库中的学生数据,并将其展示在页面上。
4. 添加新学生:在新增学生页,使用ajax向服务器发送添加学生的请求,并使用jquery处理表单验证和提交。
5. 更新学生信息:在修改学生页,使用ajax向服务器发送更新学生的请求,并使用jquery处理表单提交和数据更新。
6. 删除学生:在删除学生页,使用ajax向服务器发送删除学生的请求,并使用jquery处理删除操作。
7. 服务器响应:在接收到ajax请求后,使用php处理数据库操作,并返回相应的数据给ajax客户端。
四、代码示例以下是一个简单的示例代码,展示了如何使用php、ajax和jquery实现学生管理系统的基本功能。
1. 数据库操作代码(以MySQL为例):```php<?php// 连接数据库$servername = "localhost";$username = "your_username";$password = "your_password";$dbname = "your_database";$conn = new mysqli($servername, $username, $password, $dbname);if ($conn->connect_error) {die("连接失败: " . $conn->connect_error);}// 添加学生请求示例$studentName = $_POST['student_name'];$studentAge = $_POST['student_age'];$sql = "INSERT INTO students (name, age) VALUES('$studentName', '$studentAge')";if ($conn->query($sql) === TRUE) {echo "学生添加成功";} else {echo "添加失败: " . $conn->error;}>```2. ajax请求代码(以jQuery AJAX为例):```javascript$(document).ready(function() {// 获取学生列表请求示例$.ajax({url: 'get_students.php', // 后台处理ajax请求的php文件地址type: 'GET',success: function(data) {// 处理请求成功后的数据展示逻辑$('#student-list').html(data); // 将返回的学生数据展示在页面上},error: function() {// 处理请求失败的逻辑alert('获取学生列表失败');}});});```3. jquery处理表单验证和提交代码:这里以新增学生表单为例,展示如何使用jquery处理表单验证和提交。
jquery.pagination.js分页使⽤教程简单介绍⼀下在动态⽹页⾥⾯的jquery.pagination.js分页的使⽤,具体内容如下添加下载的js和样式,主要是先添加jquery.js 再添加jquery.pagination.js,我这是下载好的,放在本地<link rel="stylesheet" href="<%=path%>css/pagination.css" type="text/css"><script type="text/javascript" src="<%=path%>js/jquery-1.11.3.js"></script><script type="text/javascript" src="<%=path%>js/jquery.pagination.js"></script>表格,⽤的是c标签,获取控制器传过来的值<table width="1052" border=0 align=center cellpadding=2 cellspacing=1bordercolor="#799AE1" class=tableBorder><tbody><tr><th align=center colspan=16 style="height: 23px">商品显⽰</th></tr><tr align="center" bgcolor="#799AE1" style="height:28px"><td width="10%" align="center" class=txlHeaderBackgroundAlternate>商品编号</td><td width="10%" align="center" class=txlHeaderBackgroundAlternate>商品⼤类</td><td width="10%" align="center" class=txlHeaderBackgroundAlternate>商品名称</td><td width="10%" align="center" class=txlHeaderBackgroundAlternate>商品规格</td><td width="10%" align="center" class=txlHeaderBackgroundAlternate>加权进价</td><td width="10%" align="center" class=txlHeaderBackgroundAlternate>当前售价</td><td width="10%" align="center" class=txlHeaderBackgroundAlternate>操作</td></tr><c:forEach items="${goodsS}" var="goods"><tr bgcolor="#DEE5FA"><td align="center" id="goodsId" class="txlrow"><c:outvalue="${goods.goodsId}"></c:out></td><td align=center id="goodsType" class=txlrow><c:outvalue="${goods.goodsType}"></c:out></td><td align=center id="goodsName" class=txlrow><c:outvalue="${goods.goodsName}"></c:out></td><td align=center id="goodsContent" class=txlrow><c:outvalue="${goods.goodsContent}"></c:out></td><td align=center id="goodsPrice" class=txlrow><c:outvalue="${goods.goodsPrice}"></c:out></td><td align=center id="goodsSell" class=txlrow><c:outvalue="${goods.goodsSell}"></c:out></td><td align=center class=txlrow> <input type="button" value="编辑"></td></tr></c:forEach></tbody></table><!--分页显⽰--><div id="Pagination"></div>jsvar limit=<%=request.getAttribute("limit")%>;//每页显⽰多少条数据var count=<%=request.getAttribute("count")%>//共多少条数据var index=<%=request.getAttribute("index")%>;//当前记录数$(function(){$("#Pagination").pagination(count, {items_per_page:limit, // 每页显⽰多少条记录current_page: Math.ceil(index/limit), //当前页num_display_entries:4, // 分页显⽰的条⽬数next_text:"下⼀页",prev_text:"上⼀页",num_edge_entries:2, // 连接分页主体,显⽰的条⽬数callback:handlePaginationClick});});function handlePaginationClick(new_page_index, pagination_container) {var path="<%=ppath%>/goodsManager/searchGoodsBylimit/" + new_page_index*limit;$("#goodsForm").attr("action",path );$("#goodsForm").submit();return false;}控制器@RequestMapping(value = "/searchGoodsBylimit/{index}")public String searchGoodsBylimitPst(Model model,@ModelAttribute Goods goods, @PathVariable String index,HttpServletRequest request) {//索引if (index == null || index.equals("")) {index = "0";//从服务器获取数据List<Goods> goodsS = goodsService.selectGoods(goods,Integer.parseInt(index), PageParam.limit);if (goodsS != null) {model.addAttribute("goodsS", goodsS);} else {model.addAttribute("resultMsg", "没有该商品");}//数据总条数int count = goodsService.selectAllCount(goods);model.addAttribute("index", index);model.addAttribute("count", count);model.addAttribute("limit", PageParam.limit);System.out.println("第" + index + "数据开始显⽰" + goodsS.size() + "条记录");return "goodsManager/showGoods";}效果图以上就是本⽂的全部内容,希望对⼤家的学习有所帮助,也希望⼤家多多⽀持。
jQuery分页插件pagination的⽤法参数:参数名描述参数值maxentries总条⽬数必选参数,整数items_per_page每页显⽰的条⽬数可选参数,默认是10num_display_entries连续分页主体部分显⽰的分页条⽬数可选参数,默认是10current_page当前选中的页⾯可选参数,默认是0,表⽰第1页num_edge_entries两侧显⽰的⾸尾分页的条⽬数可选参数,默认是0link_to分页的链接字符串,可选参数,默认是"#"prev_text“前⼀页”分页按钮上显⽰的⽂字字符串参数,可选,默认是"Prev"next_text“下⼀页”分页按钮上显⽰的⽂字字符串参数,可选,默认是"Next"ellipse_text省略的页数⽤什么⽂字表⽰可选字符串参数,默认是"..."prev_show_always是否显⽰“前⼀页”分页按钮布尔型,可选参数,默认为true,即显⽰“前⼀页”按钮next_show_always是否显⽰“下⼀页”分页按钮布尔型,可选参数,默认为true,即显⽰“下⼀页”按钮callback回调函数默认⽆执⾏效果举例:例如下⾯的使⽤代码:$("#Pagination").pagination(56, {num_edge_entries: 2,num_display_entries: 4,callback: pageselectCallback,items_per_page:1});这段代码表⽰的含义是:总共有56(maxentries)个列表项,⾸尾两侧分页显⽰2(num_edge_entries)个,连续分页主体数⽬显⽰4(num_display_entries)个,回调函数为pageselectCallback(callback),每页显⽰的列表项为1(items_per_page)个。
使用PHP和jQuery制作分页和表格如果您已经下载了本站提供的baseProject项目源码,后台中列表页面均可作为示例,其中文章列表页面的功能最为丰富。
如果您没有下载该源码,相关的js文件可以从/scripts/basic.js获得,示例页面为/feedback 页面。
以下是后台文章列表页面的截图。
分页和表格功能实例截图分页功能详解分页功能用于当目标数据过多时,为提高页面展示速度采用的一种手段。
本文中的分页功能借用了Zend Framework中的Zend_Paginator对象,分页适配器为Zend_Paginator_Adapter_Null。
该适配器也是最简单易用的一个。
工作原理在PHP端,分页功能的基本参数为记录总数($countRows)、每页显示的记录数($rowsPerPage)、当前页码($page 默认值为1),页码数量($items 指每次在页面上显示多少个页码,建议为单数)。
其他参数可以通过计算得到:1.页码合计($countPages)取不小于$countRows/$rowsPerPage的整数;2.起始页码和结束页码的计算方式太长不写了;3.页码列表:从起始页码到结束页码的页码组成的数组,如array(4, 5, 6, 7, 8)在HTML端,必要的参数为PHP端计算得出的数据,同时需要指定一个用于显示分页信息的html元素。
然后使用jQuery根据参数动态生成html并将其插入到指定的html元素中就行了。
PHP示例代码详解1.public function articlesAction() {2.$pageNumber= $this->getRequest()->getParam('page', 1);//获取当前页码,如果未指定则设为13.$sortBy= $this->getRequest()->getParam('sortby');//获取sortby设置4.if (empty($sortBy) || ! preg_match('/^[a-z0-9_-]+ (asc|desc)$/i', $sortBy)) {5.//如果sortBy为空或者不符合格式要求则使用以下的排序方式6.//注意:一定要进行格式检查,防止sql注入7.$sortBy= Project_Table::getFullyColumnName('article', 'id') . ' desc';8.}9.$mArticle= new Model_Article();10./* 这部分是处理where子句的,和本文关系不大,略过*/11.$whereArray = array(12.'`article`.`article_category_id`'=>$this->getRequest()->getParam(Project_Table::getFullyColumnName('article','article_category_id')),13.'`article`.`article_status_id`'=>$this->getRequest()->getParam(Project_Table::getFullyColumnName('article','article_status_id')),14.);15.$whereString = '';16.foreach ($whereArray as $key => $value) {17.if (! empty($value)) {18.if ($key == '`article`.`article_category_id`' &&$value == '-1') {19.$whereString .= " AND {$key} IS NULL";20.} else {21.$whereString .= " AND {$key} = '{$value}'";22.}23.}24.}25.if (! empty($whereString)) {26.$whereString= substr($whereString, strlen(' AND '));27.} else {28.$whereString = null;29.}30./* 以上是处理where子句的*/31.$maxGetRows= Project_Config::PAGINATOR_ITEM_COUNT_PER_PAGE;//设置每页显示的记录数量32.$articles = $mArticle->getArticles($whereString, $sortBy, $maxGetRows,($pageNumber - 1) * $maxGetRows);//从数据库中读取数据33.$countArticles= Project_Table::getLastFoundRows();//获得符合条件的数据总数34.if (empty($articles) && ! empty($countArticles)) {35.//如果没有取到任何记录,而且记录总数不为空,说明当前页码超出范围了,所以处理一下36.$articles = $mArticle->getArticles($whereString, $sortBy, $maxGetRows, null);37.$pageNumber = 1;38.}39.$pDate= Project_Datetime::getInstance();//时间处理工具,和本文无关40.foreach ($articles as $key => $article) {41.$articles[$key][Project_Table::getFullyColumnName('article', 'modified')] = $pDate->getUserTimeFromTime($article[Project_Table::getFullyColumnName('article','modified')], true);//把时间戳转换为用户的当地时间,和本文无关42.}43.$paginator= Zend_Paginator::factory($countArticles, 'Null');//调用Zend提供的分页适配器,参数1是总记录数,参数2是适配器的名字44.$paginator->setCurrentPageNumber($pageNumber);//告诉分页器当前页码45.$pages = $paginator->getPages();//得到了前面提到的所有参数,后面我会打印它,这样你会直观的看到其内容46.$this->view->articles = $articles;47.$this->view->pages = $pages;48.//以下处理是为了页面中的下拉选单提供选项数据,和本文关系不大49.if(! $this->getRequest()->isPost()) {50.$mpArticle= new Mapper_Article();51.$this->view->elementArticleStatusId =$mpArticle->getElement('article_status_id', array(Project_Mapper::OPTIONS_NULLABLE =>true, Project_Mapper::OPTIONS_DEFAULT =>''));52.$_categories = $mArticle->getAllowAppendArticleArticleCategories(null, null, null, null, true);53.$categories = array(54.$this->view->translate(Model_Article::NO_CATEGORY) =>'-1',55.);56.foreach ($_categories as $key => $row) {57.$categories[$row[Project_Table::getFullyColumnName('article_category', 'name')]] = $row[Project_Table::getFullyColumnName('article_category', 'id')];58.}59.$mpArticle= new Mapper_Article();60.$this->view->elementArticleCategories =$mpArticle->getElement('article_category_id', array(Project_Mapper::OPTIONS_IN_ARRAY =>$categories, Project_Mapper::OPTIONS_NULLABLE =>true));61.}62.}$pages中的内容我打印了一下,这样更直观。
如下。
63.stdClass Object64.(65.[pageCount] => 366.[itemCountPerPage] => 1067.[first] => 168.[current] => 269.[last] => 370.[previous] => 171.[next] => 372.[pagesInRange] => Array73.(74.[1] => 175.[2] => 276.[3] => 377.)78.79.[firstPageInRange] => 180.[lastPageInRange] => 381.[currentItemCount] => 1082.[totalItemCount] => 2183.[firstItemNumber] => 1184.[lastItemNumber] => 2085.)Zend Framework的开发人员确实很认真,返回的参数非常充分,不需要任何的补充。