pbootcms网站模板|日韩1区2区|织梦模板||网站源码|日韩1区2区|jquery建站特效-html5模板网

ThinkPHP整合datatables實(shí)現(xiàn)服務(wù)端分頁的示例代碼

下面小編就為大家分享一篇ThinkPHP整合datatables實(shí)現(xiàn)服務(wù)端分頁的示例代碼,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧

最近做東西有一個(gè)需求,因?yàn)閿?shù)據(jù)量很大,在這里我決定使用datatables的服務(wù)端分頁,同時(shí)還需要傳遞查詢條件到服務(wù)端。在網(wǎng)上搜索的大部分文章都感覺有些誤差,于是自己封裝了一下,主要配置/工具為:

服務(wù)端:php(使用thinkphp)

頁面樣式來自于H-ui框架(datatables版本為1.10.0)

主要修改(databases)配置項(xiàng)為:

1) bProcessing:true 使用ajax源

2) serverSide:true 使用服務(wù)端分頁

3) createdRow:function(){} 回調(diào)函數(shù),用于添加事件或類名

4) aoColumns 用于處理、顯示數(shù)據(jù),其中render屬性用于自定義列

1.datatables 的js代碼為:

$('.table-sort').dataTable({
 processing: true,
  serverSide: true,
  ajax: {
   "url":"{:U('Msg/index')}",
   "data":function(d){ //額外傳遞的參數(shù)
    d.mintime = $('#logmin').val();
    d.maxtime = $('#logmax').val();
   }
  },
  bStateSave: true,//狀態(tài)保存
  aLengthMenu : [20, 30, 50, 100, 150],
  bProcessing : true,
  bAutoWidth: false,
  bFilter : true, //是否啟動(dòng)過濾、搜索功能
  bInfo : true, //是否顯示頁腳信息,DataTables插件左下角顯示記錄數(shù) 
  createdRow: function ( row, data, index ) {
   $(row).addClass('text-c');
   $('#count').html(data.recordsFiltered);
  },
  aoColumns: [
   {
    "sClass": "text-center",
    "data": "id",
    "render": function (data, type, full, meta) {
     return '<input type="checkbox" name="select" value="' + data + '" />';
    },
    "bSortable": false
   },
   { "mData": "id" },
   { "mData": "fromnickname"},
   { "mData": "content" },
   { "mData": "msgtype" },
   { "mData": "time"},
   {
    "sClass": "text-center",
    "data": "id",
    "render": function (data, type, full, meta) {
     html = '<a title="查看" href="javascript:;" rel="external nofollow" rel="external nofollow" onclick="show(`查看`,`__URL__/show/id/'+ data + '`,``,`610`)" class="ml-5" style="text-decoration:none"><i class="Hui-iconfont">查看</i></a>';
     html += '<a style="text-decoration:none" class="ml-5" onClick="signDel(this,'+ data +')" href="javascript:;" rel="external nofollow" rel="external nofollow" title="刪除"><i class="Hui-iconfont"></i>刪除</a>';
     return html;
    },
    "bSortable": false
   }
  ]
});

2.服務(wù)端方面:

控制器:
接收參數(shù)如下:
draw    前端傳過來的值,原值返回,用于驗(yàn)證
mintime、maxtime 自定義參數(shù)(時(shí)間)
search.value  datatables搜索框參數(shù),用于查詢篩選
order.0.column  要排序的單元格(從0開始,字段需要自己設(shè)置)
order.0.dir   排序(升序、降序)
start    起始條數(shù)(第幾條開始)
length    查詢長度
返回的數(shù)據(jù)如下:
draw    返回前端傳過來的值
recordsTotal  記錄總條數(shù)
recordsFiltered  條件篩選后的記錄總條數(shù)
data    服務(wù)端查詢的數(shù)據(jù)
返回?cái)?shù)據(jù)形式:json

3.服務(wù)端后端完整代碼如下:

1)控制器代碼:

public function index()
{
 if(IS_AJAX){
  $list = D('Msg')->getData(I('get.'));
  $this->ajaxReturn($list);
 }
 $this->display();
}

2) Model層代碼:(*其中,dealTime方法主要用于處理時(shí)間段)

