<div class="layui-table-box">
                        <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>
 <script id="oauthlist" type="text/html">
        {{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 真分页绑定表格的更多相关文章

  1. C#设计模式总结 C#设计模式(22)——访问者模式(Vistor Pattern) C#设计模式总结 .NET Core launch.json 简介 利用Bootstrap Paginator插件和knockout.js完成分页功能 图片在线裁剪和图片上传总结 循序渐进学.Net Core Web Api开发系列【2】:利用Swagger调试WebApi

    C#设计模式总结 一. 设计原则 使用设计模式的根本原因是适应变化,提高代码复用率,使软件更具有可维护性和可扩展性.并且,在进行设计的时候,也需要遵循以下几个原则:单一职责原则.开放封闭原则.里氏代替 ...

  2. 网站真分页js代码该怎么写?

    真分页这个词对程序猿们来说,并不是一个陌生的词汇,但是如果你是初次学习真分页,或许还是得花点时间小小研究下,下面是之前去转盘网(喜欢的可以看看,也可以进入引擎模式)的真分页js部分代码,html部分的 ...

  3. Django中使用JS通过DataTable实现表格前端分页,每页显示页数,搜索等功能

    Django架构中自带了后端分页的技术,通过Paginator进行分页,前端点击按钮提交后台进行页面切换. 优缺点:后端分页对于数据量大的场景有其优势,但页面切换比较慢. 后端分页python3代码如 ...

  4. ASP.NET(五):ASP.net实现真分页显示数据

    导读:在上篇文章中,介绍了用假分页实现数据的分页显示 ,而避免了去拖动滚动条.但,假分页在分页的同时,其实是拖垮了查询效率的.每一次分页都得重新查询一遍数据,那么有没有方法可以同时兼顾效率和分页呢,那 ...

  5. Web之真假分页

    在web设计中一个无法避免的问题就是分页显示.当数据量特别大的时候,我们不可能将全部的数据都在一个页面进行显示,假设这样将严重影响到它的美观性.所以在这个时候,分页显示则成为了我们的大功臣.当然分页也 ...

  6. Spring Data Jpa+SpringMVC+Jquery.pagination.js实现分页

    本博客介绍基于Spring Data这款orm框架加上Jquery.pagination插件实现的分页功能. 介绍一下Spring Data框架 spring Data : Spring 的一个子项目 ...

  7. 网站开发进阶(二十五)js如何将html表格导出为excel文件

    js如何将html表格导出为excel文件        赠人玫瑰,手留余香.若您感觉此篇博文对您有用,请花费2秒时间点个赞,您的鼓励是我不断前进的动力,共勉! jsp页面数据导出成excel的方法很 ...

  8. ngTbale真分页实现排序、搜索等功能

    一. 真分页表格基础 1. 需求:分页,排序,搜索都是需要发API到服务端. 2. JS实现代码: getStorage是localStorage一个工具方法,可以自己写这个方法. API参数如下: ...

  9. [小技巧]让你的GridView支持IQueryable,并自动实现真分页

    众所周知,asp.net自带的GridView在自带分页方面设计得很2,因为它是假分页,即内存分页.而且它不智能支持强大的Iqueryable. 但这表明微软忽略了现实中的分页需求吗?答案应该不是,我 ...

随机推荐

  1. 登录状态保持Session/Cookie

    登录成功: 1.Session保存User对象. 2.Cookie保存唯一值UserID(或者usercode)和加密Sign(生成规则自己定义,MD5用户名,用户ID,私有串等),并设置过期时间. ...

  2. MySQL数据库命令大全

    --数据库操作前的准备-- 创建数据库-- create database python_test_1 charset=utf8; -- 使用数据库-- use python_test_1; -- s ...

  3. jzoj5945

    這題是均分紙牌求方案數 我們可以分2種情況討論: 1.當前面部分的平均值>=現在我們要的值 那麼我們可以把所有牌都放到第i個點,現在若有k張牌,則要把k−i∗avek-i*avek−i∗ave張 ...

  4. Apache Log4j配置说明

    1.Log4j简介 Log4j是Apache的一个开源项目,它允许开发者以任意间隔输出日志信息.Log4j主要由三大类组件构成: 1)Logger-负责输出日志信息,并能够对日志信息进行分类筛选,即决 ...

  5. 位域(bit fields)简介

    使用位域或位操作移动一个字节中的位 Java中EnumSet代替位域代码详解 关于位域的一些东西 深入理解Java枚举类型(enum) 位域是指信息在存储时,并不需要占用一个完整的字节, 而只需占几个 ...

  6. JS-DOM Element方法和属性

    JS-DOM Element方法和属性 S-DOM Element方法和属性一,获取html元素1.getElementByID(id)通过对元素的ID访问,这是DOM一个基础的访问页面元素的方法.e ...

  7. 支付宝小程序自定义弹窗插件|支付宝dialog插件|model插件

    支付宝小程序自定义弹窗组件wcPop|小程序自定义对话框|actionSheet弹窗模板 支付宝小程序官方提供的alert提示框.dialog对话框.model弹窗功能比较有限,有些都不能随意自定义修 ...

  8. 用Lingo求解线性规划问题

    第一步:输入目标条件和约束条件.每行以分号隔开.然后点击工具栏上的Solve按钮,或Lingo菜单下的Solve子菜单. 第二步:检查report中的结果. 默认情况下,Lingo不进行灵敏度分析. ...

  9. 【Spring】Spring MVC文件上传--整合bootstrap-fileinput和jQuery-File-Upload

    前言 这里分享两个使用Spring MVC进行文件上传的简单示例, 分别整合bootstrap-fileinput 和 Jquery File Upload , 代码十分简单, 都是入门的示例,因此这 ...

  10. Spring Security构建Rest服务-0300-Restful API异常处理

    SpringBoot默认的错误处理机制: 一.测试需要的部分代码 (完整代码放在了github https://github.com/lhy1234/spring-security): UserCon ...