4b2fcc3b by Zelig

datatable ajax 分页处理

1 parent 2c615417
......@@ -200,4 +200,28 @@ class Work extends CI_Controller {
{
$this->load->view('work/线下已放款');
}
public function data()
{
$data['draw'] = 1;
$data['recordsTotal'] = 57;
$data['recordsFiltered'] = 57;
$data['data'] = [
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
['id' => 1001, 'name' => '张三'],
];
$this->output->set_content_type('application/json')->set_output(json_encode($data));
}
}
......
......@@ -8,7 +8,6 @@
<script type="text/javascript" src="/resource/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="/resource/lib/webuploader/0.1.5/webuploader.min.js"></script>
<script type="text/javascript" src="/resource/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/resource/datatable.js"></script>
<script src="https://cdn.bootcss.com/holder/2.9.4/holder.min.js"></script>
<script type="text/javascript" src="/resource/upload.js"></script>
<script>
......
<aside class="Hui-aside">
<div class="menu_dropdown bk_2">
<ul>
<li><a data-href="<?=site_url('/user/index')?>" data-title="用户管理" href="javascript:void(0)"><i class="Hui-iconfont">&#xe600;</i>&nbsp;用户管理</a></li>
<li><a data-href="<?=site_url('/user/index')?>" data-title="用户管理" href="javascript:void(0)"><i class="Hui-iconfont">&#xe638;</i>&nbsp;用户管理</a></li>
</ul>
</div>
</aside>
......
<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class User extends CI_Controller {
/**
* 控制台默认页面
*/
public function index()
{
$this->load->view('user/index');
}
public function info($state = null)
{
switch ($state) {
case '1':
$this->load->view('user/资料清单');
break;
case '2':
$this->load->view('user/基本信息');
break;
case '3':
$this->load->view('user/人脉圈');
break;
case '4':
$this->load->view('user/风险识别');
break;
case '5':
$this->load->view('user/交易记录');
break;
default:
$this->load->view('user/资料清单');
break;
}
}
}
......@@ -70,76 +70,73 @@
<thead class="text-c">
<tr>
<th width="68px">操作</th>
<th>订单编号</th>
<th>申请人</th>
<th>身份证</th>
<th>手机号</th>
<th>进件时间</th>
<th>网点</th>
<th>产品名称</th>
<th>申请金额</th>
<th>审批金额</th>
<th>客户经理</th>
<th>流程节点</th>
<th>流转时间</th>
<th>处理人</th>
</tr>
</thead>
<tbody class="text-c">
<tr>
<td>
<span class="dropDown dropDown_hover">
<button class="btn radius size-M">请选择 <i class="Hui-iconfont">&#xe6d5;</i></button>
<ul class="dropDown-menu menu radius box-shadow">
<li><a href="javascript:;" onclick="layer_show('订单详情', '/work/detail/1?tab=0')">查看详细</a></li>
<li><a href="javascript:;" onclick="layer_show('订单详情', '/work/detail/1?tab=2')">处理记录</a></li>
<li><a href="#">客户取消</a></li>
</ul>
</span>
</td>
<td>1001</td>
<td>张三</td>
<td>333333333333333333</td>
<td>13333333333</td>
<td>2018-01-01 00:00:00</td>
<td>下沙网点</td>
<td>融易购</td>
<td>100.00</td>
<td>100.00</td>
<td>李三</td>
<td class="c-primary">预审</td>
<td>2018-01-02 00:00:00</td>
<td>小明</td>
</tr>
<tr>
<td>
<span class="dropDown dropDown_hover">
<button class="btn radius size-M">请选择 <i class="Hui-iconfont">&#xe6d5;</i></button>
<ul class="dropDown-menu menu radius box-shadow">
<li><a href="javascript:;" onclick="layer_show('订单详情', '/work/detail/1?tab=0')">查看详细</a></li>
<li><a href="javascript:;" onclick="layer_show('订单详情', '/work/detail/1?tab=2')">处理记录</a></li>
<li><a href="#">客户取消</a></li>
</ul>
</span>
</td>
<td>1002</td>
<td>张三</td>
<td>333333333333333333</td>
<td>13333333333</td>
<td>2018-01-01 00:00:00</td>
<td>下沙网点</td>
<td>融易购</td>
<td>100.00</td>
<td>100.00</td>
<td>李四</td>
<td class="c-999">完成</td>
<td>2018-01-02</td>
<td>小明</td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
</div>
</div>
<?php $this->load->view('common/footer'); ?>
<script>
$('#table').dataTable({
aaSorting: [[ 1, "desc" ]],
serverSide: true,
processing: true,
ajax: '<?=site_url("work/data")?>',
columns: [
{data: "id", render: function (data, type, full) {
return '<span class="dropDown dropDown_hover">\
<button class="btn radius size-M">请选择 <i class="Hui-iconfont">&#xe6d5;</i></button>\
<ul class="dropDown-menu menu radius box-shadow"><li><a href="javascript:;" onclick="layer_show(\'订单详情\', \'/work/detail/'+ data +'?tab=0\')">查看详细</a></li>\
<li><a href="javascript:;" onclick="layer_show(\'订单详情\', \'/work/detail/'+ data +'?tab=2\')">处理记录</a></li>\
<li><a href="#">客户取消</a></li>\
</ul></span>';
}},
{data: "name"}
]
});
$.fn.dataTableExt.afnFiltering.push(
function( oSettings, aData, iDataIndex ) {
var min = document.getElementById('min').value;
var max = document.getElementById('max').value;
var iDateCol = 12;
var dateMin = new Date(aData[iDateCol]);
var dateMax = new Date(aData[iDateCol]);
if (min === '' && max === '')
return true;
else if (new Date(min).getTime() <= dateMin.getTime() && max === '')
return true;
else if (new Date(min).getTime() <= dateMin.getTime() && new Date(max).getTime() >= dateMax.getTime())
return true;
return false;
}
);
$('.table_search').on('change', function () {
search = $(this).val();
column = $(this).attr('column');
$('#table').DataTable().column(column).search(search).draw();
});
$('#min, #max').on('keyup', function () {
$('#table').DataTable().draw();
});
function resetHandler ()
{
$('#table').DataTable().columns().search("").draw();
}
</script>
</body>
<html>
......
$('#table').dataTable({
"aaSorting": [[ 1, "desc" ]],
"pading":false
});
$.fn.dataTableExt.afnFiltering.push(
function( oSettings, aData, iDataIndex ) {
var min = document.getElementById('min').value;
var max = document.getElementById('max').value;
var iDateCol = 12;
var dateMin = new Date(aData[iDateCol]);
var dateMax = new Date(aData[iDateCol]);
if (min === '' && max === '')
return true;
else if (new Date(min).getTime() <= dateMin.getTime() && max === '')
return true;
else if (new Date(min).getTime() <= dateMin.getTime() && new Date(max).getTime() >= dateMax.getTime())
return true;
return false;
}
);
$('.table_search').on('change', function () {
search = $(this).val();
column = $(this).attr('column');
$('#table').DataTable().column(column).search(search).draw();
});
$('#min, #max').on('keyup', function () {
$('#table').DataTable().draw();
});
function resetHandler ()
{
$('#table').DataTable().columns().search("").draw();
}
......@@ -241,7 +241,8 @@ function layer_show(title,url,w,h){
function layer_load(title, url) {
var index = parent.layer.getFrameIndex(window.name);
parent.layer.title(title, index);
if(title != '')
parent.layer.title(title, index);
parent.layer.iframeSrc(index, url);
}
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!