// 行事件绑定
table.on('tool(test)', function (obj) {
var data = obj.data;
if (obj.event === "edit") {
//eg2
layer.open({
title: '修改分类'
, type: 2
, btn: ['提交']
, content: 'edit.html'
, area: ['720px', '680px']
, shadeClose: false
, move: false
, scrollbar: false
, success: function (layero, index) {
// 数据回显
var body = layer.getChildFrame('body', index);
body.find('input[name="title"]').val(data.title);
body.find('input[name="sort"]').val(data.sort);
body.find('input[name="imgUrl"]').val(data.imgUrl);
body.find('textarea[name="remark"]').val(data.remark);
body.find('select[name="stated"]').val(data.stated);
body.find('select[name="pageCode"]').val(data.pageCode);
body.find('input[name="outUrl"]').val(data.outUrl);
body.find('img[id="demo1"]').attr("src",imgUrl+data.imgUrl);
}
, yes: function (index, layero) {
// 点击确定后获取弹窗数据
var body = layer.getChildFrame('body', index);
let title = body.find('input[name="title"]')[0].value;
let sort = body.find('input[name="sort"]')[0].value;
let imgUrl = body.find('input[name="imgUrl"]')[0].value;
let remark = body.find('textarea[name="remark"]')[0].value;
let stated = body.find('select[name="stated"]')[0].value;
let pageCode = body.find('select[name="pageCode"]')[0].value;
let outUrl = body.find('input[name="outUrl"]')[0].value;
if (title.length < 1) {
layer.msg("请输入轮播图名称");
return false;
}
if (imgUrl.length < 8) {
layer.msg("请上传图片");
return false;
}
if (imgUrl.length < 8) {
layer.msg("请上传图片");
return false;
}
$.ajax({
url: url + "/sys/b/update"
, type: "post"
, data: {
token: localStorage.getItem("token"),
id: data.id,
title: title,
sort: sort,
imgUrl: imgUrl,
stated: stated,
pageCode: pageCode,
outUrl: outUrl,
remark: remark
},
success: function (res) {
layer.msg(res.message, {time: 1500}, function () {
if (res.code == "200") {
layer.closeAll();
window.location.reload();
} else if (res.code == "201") {
window.location = "../login.html";
}
})
}
})
},
cancel: function () {
//右上角关闭回调
layer.msg("已取消",{time:1500},function () {
layer.closeAll();
});
}
});
} else if (obj.event === "del") {
layer.confirm("确定删除么？", {
btn: ["确定", "取消"]
}, function () {
$.ajax({
url:url+"/sys/b/del",
type:"post",
data:{
token:localStorage.getItem("token"),
id:data.id
},
success:function (res) {
layer.msg(res.message, {time: 1500}, function () {
if (res.code == "200") {
layer.closeAll();
window.location.reload();
} else if (res.code == "201") {
window.location = "../login.html";
}
})
}
})
})
}
})
弹框数据
<form class="layui-form" >
<div class="layui-form-item">
<label class="layui-form-label">标题</label>
<div class="layui-input-inline">
<input type="text" name="title" value="" placeholder="标题" maxlength="10"
autocomplete="off" class="layui-input">
</div>
<label class="layui-form-label">排序</label>
<div class="layui-input-inline">
<input type="number" name="sort" value="0" placeholder="排序" maxlength="10"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">位置</label>
<div class="layui-input-inline">
<select name="pageCode" lay-filter="page_code" id="page_code">
<option value="HOME_PAGE">首页</option>
</select>
</div>
<label class="layui-form-label">展示/隐藏</label>
<div class="layui-input-inline">
<select name="stated" lay-filter="stated" id="stated">
<option value="1">展示</option>
<option value="0">隐藏</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">链接</label>
<div class="layui-input-inline">
<input type="text" name="outUrl" value="" placeholder="请输入链接" maxlength="10"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">图</label>
<div class="layui-input-inline">
<div class="layui-upload">
<button type="button" class="layui-btn" id="test1">上传图片</button>
<div class="layui-upload-list">
<img class="layui-upload-img" id="demo1" style="width: 200px;height: 175px;margin-top: 8px">
<input type="hidden" name="imgUrl" id="imgUrl">
</div>
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">备注</label>
<div class="layui-input-inline">
<textarea placeholder="请输入内容最多150个字符" maxlength="150" style="width: 350px;height: 180px;resize: none" name="remark" class="layui-textarea"></textarea>
</div>
</div>
</form>
<link rel="stylesheet" href="../../lib/layui-v2.5.5/css/layui.css" media="all">
<script src="../../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script src="../../js/jquery/dist/jquery.js" charset="utf-8"></script>
<script src="../../js/common.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
<script>
// 加载需要的组件如：上传、日期等
//常规使用 - 普通图片上传
layui.use(['upload','form'], function () {
var upload = layui.upload;
var form = layui.form;
form.render();
upload.render({
elem: '#test1'
, size: 1024 * 1204
, exts: 'png|jpg|jpeg' //只允许上传压缩文件
, url: url + '/upload?token=' + localStorage.getItem("token") //改成您自己的上传接口
, before: function (obj) {
//预读本地文件示例，不支持ie8
obj.preview(function (index, file, result) {
$('#demo1').attr('src', result); //图片链接（base64）
});
layer.msg('上传中', {icon: 16, time: 0});
}
, done: function (res) {
layer.msg(res.message, {time: 1500}, function () {
$("#imgUrl").val(res.data);
})
}
});
});
</script>
如果需要对编辑器进行数据回显：一定要在build之前进行赋值
var detailHtml = localStorage.getItem("detailHtml");
$("#detail_area").val(detailHtml);
let index= layedit.build('detail_area', {});
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！