« Back

Opening a portlet in dialog from web content

Company Blogs August 11, 2011 By Ray Augé Staff

Recently I was asked how to do this! Well, it's rather simple (providing you understand the limitations of accessing portlets without permission, and portlets that are not allowed to be loaded dynamically; a.k.a. add-default-resource, and so on).

Here goes!

First I created a simple web content structure/type with the following definition:

<root>
    <dynamic-element name='portlet-id' type='text' index-type='' repeatable='false'></dynamic-element>  
    <dynamic-element name='parameters' type='text' index-type='' repeatable='true'>         
        <dynamic-element name='value' type='text' index-type='' repeatable='false'></dynamic-element>
    </dynamic-element>
</root>

Then I created the following web content template:

 

<script type="text/javascript" charset="utf-8">
    AUI().ready('aui-dialog','aui-dialog-iframe','liferay-portlet-url', function(A) {
        var url = Liferay.PortletURL.createRenderURL();
        url.setPortletId("${portlet-id.data}");
        url.setWindowState('pop_up'); 

        #foreach ($parameter IN $parameters.getSiblings())
            url.setParameter("${parameter.data}", "${parameter.value.data}");
        #end  

        window.myDialog = new A.Dialog(
            {
                title: 'My Dialog',
                width: 640,
                centered: true
            }
        ).plug(
            A.Plugin.DialogIframe,
            {
                uri: url.toString(),
                iframeCssClass: 'dialog-iframe'
            }
        ).render();
    });
 </script>

 

As you can see there is a place for setting the portletId to craete an URL for, as well as a repeated section for assigning parameters to the url.

Creating an article with the Portlet Id value of 3 results in a dialog opening with the search portlet.

 

You can expand this simple example into whatever you like. The Alloy Dialog plugin is very rich and the Liferay.PortletURL library provides a complete API for creating all of the PortletURL types defined by the portlet spec.

 

Enjoy!

Threaded Replies Author Date
[...] Take a look at this new entry blog, it... Anonymous August 11, 2011 11:24 PM
toolbox.add(this); Very nice - thanks! Olaf Kock August 12, 2011 12:56 AM
A shame it does not work when you use https. ... Jelmer Kuperus August 12, 2011 2:43 AM
Done!... Ray Augé August 12, 2011 7:52 AM
sweet! thanks Jelmer Kuperus August 12, 2011 9:23 AM
Hi, I’m getting an ugly “Java null pointer... praveen orvakanti August 12, 2011 9:28 AM
[...] Hello, I just built a pop-up dialog using... Anonymous January 17, 2012 2:29 AM
Hi all, Where could I found API doc about... Enrique Ruiz (DiSiD) February 10, 2012 12:54 AM
As far as I can tell that is still in the "to... Ray Augé February 13, 2012 6:18 AM
Hio, i try to do the same thing but I just want... Jean-Christophe Constantin March 12, 2012 7:20 AM
Try this portletId instead "56_INSTANCE_0000".... Ray Augé March 12, 2012 7:27 AM
thanks Ray but where do i modify these... Jean-Christophe Constantin March 12, 2012 8:30 AM
Change the portletId in your code, and the... Ray Augé March 12, 2012 8:33 AM
i set this in porta-ext.properties :... Jean-Christophe Constantin March 12, 2012 9:16 AM
It looks fishy! Try setting the portlet mode... Ray Augé March 12, 2012 9:24 AM
nothing's better. Maybe it's a problem of... Jean-Christophe Constantin March 12, 2012 9:33 AM
i've the solution. Summarizing then, with... Jean-Christophe Constantin March 13, 2012 2:43 AM

[...] Take a look at this new entry blog, it could help you. http://www.liferay.com/es/web/raymond.auge/blog/-/blogs/10429321 Marcar como respuesta [...] Read More
Posted on 8/11/11 11:24 PM.
toolbox.add(this);
Very nice - thanks!
Posted on 8/12/11 12:56 AM.
A shame it does not work when you use https.

How about applying my fix from : http://issues.liferay.com/browse/LPS-14965

(pretty please)
Posted on 8/12/11 2:43 AM.
Done! https://github.com/brianchandotcom/liferay-portal/pull/882
Posted on 8/12/11 7:52 AM in reply to jelmer kuperus.
sweet! thanks
Posted on 8/12/11 9:23 AM.
Hi,
I’m getting an ugly “Java null pointer exception” when I try to run Social Office on MySQL. I have tried to find the solution online but there is not much help out there. I have even posted in one of the forums, but there’s been no response in the last two days.

I know that this is not the right place for this question, but i had no other solution. So im just asking everyone who is involved with Social Office at some point or the other.

I’m posting a few excerpts from the log file here. Please let me know if you can suggest me some workaround for this error.

Error Log:

Aug 12, 2011 12:26:31 PM org.apache.tomcat.util.net.NioEndpoint setSocketOptions
SEVERE:
java.lang.NullPointerException
at org.apache.tomcat.util.net.NioEndpoint.setSocketOptions(NioEndpoint.java:1011)
at­ org.apache.tomcat.util.net.NioEndpoint$Acceptor.run(NioEndpoint.java:1204)
at java.lang.Thread.run(Thread.java:595)


Caused by: java.lang.NullPointerException
at com.liferay.so.hook.events.ServicePreAction.run(ServicePreAction.java:98)
at com.liferay.portal.kernel.events.InvokerAction.run(InvokerAction.java:51)
at com.liferay.portal.events.EventsProcessorImpl.processEvent(EventsProcessorImpl.j­­ava:91)
... 74 more

