版本:layui | 浏览器: |
这个是表格初始化:
//初始化Table
layui.use(['table','form'], function(){
var table = layui.table;
var form = layui.form;
......
,{field:'openStatus', title: '启用状态',event: 'setOpenStatus',templet: '#openStatus', unresize: true}
......
//监听开关操作
form.on('switch(openStatus)', function(obj){
alert(1)
console.log(JSON.stringify(obj)+"!!!!!")
var params = {};
if(obj.value == 1){
params["openStatus"] = 0;
}else{
params["openStatus"] = 1;
}
params["id"] = obj.elem.getAttribute("switchId");
//编辑策略-启用状态
modTask(params);
});
//监听工具条
table.on('tool(sceneStrategy)', function(obj){
......
html部分
<div id="sceneStrategyPage">
<table class="layui-hide" lay-skin="line" id="sceneStrategy_list" lay-filter="sceneStrategy"></table>
</div>
<script type="text/html" id="openStatus">
<input lay-event="setOpenStatus" type="checkbox" name="openStatus" value="{{d.openStatus}}" switchId={{ d.id}} lay-skin="switch" lay-text="启用|未启用" lay-filter="openStatus"{{ d.openStatus == 1 ? 'checked' : '' }}>
</script>
<script type="text/html" id="sceneStrategy_opt">
<a lay-event="edit" style="cursor: pointer;"><span class="glyphicon glyphicon-pencil" title="编辑"></span></a>
<a lay-event="del" style="margin-left:20px;cursor: pointer;"><span class="glyphicon" title="删除"><img src="../../images/sensor_del.png"/></span></a>
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="download">下载</a>
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-xs" lay-event="comment">评论</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<!-- 自定义模板加入表单元素 -->
<script type="text/html" id="isRecommentx">
<input type="checkbox" name="isRecommentx" value={{d.id}} lay-skin="switch" lay-text="是|否" lay-filter="isRight" {{ d.isRecomment == 1 ? 'checked' : '' }}>
</script>
<script type="text/html" id="play">
<a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="play">播放</a>
</script>
<script>
var table;
var pageNow = 0;
layui.use(['table','form','admin'], function(){
table = layui.table;
var form = layui.form , admin = layui.admin;
table.render({
elem: '#demo'
,url:''
,loading: true
,cols: [[ //标题栏
{fixed: 'left',type:'checkbox'}
,{type: 'numbers', title: '序号', align:'center'}
,{field: 'soundShow_User', title: '所属用户' ,align:'center'}
/* ,{field: 'soundShow_Lines', title: '所属台词' ,align:'center'} */
,{field: 'movieName', title: '所属电影' ,align:'center'}
,{field: 'soundShow_Fragment', title: '所属片段' ,align:'center'}
,{field: 'recordUrl', title: '录音地址' ,align:'center',templet:'#play'}
,{field: 'playCount', title: '播放次数' ,align:'center',sort:true}
,{field: 'countShare', title: '分享数量' ,align:'center',sort:true}
,{field: 'countLike', title: '点赞数量' ,align:'center',sort:true}
,{field: 'countComment', title: '评论数量' ,align:'center',sort:true}
,{field: 'isRecomment', title: '是否精选', align:'center',templet: '#isRecommentx'}
/* ,{field: 'info', title: '描述' ,align:'center'} */
,{fixed: 'right', title:'操作', align:'center',width:200, toolbar:'#barDemo' }
]]
,id:'dataTable'
,page: true //是否显示分页
,isBatchDelete:false //是否开启批量删除
,limits: [10,20,30,50]
,limit: 20 //每页默认显示的数量
,where:{access_token: layui.data('layuiAdmin').access_token}
,done: function(res, curr, count){
pageNow = curr;
form.render();
}
});
form.on('switch(isRight)', function(data){
if(data.elem.checked == true){
admin.req({
url:'',
type:'POST',
data:{'id':data.value,'state':1},
dataType:'json',
success:function(res){
layer.msg("已推荐为精选");
}
});
}else{
admin.req({
url:'',
type:'POST',
data:{'id':data.value,'state':0},
dataType:'json',
success:function(res){
layer.msg("已取消精选");
}
});
}
});
//监听工具条
table.on('tool(demo)', function(obj){
var data = obj.data;
//播放
if(obj.event === 'play'){
sessionStorage.setItem("userRecordData",JSON.stringify(data));
layer.open({
type:2,
offset: '100px',
area: ['310px', '38px'],
title: false,
shadeClose: true,
content:"",
success:function(){
}
});
}
//下载
else if(obj.event === 'download'){
admin.req({
url:'',
type:'POST',
data:{'id':data.id},
dataType:'json',
success:function(res){
if(!!res.url){
window.open(res.url)
}else{
layer.msg("找不到下载路径");
}
}
});
}
//评论
else if(obj.event === 'comment'){
var link ="";
sessionStorage.setItem("recordData",JSON.stringify(data));
location.hash=link;
}
//删除操作
else if(obj.event === 'del'){
layer.confirm('确定要删除吗?', function(index){
admin.req({
type:"post",
url:"",
data:{"id":data.id},
async:true,
dataType:'json',//返回的类型
maxmin: true, //开启最大化最小化按钮
success:function(value){//返回的对象
obj.del();
table.reload('dataTable', {page: {curr: 1}});
}
});
layer.close(index);
});
} 。。。。。。。
<!-- 自定义模板加入表单元素 -->
<script type="text/html" id="isRecommentx">
<input type="checkbox" name="isRecommentx" value={{d.id}} lay-skin="switch" lay-text="是|否" lay-filter="isRight" {{ d.isRecomment == 1 ? 'checked' : '' }}>
</script>
,{field:'openStatus', title: '启用状态',templet: '#openStatus', unresize: true}还有就是你说的table回调调用form.render()是怎么用的
这个是操作列
,{field:'right', title: '操作',width:180,align: 'center', toolbar:"#sceneStrategy_opt"}
......
//监听工具条
table.on('tool(sceneStrategy)', function(obj){
if(obj.event === 'edit'){//信息编辑
....
html部分
<script type="text/html" id="sceneStrategy_opt">
<a lay-event="edit" style="cursor: pointer;"><span class="glyphicon glyphicon-pencil" title="编辑"></span></a>
<a lay-event="del" style="margin-left:20px;cursor: pointer;"><span class="glyphicon" title="删除"><img src="../../images/sensor_del.png"/></span></a>
</script>
//初始化策略列表
function initTable(){
//初始化Table
layui.use(['table','form'], function(){
var table = layui.table;
var form = layui.form;
table.render({
elem: '#sceneStrategy_list'
,url:'xxxxxx'
,method:'post'
,contentType: 'application/json'
....
,cols: [[
,{field:'openStatus', title: '启用状态',templet: '#openStatus', unresize: true}
...
,{field:'right', title: '操作',width:180,align: 'center', toolbar:"#sceneStrategy_opt"}
]]
,page: true
});
//监听开关操作
form.on('switch(openStatus)', function(obj){
alert(1)
console.log(JSON.stringify(obj)+"!!!!!")
var params = {};
if(obj.value == 1){
params["openStatus"] = 0;
}else{
params["openStatus"] = 1;
}
params["id"] = obj.elem.getAttribute("switchId");
...
});
//监听工具条
table.on('tool(sceneStrategy)', function(obj){
console.log(JSON.stringify(obj)+"%%%%%%%%")
if(obj.event === 'edit'){//信息编辑
// 编辑赋值
giveEdit(obj.data);
form.render();
}
});
}
...
else if(obj.event === 'edit'){//信息编辑
// 编辑赋值
giveEdit(obj.data);
// form.render();
}
...
//编辑赋值
function giveEdit(data){
...
//赋值分组列表
initGroupTable(groupInfoList); 这里初始化另外一个数据表格了
...
微信扫码关注 layui 公众号