template-web.js 真分页绑定表格

Posted BarryLiang

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了template-web.js 真分页绑定表格相关的知识,希望对你有一定的参考价值。

 <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">&#xe6df;</i></a>
                <a title="删除" href="javascript:;" onclick="admin_del(this,‘{{v.RI_ID}}‘)" class="ml-5" style="text-decoration:none">删除<i class="Hui-iconfont">&#xe6e2;</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 真分页绑定表格的主要内容,如果未能解决你的问题,请参考以下文章

Asp.Net真分页技术

template-web.js

分页“真分页”获取数据

数据渲染模板引擎,template-web的使用

真分页

template and pagination