public function getData($data)
{
 //獲取Datatables發(fā)送的參數(shù) 必要
 $draw = $data['draw']; //這個(gè)值直接返回給前臺(tái)
 //獲取時(shí)間區(qū)間
 $timeArr['mintime'] = $data['mintime'];
 $timeArr['maxtime'] = $data['maxtime'];
 $where = $this->dealTime($timeArr);
 //搜索框
 $search = trim($data['search']['value']); //獲取前臺(tái)傳過來的過濾條件 
 if(strlen($search) > 0) {
  $where['id|fromnickname|content|msgtype'] = array('like','%'.$search.'%');
 }
 //定義查詢數(shù)據(jù)總記錄數(shù)sql
 $recordsTotal = $this->count();
 //定義過濾條件查詢過濾后的記錄數(shù)sql
 $recordsFiltered = $this->where($where)->count();
 //排序條件
 $orderArr = [1=>'id', 2=>'fromnickname', 3=>'content', 4=>'msgtype', 5=>'time'];
 //獲取要排序的字段
 $orderField = (empty($orderArr[$data['order']['0']['column']])) ? 'id' : $orderArr[$data['order']['0']['column']];
 //需要空格,防止字符串連接在一塊
 $order = $orderField.' '.$data['order']['0']['dir'];
 //按條件過濾找出記錄
 $result = [];
 //備注:$data['start']起始條數(shù) $data['length']查詢長度
 $result = $this->field('id,fromnickname,content,msgtype,time')
     ->where($where)
     ->order($order)
     ->limit(intval($data['start']), intval($data['length']))
     ->select();
 //處理數(shù)據(jù)
 if(!empty($result)) {
  foreach ($result as $key => $value) {
   $result[$key]['time'] = date("Y-m-d H:i:s",$value['time']);
   $result[$key]['recordsFiltered'] = $recordsFiltered;
  }
 }
 //拼接要返回的數(shù)據(jù)
 $list = array(
  "draw" => intval($draw),
  "recordsTotal" => intval($recordsTotal),
  "recordsFiltered"=>intval($recordsFiltered),
  "data" => $result,
 );
 return $list;
}
【網(wǎng)站聲明】本站除付費(fèi)源碼經(jīng)過測試外,其他素材未做測試,不保證完整性,網(wǎng)站上部分源碼僅限學(xué)習(xí)交流,請(qǐng)勿用于商業(yè)用途。如損害你的權(quán)益請(qǐng)聯(lián)系客服QQ:2655101040 給予處理,謝謝支持。

相關(guān)文檔推薦

