參考文檔 ：https://blog.csdn.net/u011020900/article/details/52083166
<script type="text/javascript" src="/lib/js/jquery.js"></script>
<script type="text/javascript" src="/lib/layui/layui.js"></script>
<input type="button" class="layui-btn layui-btn-radius layui-btn-primary"
onclick="edit(${it.id})" value="編輯">
/**
* 編輯
* @param resId
*/
function edit(resId) {
//iframe層
layer.open({
type: 2,
title: '編輯服務資源',
shadeClose: true,
shade: 0.8,
area: ['800px', '600px'],
content: '/resource/editResourceById?resId=' + resId //iframe的url
});
}
@RequestMapping(value = "/editResourceById", method = RequestMethod.GET)
public ModelAndView editResourceById(@RequestParam(value = "resId", required = true) Integer resId) {
ModelAndView modelAndView = new ModelAndView();
Resource resource = resourceService.getResourceById(resId);
modelAndView.addObject("info", resource);
modelAndView.setViewName("resource/editResourceById");
return modelAndView;
}
<body class="layui-layout-body">
<form id="editResForm" class="layui-form" method="post" action="#">
<div class="layui-form-item ">
<label class="layui-form-label">項目編號</label>
<div class="layui-input-block">
<input type="hidden" name="id" value="${info.id}">
<input type="text" name="resNo" disabled placeholder="請輸入項目編號"
value="${info.resNo!}"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">項目名稱</label>
<div class="layui-input-block">
<input type="text" name="resName" placeholder="請輸入項目名稱"
value="${info.resName!}"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">資源類型</label>
<div class="layui-input-block">
<input type="button" class="layui-btn layui-btn-primary"
autocomplete="off" class="layui-input" value="服務資源">
<input type="hidden" name="resType" value="103">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">項目素材圖</label>
<div class="layui-input-block">
<button type="button" class="layui-btn" name="resPicPath" id="resPicPath">
<i class="layui-icon"></i>上傳圖片
</button>
</div>
</div>
<div class="layui-form-item layui-form-text kindeditor">
<label class="layui-form-label">資源描述</label>
<div class="layui-input-block">
<textarea name="resDesc" placeholder="請輸入內容" class="layui-textarea">${info.resDesc!}</textarea>
</div>
</div>
<div class="layui-form-item layui-form-text kindeditor">
<label class="layui-form-label">申請日期</label>
<div class="layui-inline">
<input type="text" class="layui-input" value="${(info.addTime?string('yyyy-MM-dd'))!}" name="addTime"
id="addTime">
</div>
</div>
<div class="layui-form-item layui-form-text kindeditor">
<label class="layui-form-label">截止日期</label>
<div class="layui-inline">
<input type="text" class="layui-input" name="expiresDate" id="expiresDate">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<input type="submit" class="layui-btn" value="提交">
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
<script>
layui.use('layer', function () {
var layer = layui.layer;
// 這個是在iframe里面的js代碼
var url = '/resource/saveEditResource';
var frameindex = parent.layer.getFrameIndex(window.name); //先得到當前iframe層的索引
$(document).on('click', '[type=submit]', function () {
var index = layer.load(1, {
shade: [0.1, '#fff'] //0.1透明度的白色背景
});
var data = $("#editResForm").serialize();
$.post(url, data, function (ev) {
if (ev.code == 200) {
layer.msg(ev.msg);
parent.location.href = "/resource/getResourceList?resType=103";
} else {
layer.close(index);
layer.msg(ev.msg);
}
}, 'json')
return false;
});
})
// 時間插件
layui.use('laydate', function () {
var laydate = layui.laydate;
//執行一個laydate實例
laydate.render({
elem: '#expiresDate' //指定元素
});
});
layui.use('laydate', function () {
var laydate = layui.laydate;
//執行一個laydate實例
laydate.render({
elem: '#addTime' //指定元素
});
});
@RequestMapping(value = "/saveEditResource", method = RequestMethod.POST)
@ResponseBody
public Map saveEditResource(Resource Resource) {
boolean flag = resourceService.saveEditResource(Resource);
Map map = new HashMap();
if (flag) {
map.put("code", 200);
map.put("msg", "更改成功");
} else {
map.put("code", "500");
map.put("msg", "更改失敗，代碼錯誤");
}
return map;
}
/**
* 獲取資源列表
*
* @param resType
* @return
*/
@RequestMapping(value = "/getResourceList", method = RequestMethod.GET)
public ModelAndView getResourceList(@RequestParam(value = "resType", required = true) Integer resType) {
ModelAndView model = new ModelAndView();
List<Resource> resourceList = resourceService.getResourceList(resType);
model.addObject("resourceList", resourceList);
if (101 == resType) { // 跳轉到 廣告 資源列表
model.setViewName("account/reslist");
} else if (102 == resType) { // 跳轉到 雲 資源列表
} else if (103 == resType) { // 跳轉到 服務 資源列表
model.setViewName("resource/getResourceList");
}
return model;
}