easyUI前台分页的实现

来源：互联网发布：什字镇,梁家咀村淘宝店编辑：程序博客网时间：2024/05/22 10:38

<script type="text/javascript">function pagerFilter(data){    if (typeof data.length == 'number' && typeof data.splice == 'function'){    // 判断数据是否是数组        data = {            total: data.length,            rows: data        }    }    var dg = $(this);    var opts = dg.datagrid('options');    var pager = dg.datagrid('getPager');    pager.pagination({        onSelectPage:function(pageNum, pageSize){            opts.pageNumber = pageNum;            opts.pageSize = pageSize;            pager.pagination('refresh',{            pageNumber:pageNum,                pageSize:pageSize            });            dg.datagrid('loadData',data);        }    });    if (!data.originalRows){        data.originalRows = (data.rows);    }    var start = (opts.pageNumber-1)*parseInt(opts.pageSize);    var end = start + parseInt(opts.pageSize);    data.rows = (data.originalRows.slice(start, end));    return data;}$(function(){//加载数据var rows = [];        $.ajax({            type: "post",            dataType: "json",            url: '../adverOrder/findAll',            async:false,            success: function (data) {                for(var i in data.rows){                    var id = data.rows[i].id;                    var orderNumber = data.rows[i].orderNumber;                    var advertistingName = data.rows[i].advertistingName;                    var submitter = data.rows[i].submitter;                    var communityName = data.rows[i].communityName;                    var pattern = data.rows[i].pattern;                    var startTime = data.rows[i].startTime;                    var endTime = data.rows[i].endTime;                    var isMaster = data.rows[i].isMaster;                    var currentState = data.rows[i].currentState;                    rows.push({                        id: id,                        orderNumber: orderNumber,                        advertistingName: advertistingName,                        submitter:submitter,                        communityName:communityName,                        pattern:pattern,                        startTime:startTime,                        endTime:endTime,                        isMaster:isMaster,                        currentState:currentState                    });                }            }        });    // console.log(rows);    $('#dg').datagrid({loadFilter:pagerFilter}).datagrid('loadData', rows);});</script>

 <table id="dg" title="所有订单列表" class="easyui-datagrid" loadMsg='正在加载...'    fitColumns="true" pagination="true" rownumbers="true"    fit="true" autoRowHeight="false" rownumbers="true" toolbar="#tb,#tb1">   <thead>   <!-- 'ID','订单号','订单名称','提交人','投放小区','播放模式','开始时间','结束时间','是否管理员提交','审核状态' -->   <tr>   <th field="id" align="center" width="50">订单ID</th>    <th field="orderNumber" width="100" align="center">广告订单号</th>     <th field="advertistingName" width="100" align="center">广告名称</th>     <th field="submitter" width="100" align="center" >提交人</th>     <th field="communityName" width="150" align="center">投放小区</th>     <th field="pattern" width="100" align="center" data-options="field:'show',width:100" formatter="formatShow">播放模式</th>     <th field="startTime" width="150" align="center">开始时间</th>     <th field="endTime" width="150" align="center">结束时间</th>     <th field="isMaster" width="150" align="center" data-options="field:'show',width:100" formatter="formatIsMaster">是否管理员提交</th>     <th field="currentState" width="100" align="center" data-options="field:'show',width:100" formatter="formatResult">审核状态</th>    </tr>   </thead> </table>

阅读全文

0 0