说到弹窗,在jeecg中弹窗用到最多的地方无非是新增/编辑的弹窗。
1.列表页面新增编辑按钮触发的弹窗即lhgdialog,不论是add/update,最终走的都是curdtools.js中的createwindow
核心代码:
var mydialog = $.dialog({ content: 'url:'+addurl, lock : true, zIndex: getzIndex(), width:width, height:height, title:title, opacity : 0.3, cache:false, ok: function(){ iframe = this.iframe.contentWindow; saveObj(); return false; }, okVal: $.i18n.prop('dialog.submit'), cancelVal: $.i18n.prop('dialog.close'), cancel: true /*为true等价于function(){}*/ });
可以查阅官方api了解每个参数的意义:http://www.lhgdialog.com/api/
此处只解释一个属性:content: 'url:'+addurl
如果addurl传入的地址指向了一个页面,那么这个新的页面内容会以iframe的形式加载出来(需要注意的是弹窗本身并非iframe),那么正题来了,既然他的真面目是iframe,那么涉及iframe的传值、方法调用用在此处均可。
a.父页面调用子页面的方法 $("#iframeId")[0].contentWindow.childMethod(); 通过获取iframe的js对象调用其contentWindow.子页面的方法
b.子页面调用父页面的方法 parent.parentMethod();
其实查阅lhgdialog api可以发现类似的的调用方法:
2.说完JS接下来需要探索一下css的修改,因为此弹窗的样式被改造过,所以按照官方文档可能有时达不到想要的效果,
1)每种风格有不同的样式效果,查看baseTag代码,可知每种风格下会引入哪些样式。
2)找到对应base中引入的skin-css,修改样式:
/**此样式为弹窗title的颜色*/ .ui_lt, .ui_rt, .ui_lb, .ui_rb, .ui_t, .ui_b { background: #18a689!important; }
/**此样式为弹窗确认按钮的样式*/ input.ui_state_highlight { background: #18a689 none repeat scroll 0 0; border: 1px solid #18a689; color: #fff; text-shadow: 0 -1px 1px #1c6a9e; height: 30px; }
3)插件位置:新版jeecg中lhgdialog被移至jeecg-common-plugin-ui项目中去了,也就是说在jeecg项目中无法直接修改lhgdialog相关的js/css。
相关推荐
lhgDialog弹窗插件,包含帮助文档和demo,
lhgdialog拓展功能弹窗插件源码 lhgdialog是一功能强大的简单迷你并且高效的弹出窗口组件, 基于网络访问并且兼容IE 6.0+,Firefox 3.0+,Opera 9.6+, Chrome 1.0+,Safari 3.22+。 本事例只针对lhgdialog的拓展...
lhgDialog弹窗插件,包含帮助文档和dome
NULL 博文链接:https://hudeyong926.iteye.com/blog/689600
本人常年开发使用的弹窗(LhgDialog),这个是个插件,经本人长期整理总结出常用的!弹出页面,弹出图片,弹出提示框均可,也使用过别的弹窗,但是扩展性没有这个强!
在弹窗插件lhgdialog的基础上,进行了扩展,兼容单签各种主流浏览器,不限开发语言。 二、功能介绍 整理了常用的弹出窗口,代码简单,其它功能见图。 三、注意事项 开发环境为Visual Studio 2010
lhgdialog DIV+JS弹出窗口插件 ! lhgdialog DIV+JS弹出窗口插件 !
写了11种窗口弹出效果;如不带和带遮罩层的普通窗口,返回值到调用页面,在指定位置弹出窗口并随滚动条滚动等
摘要:脚本资源,Ajax/JavaScript,lhgdialog,弹出框插件 lhgdialog 弹出框插件,以前就有的插件,已经作者的修正完善,并优化了代码,重新打包奉上。 使用时注意:lhgdialog目录是一个整体,不可破坏里面的目录结构...
lhgdialog是一功能强大的简单迷你并且高效的弹出窗口组件 专为大型弹出窗口定制相对于网上其它弹出窗口组件主要功能是提示信息来说,本组件主要是用来制作窗口中内容较多,页面比较复杂的窗口。本组件的窗口内容面...
lhgdialog弹窗选择数据,包含实例代码.
lhgdialog超强弹窗控件,支持遮罩,缩放、拖动,随滚动条滚动,丰富接口调用 可以外调页面,也可以显示html内容 我自己扩展如下: http://www.px915.com/lhgdialog/_demo.html 1、改变了弹窗的样式(自认为喜欢...
lhgdialog 一个很好用的弹出窗口插件lhgdialog 一个很好用的弹出窗口插件lhgdialog 一个很好用的弹出窗口插件lhgdialog 一个很好用的弹出窗口插件
NULL 博文链接:https://aaagu1234.iteye.com/blog/1265338
本包包含API文档 - 弹出窗口组件演示_files、基础示例 - LHGDIALOG_files、API文档 - 弹出窗口组件演示.htm、窗口lhgdialog参数.doc、窗口的各种传值在线演示示例.doc、窗口的各种在线演示示例.doc、基础示例 - ...
一款很好用的弹出窗口js插件 还可以更换皮肤的哦! 很有效果都是简单的调用一下方法就实现了 很实用哦!
lhgdialog有多个版本, 我这个例子主要实现 1、框架中使用lhgdialog 2、弹出窗口关闭后回刷父窗口 3、一些例子 4、一些皮肤
您可以对 lhgDialog 进行修改和美化,可以去除 lhgDialog 版权注释或改变程序名称,无需公开您修改或美化过的 lhgDialog 程序与界面。 商业授权每个公司只需要购买一次,而不限制产品域名。适用于 lhgDialog 现有...
lhgdialog v3.1.2 弹出窗口插件代码全部重构,整个插件只使用了一个lhgdialog.js核心文件,代码更加精减,规范。主库lhgcore.min.js也做了很多优化,效率更高,插件的代码也做了很多优化,效率也更高,由于代码全部...