简单分页

来源：互联网发布：wto国际贸易统计数据库编辑：程序博客网时间：2024/05/16 01:52

1.引入js

<script src="/resource/js/plugins/pagination/jquery.pagination.js"></script>

html中

<!-- 数据表格 --> <div class="data-list">       <table cellpadding="0" id="grid" cellspacing="0" border="0" width="100%">          <thead>             <tr>            <th width="3%" render="list.renderLogo" class="tal txt-l">logo</th>                            <th width="10%" render="list.renderStdName"（方法，用于获取该列的数据） class="txt-l">一列</th>             <th width="10%" render="list.renderAddr" class="txt-l">一列</th>               <th width="5%" render="list.renderperson" class="txt-l">一列</th>         <th width="15%" render="list.renderbusiness" class="txt-l">一列</th>       <th width="5%" render="list.renderProductNum">一列</th>                                                                     </tr>                    </thead>                    <tbody>                    </tbody>                </table>                 <c:set var="moduleType" value="has_left"></c:set>                <c:set var="desc" value=""></c:set>                <%@include file="/.jsp"%>            </div>            <!-- 分页 -->            <div class="page-box" id="pageTarget"></div>            <!-- 分页 end-->

自己要写的js

var list={        grid:null,        //加载分页        initPage:function(){            var params = {};            grid = $("#grid").pagination({                type : "POST", // 请求类型，默认POST                url :  "/get_list", // ajax请求列表数据url                showSerNum : false, // 是否显示序号                usePager : true, // 使用分页                params : params,//参数                notDataHTML:$("#not_page").html(),//没有数据时显示的html                page : {                    pageTarget : "#pageTarget", // 分页显示位置                    curPage : 1, // 当前页                    pageSize : 10 // 每页显示条数                },                callback : function(data) {                    //alert(1);                }            });        },        //logo        renderLogo:function(tr, index, record, field){            var logo=record["imgurl"];//数据放在record中            var code=record["code"];            if(!logo){                logo="/resource/images/product.jpg"            }            var html = '';//组装列中的html            return html;        },        //名称        renderStdName:function(tr, index, record, field){            var Name = record['Name'];            var code=record["code"];            return '';//返回列中的html        },        //地址        renderAddr:function(tr, index, record, field){            var addr=record["addr"];            return addr;        },        //人             renderperson:function(tr, index, record, field){            var person=record["person"];            return person;        },        //业务        renderbusiness:function(tr, index, record, field){            var business=record["business"];            return business;        },        //产品数        renderProductNum:function(tr, index, record, field){            var html='';            var count=record["PriceNum"];            html='<a href="javascript:void(0);">'+count+'</a>';            return html;        },        //搜索列表        selectList : function(params,currPage,pageSize) {// 筛选搜索            if (!params){                params = {};//用来封装参数，带到后台            }            //params=list.pakeParams(params);//封装参数的方法            if(!currPage){                currPage=1;            }            if(!pageSize){                pageSize=10;            }            grid.setCurrPage(currPage);            grid.setPageSize(pageSize);            grid.reload(params);        },}

阅读全文

0 0