记录一次 Liferay 7.X 中弹出窗口的简单使用

本文介绍了如何在Liferay 7.X环境中利用内置的Util.openWindow方法创建、配置和操作弹出窗口,包括设置标题、内容、尺寸、模态属性及自定义工具栏。涵盖了从基本调用到高级配置的详细示例。
摘要由CSDN通过智能技术生成

Liferay 7.X中已经帮我们封装好了,我们直接调用就行了,这里介绍下一些参数使用(只限于我使用过的肯定不全面)。

JS调用
    打开窗口使用Liferay.Util.openWindow方法
    例子:

//弹窗直接打开URL,无参数
		Liferay.Util.openWindow({uri:'/'});
		//弹窗内容使用静态HTML
		Liferay.Util.openWindow({
			dialog: {
				bodyContent:'html代码'
			}
		});
		//部分配置信息
		Liferay.Util.openWindow({
				id: 'myWin',													//弹出框ID
				title: '弹出框标题',											//弹出框标题
				dialog: {				
					cssClass: '',												//弹出框窗体增加的class
					after: {				
						destroy: function(event) {								//窗口销毁后执行
							           				
	                	}				
	                },				
	                bodyContent:'html代码',										//窗口显示的内容,支持html
	                destroyOnHide: true,										//窗口销毁后是否移除DOM元素,默认:false
	                width:500,													//窗口宽度
	                height:350,													//窗口高度
	                modal: true,												//是否是模态窗口
	                resizable: false,											//是否可以改变大小
	                toolbars: {													//工具栏
	                    footer: [												//工具栏底部,可增加按钮
	                        {
	                            cssClass: 'btn-primary',						//添加到按钮上的class
	                            label: '确定',									//按钮文本,支持国际化,如:Liferay.Language.get('enter')
	                            on: {
	                                click: function() {							//点击按钮方法
	                                    Liferay.Util.getWindow('myWin').hide(); //关闭按钮的方法
	                                }
	                            }
	                        },
	                        {
	                            cssClass: 'btn-danger',							//添加到按钮上的class
	                            label: "取消",									//按钮文本,支持国际化,如:Liferay.Language.get('cancel')
	                            on: {
	                                click: function() {							//点击按钮方法
	                                    Liferay.Util.getWindow('myWin').hide(); //关闭按钮的方法
	                                }
	                            }
	                        }
	                    ]
	                },
	                on:{
	                    init:function(){
							//弹出框初始化方法
	                    },
	                    destroy:function(){
							//弹出框销毁方法
						}
					}
				}
	    	},
		    function(dialogWindow) {
		        //这里也可以初始化弹出框的内容,非URL加载的情况下
		        //var html='';
		        //dialogWindow.bodyNode.append(html);
		    }
		);

    获取窗口使用Liferay.Util.getWindow方法
    例子:

//隐藏弹出框
Liferay.Util.getWindow('tan').hide();
//显示弹出框,前提destroyOnHide: false
Liferay.Util.getWindow('tan').show();

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Dengrz

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值