template-web.js 真分页绑定表格
<div class="layui-table-header">
<table cellspacing="0" cellpadding="0" border="0" class="layui-table">
<thead>
<tr class="layui-table-header">
<th width="25"><input type="checkbox" id="selectAll" value=""></th>
<th width="150">角色名称</th>
<th>学校</th>
<th>年级</th>
<th>班级</th>
<th>科目</th>
<th>用户</th>
<th>权限</th>
<th width="120">创建时间</th>
<th width="150">操作</th>
</tr>
</thead>
<tbody id="conlist"></tbody>
</table>
</div>
<div id="page" class="text-r"></div>
</div>
{{each data v i}}
<tr class="text-c" data-id="{{v.id}}">
<td><input type="checkbox" value="{{v.id}}" name="checkbox"></td>
<td>{{v.name}}</td>
<td>{{v.schoolName}}</td>
<td>{{v.gradeName}}</td>
<td>{{v.className}}</td>
<td>{{v.courseName}}</td>
<td>{{v.userName}}</td>
<td>{{v.roleName}}</td>
<td>{{v.createTime}}</td>
<td class="td-manage" style="font-size:18px">
<button onclick="admin_edit({{v.id}})" class="layui-btn layui-btn-primary layui-btn-radius" style="text-decoration:none">编辑</button>
<a onclick="admin_del(this,'{{v.id}}')" class="layui-btn layui-btn-primary layui-btn-radius" style="text-decoration:none">删除</a>
@*<a title="编辑" href="javascript:;" onclick="admin_edit({{v.RI_ID}})" class="ml-5" style="text-decoration:none">编辑<i class="Hui-iconfont"></i></a>
<a title="删除" href="javascript:;" onclick="admin_del(this,'{{v.RI_ID}}')" class="ml-5" style="text-decoration:none">删除<i class="Hui-iconfont"></i></a>*@
</td>
</tr>
{{/each}}
</script>
function rgpage(totle) {
layui.use(['laypage', 'layer'], function () {
var laypage = layui.laypage
, layer = layui.layer;
laypage.render({
elem: 'page'
, count: totle//$("#total").html()
, limit: 20
, curr: currentPageAllAppoint
, first: '首页'
, last: '尾页'
, prev: '<em>←</em>'
, next: '<em>→</em>'
, theme: '#1E9FFF'
, jump: function (obj, first) {
currentPageAllAppoint = obj.curr;
if (!first) {
var gguid = $("#gradeid").find("option:selected").val();
var cguid = $("#classid").find("option:selected").val();
var courseid = $("#course").find("option:selected").val();
$RoleManage.getRoleGroupList(gguid, cguid, courseid, obj.curr, 20, $("#key").val());
}
}
});
});
}
$.get("/admin/RoleManage/GetRoleGroupList", data, function (out) {
//填充试题总数
var totle = out.message;
$("#total").html(totle);
var html = template('oauthlist', out);
$("#conlist").html(html);
//加载分页方法
rgpage(totle);
})
return "{\"code\":\"" + code + "\",\"message\":\"" + message + "\",\"data\":[" + data + "]}";
template-web.js 真分页绑定表格的更多相关文章
- C#设计模式总结 C#设计模式(22)——访问者模式(Vistor Pattern) C#设计模式总结 .NET Core launch.json 简介 利用Bootstrap Paginator插件和knockout.js完成分页功能 图片在线裁剪和图片上传总结 循序渐进学.Net Core Web Api开发系列【2】:利用Swagger调试WebApi
C#设计模式总结 一. 设计原则 使用设计模式的根本原因是适应变化,提高代码复用率,使软件更具有可维护性和可扩展性.并且,在进行设计的时候,也需要遵循以下几个原则:单一职责原则.开放封闭原则.里氏代替 ...
- 网站真分页js代码该怎么写?
真分页这个词对程序猿们来说,并不是一个陌生的词汇,但是如果你是初次学习真分页,或许还是得花点时间小小研究下,下面是之前去转盘网(喜欢的可以看看,也可以进入引擎模式)的真分页js部分代码,html部分的 ...
- Django中使用JS通过DataTable实现表格前端分页,每页显示页数,搜索等功能
Django架构中自带了后端分页的技术,通过Paginator进行分页,前端点击按钮提交后台进行页面切换. 优缺点:后端分页对于数据量大的场景有其优势,但页面切换比较慢. 后端分页python3代码如 ...
- ASP.NET(五):ASP.net实现真分页显示数据
导读:在上篇文章中,介绍了用假分页实现数据的分页显示 ,而避免了去拖动滚动条.但,假分页在分页的同时,其实是拖垮了查询效率的.每一次分页都得重新查询一遍数据,那么有没有方法可以同时兼顾效率和分页呢,那 ...
- Web之真假分页
在web设计中一个无法避免的问题就是分页显示.当数据量特别大的时候,我们不可能将全部的数据都在一个页面进行显示,假设这样将严重影响到它的美观性.所以在这个时候,分页显示则成为了我们的大功臣.当然分页也 ...
- Spring Data Jpa+SpringMVC+Jquery.pagination.js实现分页
本博客介绍基于Spring Data这款orm框架加上Jquery.pagination插件实现的分页功能. 介绍一下Spring Data框架 spring Data : Spring 的一个子项目 ...
- 网站开发进阶(二十五)js如何将html表格导出为excel文件
js如何将html表格导出为excel文件 赠人玫瑰,手留余香.若您感觉此篇博文对您有用,请花费2秒时间点个赞,您的鼓励是我不断前进的动力,共勉! jsp页面数据导出成excel的方法很 ...
- ngTbale真分页实现排序、搜索等功能
一. 真分页表格基础 1. 需求:分页,排序,搜索都是需要发API到服务端. 2. JS实现代码: getStorage是localStorage一个工具方法,可以自己写这个方法. API参数如下: ...
- [小技巧]让你的GridView支持IQueryable,并自动实现真分页
众所周知,asp.net自带的GridView在自带分页方面设计得很2,因为它是假分页,即内存分页.而且它不智能支持强大的Iqueryable. 但这表明微软忽略了现实中的分页需求吗?答案应该不是,我 ...
随机推荐
- ODP.NET 之 ExecuteNoQuery 执行 Merge into 返回值
当执行Oracle.ManagedDataAccess.Client.OracleCommand.ExecuteNonQuery时,如果sql语句是 merge into ...,则返回值表现不稳定, ...
- 20164317《网络对抗技术》Exp4 恶意代码分析
1.实践目标 1.是监控你自己系统的运行状态,看有没有可疑的程序在运行. 2.是分析一个恶意软件,就分析Exp2或Exp3中生成后门软件:分析工具尽量使用原生指令或sysinternals,systr ...
- CentOS 7 - 安装Windows字体!
1,安装cabextract: 下载地址:http://ftp.tu-chemnitz.de/pub/linux/dag/redhat/el7/en/x86_64/rpmforge/RPMS/cabe ...
- LOJ#3086. 「GXOI / GZOI2019」逼死强迫症(矩阵快速幂)
题面 传送门 题解 先考虑全都放\(1\times 2\)的方块的方案,设防\(i\)列的方案数为\(g_i\),容易推出\(g_i=g_{i-1}+g_{i-2}\),边界条件为\(g_0=g_1= ...
- Elasticsearch批量操作API用法介绍
Elasticsearch的Bulk API允许批量提交index和delete请求,有如下两种用法: 用法1 BulkRequestBuilder requestBuilder = client.p ...
- grub覆盖mbr引导系统
grub覆盖mbr引导系统 0.个人PC,WIN 7 + Kali,easybcd 不起作用,需要制作 kali 安装盘 PS:推荐使用 universal usb installer 制作. 方案一 ...
- 【bzoj3028】 食物 生成函数+隔板法
题目传送门:https://www.lydsy.com/JudgeOnline/problem.php?id=3028 这题的推导很妙啊,裸的推母函数的题. 我们首先构造出每种食物的母函数: 汉堡:$ ...
- nodeJS搭建一个简单的(代理)web服务器
前端获取数据时经常遇见跨域问题,以前一直用nginx做反向代理.最近在用vuejs,发现webpack-dev-server的代理简单好用.于是仿照写了一个简单的web服务器,用于非webpack的项 ...
- Nginx基本入门
转自:http://blog.csdn.net/u012486840/article/details/53098890 1.静态HTTP服务器 首先,Nginx是一个HTTP服务器,可以将服务器上的静 ...
- VSTO学习(四)——自定义Excel UI 转载
本专题概要 引言 自定义任务窗体(Task Pane) 自定义选项卡,即Ribbon 自定义上下文菜单 小结 引言 在上一个专题中为大家介绍如何创建Excel的解决方案,相信大家通过从上面一个专题之后 ...