Skip to content

杨建斌 / page

Go to a project
Toggle navigation
Toggle navigation pinning
72cdd41f by Zelig
Options

datatables

1 parent 3cf405cf
Inline Side-by-side
Showing 3 changed files with 59 additions and 29 deletions
application/views/common/footer.php
...@@ -7,5 +7,7 @@ ...@@ -7,5 +7,7 @@
7 <script type="text/javascript" src="/resource/lib/jquery.validation/1.14.0/messages_zh.js"></script> 7 <script type="text/javascript" src="/resource/lib/jquery.validation/1.14.0/messages_zh.js"></script>
8 <script type="text/javascript" src="/resource/lib/My97DatePicker/4.8/WdatePicker.js"></script> 8 <script type="text/javascript" src="/resource/lib/My97DatePicker/4.8/WdatePicker.js"></script>
9 <script type="text/javascript" src="/resource/lib/webuploader/0.1.5/webuploader.min.js"></script> 9 <script type="text/javascript" src="/resource/lib/webuploader/0.1.5/webuploader.min.js"></script>
10 <script type="text/javascript" src="/resource/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
11 <script type="text/javascript" src="/resource/datatable.js"></script>
10 <script src="https://cdn.bootcss.com/holder/2.9.4/holder.min.js"></script> 12 <script src="https://cdn.bootcss.com/holder/2.9.4/holder.min.js"></script>
11 <script type="text/javascript" src="/resource/upload.js"></script> 13 <script type="text/javascript" src="/resource/upload.js"></script>
......
application/views/work/index.php
...@@ -3,15 +3,15 @@ ...@@ -3,15 +3,15 @@
3 <body> 3 <body>
4 <?php $this->load->view('common/work_header'); ?> 4 <?php $this->load->view('common/work_header'); ?>
5 <div class="page-container"> 5 <div class="page-container">
6 <form class="search"> 6 <form class="" onreset="resetHandler()">
7 <div class="date mb-20"> 7 <div class="date mb-20">
8 <input type="text" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'logmax\')||\'%y-%M-%d\'}' })" id="logmin" class="input-text Wdate"> - 8 <input type="text" onfocus="WdatePicker({ maxDate:'#F{$dp.$D(\'max\')||\'%y-%M-%d\'}',onpicked:function(){$('#table').DataTable().draw()} })" id="min" class="input-text Wdate"> -
9 <input type="text" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'logmin\')}',maxDate:'%y-%M-%d' })" id="logmax" class="input-text Wdate"> 9 <input type="text" onfocus="WdatePicker({ minDate:'#F{$dp.$D(\'min\')}',maxDate:'%y-%M-%d',onpicked:function(){$('#table').DataTable().draw()} })" id="max" class="input-text Wdate">
10 </div> 10 </div>
11 <div class="row cl mb-20"> 11 <div class="row cl mb-20">
12 <div class="col-xs-2"> 12 <div class="col-xs-2">
13 <span class="select-box"> 13 <span class="select-box">
14 <select class="select" size="1"> 14 <select class="select table_search" size="1" column="6">
15 <option value="" selected>网点</option> 15 <option value="" selected>网点</option>
16 <option value="1">菜单一</option> 16 <option value="1">菜单一</option>
17 <option value="2">菜单二</option> 17 <option value="2">菜单二</option>
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
21 </div> 21 </div>
22 <div class="col-xs-2"> 22 <div class="col-xs-2">
23 <span class="select-box"> 23 <span class="select-box">
24 <select class="select" size="1"> 24 <select class="select table_search" size="1" column="7">
25 <option value="" selected>产品名称</option> 25 <option value="" selected>产品名称</option>
26 <option value="1">菜单一</option> 26 <option value="1">菜单一</option>
27 <option value="2">菜单二</option> 27 <option value="2">菜单二</option>
...@@ -31,27 +31,27 @@ ...@@ -31,27 +31,27 @@
31 </div> 31 </div>
32 <div class="col-xs-2"> 32 <div class="col-xs-2">
33 <span class="select-box"> 33 <span class="select-box">
34 <select class="select" size="1"> 34 <select class="select table_search" size="1" column="10">
35 <option value="" selected>客户经理</option> 35 <option value="" selected>客户经理</option>
36 <option value="1">菜单一</option> 36 <option>李四</option>
37 <option value="2">菜单二</option> 37 <option>菜单二</option>
38 <option value="3">菜单三</option> 38 <option>菜单三</option>
39 </select> 39 </select>
40 </span> 40 </span>
41 </div> 41 </div>
42 <div class="col-xs-2"> 42 <div class="col-xs-2">
43 <span class="select-box"> 43 <span class="select-box">
44 <select class="select" size="1"> 44 <select class="select table_search" size="1" column="11">
45 <option value="" selected>流程节点</option> 45 <option value="" selected>流程节点</option>
46 <option value="1">菜单一</option> 46 <option>完成</option>
47 <option value="2">菜单二</option> 47 <option>菜单二</option>
48 <option value="3">菜单三</option> 48 <option>菜单三</option>
49 </select> 49 </select>
50 </span> 50 </span>
51 </div> 51 </div>
52 <div class="col-xs-2"> 52 <div class="col-xs-2">
53 <span class="select-box"> 53 <span class="select-box">
54 <select class="select" size="1"> 54 <select class="select table_search" size="1" column="13">
55 <option value="" selected>处理人</option> 55 <option value="" selected>处理人</option>
56 <option value="1">菜单一</option> 56 <option value="1">菜单一</option>
57 <option value="2">菜单二</option> 57 <option value="2">菜单二</option>
...@@ -61,13 +61,12 @@ ...@@ -61,13 +61,12 @@
61 </div> 61 </div>
62 </div> 62 </div>
63 <div> 63 <div>
64 <input class="btn btn-primary radius" type="submit" value="提交">
65 <input class="btn btn-warning radius" type="reset" value="重置"> 64 <input class="btn btn-warning radius" type="reset" value="重置">
66 </div> 65 </div>
67 </form> 66 </form>
68 67
69 <div class="body mt-20"> 68 <div class="body mt-20">
70 <table class="table table-border table-bordered table-bg"> 69 <table class="table table-border table-bordered table-bg" id="table">
71 <thead class="text-c"> 70 <thead class="text-c">
72 <tr> 71 <tr>
73 <th width="68px">操作</th> 72 <th width="68px">操作</th>
...@@ -107,7 +106,7 @@ ...@@ -107,7 +106,7 @@
107 <td>融易购</td> 106 <td>融易购</td>
108 <td>100.00</td> 107 <td>100.00</td>
109 <td>100.00</td> 108 <td>100.00</td>
110 <td>李四</td> 109 <td>李三</td>
111 <td class="c-primary">预审</td> 110 <td class="c-primary">预审</td>
112 <td>2018-01-02 00:00:00</td> 111 <td>2018-01-02 00:00:00</td>
113 <td>小明</td> 112 <td>小明</td>
...@@ -123,7 +122,7 @@ ...@@ -123,7 +122,7 @@
123 </ul> 122 </ul>
124 </span> 123 </span>
125 </td> 124 </td>
126 <td>1001</td> 125 <td>1002</td>
127 <td>张三</td> 126 <td>张三</td>
128 <td>333333333333333333</td> 127 <td>333333333333333333</td>
129 <td>13333333333</td> 128 <td>13333333333</td>
...@@ -134,21 +133,11 @@ ...@@ -134,21 +133,11 @@
134 <td>100.00</td> 133 <td>100.00</td>
135 <td>李四</td> 134 <td>李四</td>
136 <td class="c-999">完成</td> 135 <td class="c-999">完成</td>
137 <td>2018-01-02 00:00:00</td> 136 <td>2018-01-02</td>
138 <td>小明</td> 137 <td>小明</td>
139 </tr> 138 </tr>
140 </tbody> 139 </tbody>
141 </table> 140 </table>
142 <div class="paginate">
143 <div class="paginate_info">显示 1 到 1 ，共 1 条</div>
144 <div class="paginate_pagination">
145 <a class="paginate_button">上一页</a>
146 <span>
147 <a class="paginate_button current">1</a>
148 </span>
149 <a class="paginate_button">下一页</a>
150 </div>
151 </div>
152 </div> 141 </div>
153 </div> 142 </div>
154 <?php $this->load->view('common/footer'); ?> 143 <?php $this->load->view('common/footer'); ?>
......
resource/datatable.js 0 → 100644
1 $('#table').dataTable({
2 "aaSorting": [[ 1, "desc" ]],
3 "pading":false
4 });
5
6 $.fn.dataTableExt.afnFiltering.push(
7 function( oSettings, aData, iDataIndex ) {
8 var min = document.getElementById('min').value;
9 var max = document.getElementById('max').value;
10 var iDateCol = 12;
11
12 var dateMin = new Date(aData[iDateCol]);
13 var dateMax = new Date(aData[iDateCol]);
14
15 if (min === '' && max === '')
16 return true;
17 else if (new Date(min).getTime() <= dateMin.getTime() && max === '')
18 return true;
19 else if (new Date(min).getTime() <= dateMin.getTime() && new Date(max).getTime() >= dateMax.getTime())
20 return true;
21 return false;
22 }
23 );
24
25 $('.table_search').on('change', function () {
26 search = $(this).val();
27 column = $(this).attr('column');
28
29 $('#table').DataTable().column(column).search(search).draw();
30 });
31
32 $('#min, #max').on('keyup', function () {
33 $('#table').DataTable().draw();
34 });
35
36 function resetHandler ()
37 {
38 $('#table').DataTable().columns().search("").draw();
39 }
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!