下面小編就為大家分享一篇thinkphp3.2.0 setInc方法 源碼全面解析,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
這篇文章主要介紹了tp5(thinkPHP5)操作mongoDB數(shù)據(jù)庫的方法,結(jié)合實(shí)例形式簡單分析了mongoDB數(shù)據(jù)庫及thinkPHP5連接、查詢MongoDB數(shù)據(jù)庫的基本操作技巧,需要的朋友可以參考下
thinkphp官網(wǎng)在去年的時(shí)候發(fā)布了tp的顛覆版本thinkphp5,tp5確實(shí)比之前的版本好用了很多,那么下面這篇文章就來給大家介紹關(guān)于在云虛擬主機(jī)部署thinkphp5項(xiàng)目的相關(guān)資料,需要的朋友可以
這篇文章主要介紹了Thinkphp5行為使用方法匯總,需要的朋友可以參考下
這篇文章主要介紹了thinkphp5 加載靜態(tài)資源路徑與常量的方法的相關(guān)資料,需要的朋友可以參考下
這篇文章主要介紹了thinkphp5 URL和路由的功能詳解與實(shí)例,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧
主站蜘蛛池模板: sus630/303cu不锈钢棒,440C/430F/17-4ph不锈钢研磨棒-江苏德镍金属科技有限公司 | 泉州陶瓷pc砖_园林景观砖厂家_石英砖地铺石价格 _福建暴风石英砖 | 圆盘鞋底注塑机_连帮鞋底成型注塑机-温州天钢机械有限公司 | 同学聚会纪念册制作_毕业相册制作-成都顺时针宣传画册设计公司 | 安规_综合测试仪,电器安全性能综合测试仪,低压母线槽安规综合测试仪-青岛合众电子有限公司 | 缝纫客 | 洛阳永磁工业大吊扇研发生产-工厂通风降温解决方案提供商-中实洛阳环境科技有限公司 | 密集柜_档案密集柜_智能密集架_密集柜厂家_密集架价格-智英伟业 密集架-密集柜厂家-智能档案密集架-自动选层柜订做-河北风顺金属制品有限公司 | 气动调节阀,电动调节阀,自力式压力调节阀,切断阀「厂家」-浙江利沃夫自控阀门 | 六维力传感器_三维力传感器_二维力传感器-南京神源生智能科技有限公司 | 定做大型恒温循环水浴槽-工业用不锈钢恒温水箱-大容量低温恒温水槽-常州精达仪器 | 通信天线厂家_室分八木天线_对数周期天线_天线加工厂_林创天线源头厂家 | 海尔生物医疗四川代理商,海尔低温冰箱四川销售-成都壹科医疗器械有限公司 | 全自动端子机|刺破式端子压接机|全自动双头沾锡机|全自动插胶壳端子机-东莞市傅氏兄弟机械设备有限公司 | 仿古建筑设计-仿古建筑施工-仿古建筑公司-汉匠古建筑设计院 | 砂磨机_立式纳米砂磨机_实验室砂磨机-广州儒佳化工设备厂家 | 运动木地板_体育木地板_篮球馆木地板_舞台木地板-实木运动地板厂家 | 无纺布包装机|径向缠绕包装机|缠绕膜打包机-上海晏陵智能设备有限公司 | 数码管_LED贴片灯_LED数码管厂家-无锡市冠卓电子科技有限公司 | 粒米特测控技术(上海)有限公司-测功机_减速机测试台_电机测试台 | 浙江自考_浙江自学考试网| 拉曼光谱仪_便携式|激光|显微共焦拉曼光谱仪-北京卓立汉光仪器有限公司 | 皮带机_移动皮带机_大倾角皮带机_皮带机厂家 - 新乡市国盛机械设备有限公司 | 不锈钢列管式冷凝器,换热器厂家-无锡飞尔诺环境工程有限公司 | 净化板-洁净板-净化板价格-净化板生产厂家-山东鸿星新材料科技股份有限公司 | 理化生实验室设备,吊装实验室设备,顶装实验室设备,实验室成套设备厂家,校园功能室设备,智慧书法教室方案 - 东莞市惠森教学设备有限公司 | 球盟会·(中国)官方网站| 深圳市索富通实业有限公司-可燃气体报警器 | 可燃气体探测器 | 气体检测仪 | 中空玻璃生产线,玻璃加工设备,全自动封胶线,铝条折弯机,双组份打胶机,丁基胶/卧式/立式全自动涂布机,玻璃设备-山东昌盛数控设备有限公司 | 浙江筋膜枪-按摩仪厂家-制造商-肩颈按摩仪哪家好-温州市合喜电子科技有限公司 | 大白菜官网,大白菜winpe,大白菜U盘装系统, u盘启动盘制作工具 | 远程会诊系统-手术示教系统【林之硕】医院远程医疗平台 | 蒸汽热收缩机_蒸汽发生器_塑封机_包膜机_封切收缩机_热收缩包装机_真空机_全自动打包机_捆扎机_封箱机-东莞市中堡智能科技有限公司 | 济南网站策划设计_自适应网站制作_H5企业网站搭建_济南外贸网站制作公司_锐尚 | 深圳VI设计-画册设计-LOGO设计-包装设计-品牌策划公司-[智睿画册设计公司] | 聚合氯化铝厂家-聚合氯化铝铁价格-河南洁康环保科技 | 红外光谱仪维修_二手红外光谱仪_红外压片机_红外附件-天津博精仪器 | 模具ERP_模具管理系统_模具mes_模具进度管理_东莞市精纬软件有限公司 | 山东聚盛新型材料有限公司-纳米防腐隔热彩铝板和纳米防腐隔热板以及钛锡板、PVDF氟膜板供应商 | 物联网卡_物联网卡购买平台_移动物联网卡办理_移动联通电信流量卡通信模组采购平台? | 淬火设备-钎焊机-熔炼炉-中频炉-锻造炉-感应加热电源-退火机-热处理设备-优造节能 |