easyUi创建临时Dialog
项目中遇到一个页面两个easyUi的dialog弹出层,结果只要点击了其中一个,另外一个就不能正常显示了,不知何因,除非刷新整个页面才能正常显示,为了解决这个问题,查了很多资料,终于找到一个解决方案,那就是关闭这个dialog之后将这个div进行销毁(当然也可以直接销毁),因此不能使用传统的div弹出dialog的写法,需要改变思路,使用以下这种方式实现需要的效果,代码如下:
一、父页面easyUi的js代码,这个写法的好处是不需要再写这个div的html代码了,如:<div id="addWorkFlowDialog" ></div>//现在只需要如下写法即可<script type="text/javascript"> var addWorkFlowDialog; /* 定义一个临时弹出层的全局对象 */ function newSWorkFlow() { addWorkFlowDialog = $("<div/>").dialog({ title : '新增', /* 设置弹窗标题 */ iconCls : 'icon-edit', /* 设置弹窗图标 */ modal : true, /* 设置为背景页面不可操作 */ width : 800, /* 设置窗口宽度 */ height : 600, /* 设置窗口高度 */ closed : true, href : '${ctx}/system/workFlow/addView?flowId='+flowId, /* 远程加载页面数据 */ onClose : function() { /* 当这个dialog关闭之后 */ $(this).dialog('destroy'); /* 销毁当前这个div */ } }); addWorkFlowDialog.dialog("open"); }</script>
二、弹出层页面,关闭当前弹出层的js代码,需要使用父页面的全局对象来关闭自己
<script type="text/javascript"> /* 关闭当前页面 */ function closeForm(){ addWorkFlowDialog.dialog("close"); /* 调用父页面的全局对象来关闭自己 */ }</script>
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。