12:28:53,515 ERROR [jsp:?] User ID 10160
12:28:53,515 ERROR [jsp:?] Current URL /web/admin/home
12:28:53,515 ERROR [jsp:?] Referer null
12:28:53,515 ERROR [jsp:?] Remote address 127.0.0.1
12:28:53,515 ERROR [jsp:?] com.liferay.portal.kernel.events.ActionException: java.lang.NullPointerException
com.liferay.portal.kernel.events.ActionException: java.lang.NullPointerException
at com.liferay.portal.events.ServicePreAction.run(ServicePreAction.java:150)
at com.liferay.portal.events.EventsProcessorImpl.processEvent(EventsProcessorImpl.j­­ava:91)
at com.liferay.portal.events.EventsProcessorImpl.process(EventsProcessorImpl.java:6­­8)
at com.liferay.portal.events.EventsProcessorUtil.process(EventsProcessorUtil.java:6­­3)
at com.liferay.portal.servlet.MainServlet.service(MainServlet.java:800)
at javax.servlet.http.HttpServlet.service(HttpServlet.java:717)
at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilt­­erChain.java:290
at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.­­java:206)
at com.liferay.portal.kernel.servlet.BaseFilter.processFilter(BaseFilter.java:173)
a­t com.liferay.portal.kernel.servlet.BaseFilter.doFilter(BaseFilter.java:103)
Posted on 8/12/11 9:28 AM.
[...] Hello, I just built a pop-up dialog using the technique described here: http://www.liferay.com/es/web/raymond.auge/blog/-/blogs/10429321, and I was wondering how to access the A.Dialog object from... [...] Read More
Posted on 1/17/12 2:29 AM.
Hi all,

Where could I found API doc about Liferay, PortletURL objects?

Thanks
Posted on 2/10/12 12:54 AM.
As far as I can tell that is still in the "to be documented" queue.

Here is the link to the js source though: https://github.com/liferay/liferay-portal/blob/master/portal-web/docroot/html/js­/liferay/portlet_url.js
Posted on 2/13/12 6:18 AM in reply to Enrique Ruiz (DiSiD).
Hio, i try to do the same thing but I just want to display 'Article' in popup. I wrote something like that :

var url = Lifer­ay.PortletURL.createRenderURL();
url.setPortletId('56');
url.setWindowStat­e('pop_up');
url.setParameter("struts_action", "/journal/view_article");
url.setParameter("groupId","18");
­ url.setParameter("articleId","10460");
url.setParameter("version","1.0");

Only­ this message in the popup :
"Portlet is temporarily unavailable. "

anyone could help me, please?
Posted on 3/12/12 7:20 AM in reply to Ray Augé.
Try this portletId instead "56_INSTANCE_0000". That ID is whitelisted and should allow you to open this portlet dynamically.

Note that for security reasons most portlets have to be added to the resource check whitelist (portlet.add.default.resource.check.whitelist) before they allow you to open them dynamically otherwise any enterprising hacker could open any portlet in the system using javascript in a browser's scripting console.
Posted on 3/12/12 7:27 AM in reply to Jean-Christophe Constantin.
thanks Ray but where do i modify these properties? In portal-ext.properties?
Posted on 3/12/12 8:30 AM in reply to Ray Augé.
Change the portletId in your code, and the whitelist in portal-ext.properties.

Make sure to "append", new values to the defaults of the property. The defaults for 6.1 are here: https://github.com/liferay/liferay-portal/blob/6.1.x/portal-impl/src/portal.prop­erties#L467
Posted on 3/12/12 8:33 AM in reply to Jean-Christophe Constantin.
i set this in porta-ext.properties :
portlet.add.default.resource.check.enabled=true
portlet.add.default.resource.che­ck.whitelist=58,56_INSTANCE_0000,86,87,88,103,113,145
and now there's no longer ""Portlet is temporarily unavailable. " but popur is clear.

in my console :
16:11:39,459 ERROR [RequestProcessor:676] Invalid path was requested /journal/view_article
16:11:39,459 ERROR [PortletRequestProcessor:363] User ID null
16:11:39,459 ERROR [PortletRequestProcessor:364] Current URL /en/zoltan?p_p_id=56_INSTANCE_0000&p_p_
lifecycle=0&p_p_state=pop_up&_56_INSTANCE­_0000_groupId=18&_56_INSTANCE_0000_struts_action=%2Fjournal
%2Fview_article&_56_I­NSTANCE_0000_articleId=10460&_56_INSTANCE_0000_version=1.0
16:11:39,459 ERROR [PortletRequestProcessor:365] Referer http://localhost:8080/en/web/guest/zoltan
16:11:39,459 ERROR [PortletRequestProcessor:366] Remote address 127.0.0.1
16:11:39,459 ERROR [PortletRequestProcessor:368] Invalid path was requested /journal/view_article
Posted on 3/12/12 9:16 AM in reply to Ray Augé.
It looks fishy! Try setting the portlet mode (to "view").
Posted on 3/12/12 9:24 AM in reply to Jean-Christophe Constantin.
nothing's better. Maybe it's a problem of struts path. In my liferay-portlet.xml :
<portlet>
<portlet-name>56</portlet-name>
<icon>/html/icons/journal_content­.png</icon>
<struts-path>journal_content</struts-path>
......
Posted on 3/12/12 9:33 AM in reply to Ray Augé.
i've the solution.

Summarizing then, with Liferay 6.0.6 CE :

url.setPortletId('56_INSTANCE_0000');
url.setWindowState('pop_up');
url.setParame­ter("struts_action", "/journal_content/view");
url.setParameter("groupId","18");
url.setParamete­r("articleId","17106");

My mistake was on the struts_action path. Look at liferay-portlet.xml and struts-config.xml. It's very important not to forget te "groupId". For "whitelist", see above. And thanks to Ray for his help.
Posted on 3/13/12 2:43 AM in reply to Jean-Christophe Constantin.