获取form中的数据:
jsp:
<form class="layui-form">
<button id="btnSubmit" lay-filter="btnSubmit" lay-submit>保存</button>
</form>
js:
form.on('submit(btnSubmit)', function (data) {
//表单数据formData
var formData = data.field;
});
获取table中的数据
执行一个如上图的table实例:
jsp:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1">
<title>学生列表</title>
<link rel="stylesheet" href="statics/css/commonCss.css">
<script src="statics/js/commonJs.js"></script>
</head>
<body>
<div class="layui-container-student">
<table id="table" lay-filter="monitor"></table>
</div>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detail">查看</a>
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
</body>
</html>
js:
layui.use([ 'laydate', 'laypage', 'layer', 'table', 'carousel', 'upload','element', 'slider' ],
function() {
var laydate = layui.laydate // 日期
, laypage = layui.laypage // 分页
, layer = layui.layer // 弹层
, table = layui.table // 表格
, carousel = layui.carousel // 轮播
, upload = layui.upload // 上传
, element = layui.element // 元素操作
, slider = layui.slider // 滑块
// 执行一个 table 实例
table.render({
elem : '#table',
height : 550,
url : 'studentList' ,
title : '学生表' ,
page : true , //开启分页
method: 'post',
cols : [ [ // 表头
{
type : 'checkbox'
}, {
field : 'id',
title : '学号',
align: 'center'
}, {
field : 'name',
title : '姓名',
align: 'center'
}, {
field : 'age',
title : '年龄',
align: 'center'
}, {
field : 'nation',
title : '民族',
align: 'center'
},{
field : 'sexName',
title : '性别',
align: 'center'
}, {
field : 'grade',
title : '年级',
align: 'center'
}, {
field : 'studentClass',
title : '班级',
align: 'center'
}, {
field : 'year',
title : '学年',
align: 'center'
}, {
field : 'readStatus',
title : '在读状态',
align: 'center'
}, {
field : 'verifyStatus',
title : '审核状态',
align: 'center'
},{
fixed: 'right',
width: 165,
title : '操作',
align : 'center',
toolbar : '#barDemo'
} ] ]
});
// 监听行工具事件
table.on('tool(monitor)', function(obj) {
var data = obj.data // 获得当前行数据
, layEvent = obj.event; // 获得 lay-event 对应的值
if (layEvent === 'detail') {
openDetail(data);
} else if (layEvent === 'del') {
deleteStudent(data);
} else if (layEvent === 'edit') {
openEdit(data);
}else if(layEvent=== 'withdraw'){
withdraw(data);
}
});
//删除按钮
function deleteStudent(data) {
}
// 打开查看按钮
function openDetail(data) {
}
});