小编给大家分享一下layer弹出层如何自定义提交取消按钮,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!
首先从js开始
/**
* 检查是否选中
*/
Sendandre.check = function () {
var selected = $('#' + this.id).bootstrapTable('getSelections');
if (selected.length === 0) {
Feng.info("请先选中表格中的某一记录!");
return false;
} else {
Sendandre.seItem = selected[0];
console.log(Sendandre.seItem);
return true;
}
};
/**
* 点击修改按钮时
*/
Sendandre.openChangestan = function () {
if (this.check()) {
this.layerIndex = layer.open({
type: 2,
title: '修改收派标准',
area: ['800px', '400px'], //宽高
fix: false, //不固定
maxmin: true,
content: Feng.ctxPath + '/sendandreceive/stander_edit?sendid=' + this.seItem.sendid,
success: function (layero, index) { //成功获得加载changefile.html时
//// console.log(obj.data.editAble);
var body = layer.getChildFrame('body', index);
//console.log(rowselect[0].filename);
body.find(".sendname").val(Sendandre.seItem.sendname); //通过class名进行获取数据
body.find(".minwe").val(Sendandre.seItem.minwe);
body.find(".maxwe").val(Sendandre.seItem.maxwe);
}
});
}
};
然后是弹出层加载的界面
@layout("/common/_dialog.html",{plugins:["laydate","sweet-alert","layer"],js:["/assets/modular/system/basic/sendandre/send_edit.js"]}){
<div class="container-fluid">
<form id="sendandreForm">
<div class="row">
<div class="col-6">
<div class="form-group">
<h6>标准名称 <span class="text-danger">*</span></h6>
<div class="controls">
<input name="sendname" type="text" class="form-control sendname" id="sendname">
</div>
</div>
<div class="form-group">
<h6>最小重量 <span class="text-danger">*</span></h6>
<div class="controls">
<input name="minwe" type="text" class="form-control minwe" id="minwe">
</div>
</div>
<div class="form-group">
<h6>最大重量 </h6>
<div class="controls">
<input name="maxwe" type="text" class="form-control maxwe" id="">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="text-xs-right">
<button class="btn btn-info normal-button-width" onclick="ensure()">提交</button>
<button class="btn btn-inverse normal-button-width m-l-10" onclick="closehe()">取消</button>
</div>
</div>
</div>
</form>
</div>
@}
然后是js函数实现
/**
* 关闭此对话框
*/
closehe = function () {
console.log("close");
// var inde=parent.layer.getFrameIndex(window.name);
var index = parent.layer.getFrameIndex(window.name);
console.log(index);
parent.layer.close(index);
};
ensure = function () {
console.log("daodao");
};
途中有一个错误就是把函数名称成为close()了,这个和关键字重复了,导致没有效果出现,关闭不了。
以上是“layer弹出层如何自定义提交取消按钮”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注亿速云行业资讯频道!
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。