java用layui实现下载_JavaWeb使用layui实现分页

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼

JavaWeb使用layui实现分页

【1】视图层

播放

删除

var tabMusicInfor;//音乐信息表

var i=0;

var layer, table;

//1-页面数据加载

$(function () {

//【1】加载&初始化layui模块

layui.use(["layer", "table"], function() {

table = layui.table;//【2】获取layui的table模块的属性

layer = layui.layer;//弹出层

//加载table模块数据

layuiTable();

});

});

//【2】加载table模块数据

function layuiTable(){

tabMusicInfor = table.render({

//【1】指定table的容器选择器或 DOM

elem: "#tabMusicInfor",

//【2】指定加载数据的路径

// url:"${ctx}/web/MyMusicServlet?method=musicList",

//【3】控制整个table元素的宽

width : 1500,

//【4】设置表头。值是一个二维数组

cols: [[

{ type: "checkbox", fixed :"left",width:"10%"},

{ type: "numbers", title: "序号",width:"10%"},

{ field: "music", title: "音乐名" ,width:"30%"},

{ field: "songer", title: "歌手" ,width:"30%"},

{ fixed :"right",title:"操作", toolbar: "#barDemo",align:"center"},

]],

//【5】开启分页，limit设置当前页面显示的记录值

page: {

limits : [10, 15,20,30,50 ]

,limit : 10

},

//【6】用于对分页请求(将分页重新向服务器请求数据)

request: {

pageName: "currentPage",

limitName: "rows",

},

//【7】存储当前页的列表数据

data: [],

});

//【8】音乐列表数据重载

searchTabMusic();

//【9】监听工具条事件

layuiTabletool();

}

//2-1触发音乐列表数据重载

function searchTabMusic(){

tabMusicInfor.reload({