zoukankan      html  css  js  c++  java
  • ajax 分页(jquery分页插件pagination) 小例3

    <#macro ajaxPaginte url >
    <script type="text/javascript">  
            var PageSize = 10;//每页行数  
            var IsInit = true;//初始化  
          
            var  search= function(pageIndex,initFlag) {  
                var url = "${url}";  
                $.ajax({  
                    type: 'GET',  
                    url: url,  
                    data: { pageNumber:pageIndex,pageSize: PageSize,skuId:$("#skuId").val(),skuModel:$("#skuModel").val() },  
                    success: function (data) {  
                        if (initFlag) {  
                            initPagination(data.total);  
                            IsInit = false;  
                        }  
                        <#nested>
                    },  
                    error: function (msg) {  
                        console.log(msg.responseText);  
                    }  
                });  
            }  
           
            var initPagination = function (Count) {  
                // 创建分页  
                $("#Pagination").pagination(Count, {  
                    first_text:'首页',
                    last_text:'尾页',
                    num_display_entries:10,
                    callback: pageselectCallback,  
                    items_per_page: PageSize //每页显示行数  
                });  
            }  
            function pageselectCallback(page_index, jq) {  
                if (!IsInit)  
                    search(page_index + 1);  
                return false;  
            }  
            $(function () {  
                search(1, true);//1代表第一页  
            });  
        </script> 
    </#macro>
    <div class="panel panel-default">
    	<div class="panel-body">
    		<#include "/common/ajaxPaginte.html">
    		<table class="table table-bordered" id="user-list-table">
    			<thead>
    		 		<tr>
    					<th class="col-mo-2">名字</th>
    					<th class="col-mo-2">性别</th>
    					<th class="col-mo-2">电话</th>
    					 
    				 	<th class="col-mo-1">操作</th>
    				</tr>
    			</thead>
    			<tbody>
    			</tbody>
    		</table>
    		<div id="Pagination" class="pagination">
    		</div>
    	</div>
    </div>
    <@ajaxPaginte "/system/user/listUserByAjax/" >
                    	var table_body="";
                		$.each(data.records,function(index,value){
                		    var sex=value.sex==1?"男":"女";
                			table_body+="<tr><td>"+value.realName+"</td><td>"+sex+"</td><td>"+value.tel+"</td><td><a class='btn btn-primary btn-xs' href='javascript:;' onclick='select_row({name:""+value.realName+"",id:""+value.id+""})'> <i class='fa fa-pencil-square-o'></i>选取</a></td></tr>";
                		});
                		$("#user-list-table>tbody").empty().append(table_body);
                    </@ajaxPaginte>	
    

      

  • 相关阅读:
    《入门经典》——8.4
    《A First Course in Probability》-chaper7-期望的性质-期望的性质-协方差
    计算几何讲义——计算几何中的欧拉定理
    Gym
    hdu6053
    ACdream1032(树形DP)
    hdu6040
    hdu6035(树形DP)
    hdu6038
    Codeforces #425 Div2 D
  • 原文地址:https://www.cnblogs.com/jwlfpzj/p/8252696.html
Copyright © 2011-2022 走看看