Pages

Monday, August 31, 2009

Open popup window in liferay

I have a situation - where i need to display the playlists of videos in a portlet, whenever the user clicks on the playlist it should open the popup, in that we need to run the video.

For this i used the Add application window as it is.

after login we will use add application option for adding our own portlets, yes That POP UP only.

To use this we need to use liferay theme objects

Step 1- <%@ taglib uri="http://liferay.com/tld/theme" prefix="liferay-theme" %>
-lt- liferay-theme:defineObjects / -gt-

Step 2 - script type="text/javascript"
src="<%=themeDisplay.getPathJavaScript()%>/jquery/ui.dialog.js"

Step 3 -jQuery.noConflict();
jQuery(document).ready(
function()
{
// jQuery("#ayudaCertificados").dialog({ width: 450, height: 400, modal: true,
autoOpen: true});
}
);

Step 4 - Write the following javascript functions in script tag

buttonClicked(title,content) {
// alert(" om sai ram 1");
var playerText="content";
title = ""+title+"";
callAjax(playerText);
jQuery("#myDiv").dialog({
width: 830,
height:470,
modal: true,
autoOpen: true,
closeOnEscape:true,
title:title,
resizable:false
});
// alert(" om sai ram 2");
}
function callAjax(content){
document.getElementById("myDiv").innerHTML = content;
}


Step 5 - Now difine one empty div tag in your jsp file with ID name "myDiv"( you can change
it).
eg: -lt- div id="myDiv"-gt- -lt- /div -gt-

Step 6 - Now the important code which shows pop up window.
write an anchor tag and call the above defined function ( buttonClicked(title,content) )
on onclick function like...

a href="#" onclick="buttonClicked(title,content) "

supply the necessary parameters title and content as per your requirement.

No comments:

Post a Comment