<#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>

  

ajax 分页(jquery分页插件pagination) 小例3的更多相关文章

  1. ajax+php (jquery.form插件)实现异步文件上传

    <!DOCTYPE html> <html lang="CN"> <head> <title>upload model</ti ...

  2. jquery 分页控件2

    jquery 分页控件(二) 上一章主要是关于分页控件的原理,代码也没有重构.在这一章会附上小插件的下载链接,插件主要就是重构逻辑部分,具体可以下载源文件看下,源代码也有注释.为了测试这个插件是能用的 ...

  3. jquery 分页控件(二)

    上一章主要是关于分页控件的原理,代码也没有重构.在这一章会附上小插件的下载链接,插件主要就是重构逻辑部分,具体可以下载源文件看下,源代码也有注释.为了测试这个插件是能用的,我弄了个简单的asp.net ...

  4. 25款顶级的jQuery表格插件

    jQuery 表格插件可以让你创建各种各样的表格布局,表格布局是报纸和杂志中最常见的布局,现在的网站中也很常见,在这篇文章中,我向大家推荐25个jQuery 的表格插件,你可以任意控制表格的行和列,用 ...

  5. jQuery 表格插件25

    jQuery 表格插件可以让你创建各种各样的表格布局,表格布局是报纸和杂志中最常见的布局,现在的网站中也很常见,在这篇文章中,我向大家推荐25个jQuery 的表格插件,你可以任意控制表格的行和列,用 ...

  6. 25个顶级的jQuery表格插件

    jQuery 表格插件可以让你创建各种各样的表格布局,表格布局是报纸和杂志中最常见的布局,现在的网站中也很常见,在这篇文章中,我向大家推荐25个jQuery 的表格插件,你可以任意控制表格的行和列,用 ...

  7. Jquery前端分页插件pagination同步加载和异步加载

    上一篇文章介绍了Jquery前端分页插件pagination的基本使用方法和使用案例,大致原理就是一次性加载所有的数据再分页.https://www.jianshu.com/p/a1b8b1db025 ...

  8. Jquery前端分页插件pagination使用

    插件描述:JqueryPagination是一个轻量级的jquery分页插件.只需几个简单的配置就可以生成分页控件.并且支持ajax获取数据,自定义请求参数,提供多种方法,事件和回调函数,功能全面的分 ...

  9. [jQuery]jQuery DataTables插件自定义Ajax分页实现

    前言 昨天在博客园的博问上帮一位园友解决了一个问题,我觉得有必要记录一下,万一有人也遇上了呢. 问题描述 园友是做前端的,产品经理要求他使用jQuery DataTables插件显示一个列表,要实现分 ...

  10. [转] jQuery Infinite Ajax Scroll(ias) 分页插件介绍

    原文链接:http://justflyhigh.com/index.php/articlec/index/index.php?s=content&m=aticle&id=91 Infi ...

随机推荐

  1. 【整理】虚拟机和主机ping不通解决办法,虚拟机ping不通外网的解决方法

     检查几个方面: 1.检查虚拟网卡有没有被禁用2.检查虚拟机与物理机是否在一个VMNet中3.检查虚拟机的IP地址与物理机对应的VMNet是否在一个网段4.检查虚拟机与物理机的防火墙是否允许PING, ...

  2. Thinkphp5 同时连接两个库

    新建api/user.php <?php /** * Created by PhpStorm. * User: Administrator * Date: 2018/8/25 * Time: 1 ...

  3. 中移物联网onenet入门学习笔记1:资料获取

    onenet学习资料.视频.例程汇总:https://open.iot.10086.cn/bbs/thread-977-1-1.html onenet开发文档:https://open.iot.100 ...

  4. (转)iOS获取设备型号

    //获得设备型号 + (NSString *)getCurrentDeviceModel:(UIViewController *)controller { ]; size_t len; char *m ...

  5. PAT Basic 1078

    1078 字符串压缩与解压 文本压缩有很多种方法,这里我们只考虑最简单的一种:把由相同字符组成的一个连续的片段用这个字符和片段中含有这个字符的个数来表示.例如 ccccc 就用 5c 来表示.如果字符 ...

  6. Flask-用户角色及权限

    app/models.py class Role(db.Model): __tablename__ = 'roles' id = db.Column(db.Integer, primary_key=T ...

  7. HDU 5379 树形DP Mahjong tree

    任意一棵子树上节点的编号连续,每个节点的所有二字节点连续,求编号方案的总数. 稍微分析一下可知 每个节点的非叶子节点个数不能多于两个,否则这个子树无解,从而整棵树都无解. 每棵子树将所有节点按照编号从 ...

  8. python学习-- 数据库迁移 python manage.py makemigrations 和 python manage.py migrate

    python manage.py makemigrations 和 python manage.py migrate

  9. NoClassDefFoundError: javax/servlet/jsp/jstl/core/Config的问题

    故障问题: 使用springMVC3.05 ,tomcat服务器进行开发, Spring配置正确,console有输出,但是url打开时不能出现页面,提示错误信息为:NoClassDefFoundEr ...

  10. PTA 11-散列4 Hard Version (30分)

    题目地址 https://pta.patest.cn/pta/test/16/exam/4/question/680 5-18 Hashing - Hard Version   (30分) Given ...