layui怎麼獲取表單資料？
阿新 • • 發佈：2019-01-09
獲取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) { } });