// 行事件綁定
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', {});
【網站聲明】本站部分內容來源于互聯網,旨在幫助大家更快的解決問題，如果有圖片或者內容侵犯了您的權益，請聯系我們刪除處理，感謝您的支持！