jeesite異步分頁

1.分頁攔截器

com.princeframework.jlightspeed.common.persistence.interceptor.PaginationInterceptor

攔截條件1）所有查詢，2）page != null && page.getPageSize() != -1

2.分頁攔截器思路

1）設置了page的總記錄數，2）重新修改了執行的sql，添加了limit條件

3.控制器寫法

查詢參數對象：public class TrackMapBean extends DataEntity<TrackMapBean>{}

以下是部分代碼

TrackMapBean searchBean=..;

//下面的這個searchBean為了被分頁攔截器攔截

List<TrackMapBean> trackList=departmentOutDao.findDwellerTrack(searchBean)

page.setList(trackList);       
        resultMap.put("dataList", trackList);//數據list
        resultMap.put("pageStr", page.toString());//分頁控件

return resultMap;//返回的對象

3.前端代碼

//點擊查詢執行的方法
function searchMapData(){
        var data=parseForm("#searchForm");
        if(data.num !=null&&data.num !=''){
             $.get("${ctx}/basedweller/manage/baiduTrackPage",data,function(data){
                gendarList(data.dataList,data.pageStr);
            }); 
        }else{
            alert("請輸入車牌號或者身份證號");
        }
        //test();
          
        
    }
//生成表格title
function gendarTitle(){
        $("#title").empty();
        var title="";
        
        title+="<th>信息</th>"+
        "<th>編號</th>"+
        "<th>通過時間</th>"+
        "<th>經度</th>"+
        "<th>緯度</th>";
        $("#title").append(title);
    }
//生成表格
    function gendarList(dataList,pageStr){
        $("#pagination").empty();
        $("#dataList").empty();
        var headStr="";
        for(var k=0;k<headStr.length;k++){
            headStr+="<th>"+headStr[k]+"</th>"
        }
        $("#headAdd").append(headStr);
        
        var dataListStr="";
        for(var s=0;s<dataList.length;s++){
            var task=dataList[s]
            dataListStr+="<tr><td>"+
            task.objInfo+
            "</td>"+
            "<td>"+
            task.positionInfo+
            "</td>"+
            "<td>"+
            task.passTime+
            "</td>"+
            "<td style='color:red'>"+
            task.lng+
            "</td>"+
            "<td>"+
            task.lat+
            "</td>"+
        "</tr>";
        }
        $("#dataList").append(dataListStr);
        $("#pagination").append(pageStr);
    }
//點擊分頁控件
    function page(n,s){
        $("#pageNo").val(n);
        $("#pageSize").val(s);
        searchMapData();
        return false;
    }

4.html代碼

<form id="searchForm" class="breadcrumb form-search">
        <input id="pageNo" name="pageNo" type="hidden" value="1"/>
        <input id="pageSize" name="pageSize" type="hidden" value="3"/>
    <ul class="ul-form">
        <li><label>類型：</label>
            <select name="type" id="type" >
                <option value="ry">身份證</option>
                <option value="car">車輛</option>
            </select>
        </li>
        <li><label id='typeName'>身份證：</label>
            <input name="num" id="mobile" class="form-control" type="text" placeholder="輸入關鍵字"/>
        </li>
        <li><label>時間：</label>
                <input name="startTime" type="text" readonly="readonly" maxlength="20" class="input-medium Wdate"
                    value="<fmt:formatDate value="${baseDweller.beginCreateDate}" pattern="yyyy-MM-dd HH:mm:ss"/>"
                    onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:false});"/> - 
                <input name="endTime" type="text" readonly="readonly" maxlength="20" class="input-medium Wdate"
                    value="<fmt:formatDate value="${baseDweller.endCreateDate}" pattern="yyyy-MM-dd HH:mm:ss"/>"
                    onclick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',isShowClear:false});"/>
            </li>
        
    </ul>
    <ul class="ul-form">
      <li class="btns"><input class="btn btn-primary" type="button" value="查詢" onclick="searchMapData();"/></li>
        <li class="btns" onclick="clearForm();"><input id="btnClear" class="btn btn-primary" type="button" value="清除"/></li>
    </ul>
</form>


<table id="contentTable" style="margin-top:38px;" class="table table-striped table-bordered table-condensed">
        <thead>
            <tr id="title">
                
            </tr>
        </thead>
        <tbody id="dataList">
        
        </tbody>
    </table>
    <div class="pagination" id="pagination"></div>