I am facing issue with opening a custom portlet in popup window.
Below is the code of opening popup.
LiferayPortletURL documentLibURL = PortletURLFactoryUtil.create(request, "portlet name with WAR name", themeDisplay.getPlid(), PortletRequest.RENDER_PHASE);
documentLibURL.setWindowState(LiferayWindowState.POP_UP);
documentLibURL.setPortletMode(PortletMode.VIEW);
AUI().use('aui-dialog', 'aui-io', 'event', 'event-custom', function(A) {
var dialog = new A.Dialog({
width: 800,
height: 500,
title: 'Popup Title',
centered: true,
draggable: true,
modal: true
}).plug(A.Plugin.IO, {uri: '<%= documentLibURL.toString() %>'}).render();
dialog.show();
});
When my portlet is not having any call to local services, portlet is being rendered in popup. But after adding some complex code. Portlet is giving permission error.
"You do not have the roles required to access this portlet."
1) I have also added true in liferay-portlet.xml.
2) I have assigned permissions to guest user for view from control panel.
Please let me know if any changes requires.
Thanks in advance
Local service calls will never generate a permission exception (PrincipalException) but remove services will.
Audit your code that this URL will invoke and see if there are any remove service calls. They are easily distinguished. For example, if it is the User service you're working with a call to UserLocalServiceUtil will never throw a PrincipalException but a call to UserServiceUtil will. Check to see what calls you're making to *ServiceUtil and ensure the user performing the operation has sufficient access.
Which version of liferay your using.
The dialog will not work in liferay 6.2 and also maybe in 6.1, refer the below code.
function popup(url){
AUI().ready(function(A) {
AUI().use('aui-base', function(A) {
Liferay.Util.Window.getWindow(
{
title : "Popup Tile",
uri: url,
dialog: {
cache: false,
modal: true
}
}
).on('hide', function() {
console.log("Modal closed")});
});
});
}
if its correct dont forget to mark it as an answer
just add in your portal-ext.properties the following code and restart the server
layout.show.portlet.access.denied=false
Related
I need to add a popup modal to one of the webpart page in our sharepoint 2013 environment as an important notice, it works well when I sign in with the Admin account only, But not with other accounts, can anyone help me out?
Here is the javascript that I have:
_spBodyOnLoadFunctionNames.push('showPopup');
function showPopup() {
var options = {
url: myurl + '?IsDlg=1',
tite: ' Important Notice',
allowMaximize: false,
showClose: true,
width: 800,
height: 600
};
I have a dialog in my portal which opens a portlet. When I click on the link and the dialog opens, the dialog shows
You do not have the roles required to access this portlet.
However, if I add the same portlet on the page, the portlet opens without any hitch, both on the page and the dialog. What am I missing here? Anybody got any idea ?
My Codes are :
#set ($profile_url = $portletURLFactory.create($request, "profile_WAR_profileportlet", $getterUtil.getLong($plid), "RENDER_PHASE"))
$profile_url.setParameter("p_p_state", "exclusive")
Profile
window,
'openDialog', //function name
function(url, popupID, wd, ht) { // parameters to the function
var A = AUI();
popupDialog = new A.Dialog({
id: popupID, // popupId passed so that it would be easy to close it through events other than the close button
centered: false, // all the different parameters function you can check in the Alloy API
draggable: true,
resizable: false,
width: wd,
stack: true,
modal: true,
height: ht,
scrollbars: true,
xy: [getWidth()/2-wd/2,10]
}
).plug(
A.Plugin.IO,
{
uri: url
}
);
popupDialog.render();
},
['aui-dialog','aui-dialog-iframe']
);
Thanks in advance for any help that anyone can provide.
I think you are missing the following configuration in the liferay-portlet.xml of the profile_WAR_profileportlet portlet:
<add-default-resource>true</add-default-resource>
This should be set to true for the portlet which is accessed inside the dialog pop-up, here is the documentation for this element.
For more information you can look at this answer the points 4 & 5 of the answer would be of help to you.
Could it be that you're setting $profile_url but actually open the dialog on $preferences_url? I guess that the preferences_url has been defined earlier - and preferences (e.g. portlet edit mode) typically require more permissions than just the regular render phase. Crosscheck by accessing this as administrator..
Add the below two lines in your portal-ext.properties file
portlet.add.default.resource.check.enabled=true
portlet.add.default.resource.check.whitelist=3,56_INSTANCE_0000,58,82,86,103,113,145,164,166,170,33,---here append the portlet id which you want to display
I have a JQuery Modal Form and when i add the submit event, it cannot display as dialog but rather than embedded into browser window. If I uncomment the click event below, it will embedded into browser window rather than show as dialog.
$(document).ready(function(){
//$("#moveTicketBtn").click() {
// $("#moveUnknownTicket").submit();
//};
$("#moveUnknownTicketDialog").dialog(
{
title: "Move Unknown Ticket",
autoOpen: true,
modal: true,
resizable: true,
stack: true,
width: 500,
height: 350
});
});
Does anyone have any idea why it is like this? Please help. Thanks.
EDIT Question:
I have a form inside this dialog and upon submission(onsubmit, onblur) the javascript is not called. What is the reason?
try
$("#moveTicketBtn").click(function() {
$("#moveUnknownTicket").submit();
});
you have to insert your function within the () of the click event.
more information here: http://api.jquery.com/click/
That should do the trick:
http://jsfiddle.net/uQCKJ/
As you can see the form is submitted, since the alert box is triggered
$("#moveTicketBtn").click(function() {
$("#moveUnknownTicket").submit();
});
I have put submit inside click function though works great.
I am calling SP.UI.ModalDialog.showModalDialog() in a javascript function of my Web Part (SharePoint 2010) but the dialog appears for one second, then closes itself.
Originally, I wanted to call a sharepoint page (in Layouts folder) but I am testing with a simple dialog to make sure it isn't an error in my sharepoint page.
In the Web Part, I have a table where each first cell row is a LinkButton. I have set the OnClientClick to call a javascript function :
linkButton.OnClientClick = string.Format("OpenNotationCurveDialog('{0}');",
notation.code);
In the script block of the web part ASCX, I have :
function OpenNotationCurveDialog(notationCode) {
var htmlElement = document.createElement('p');
var helloWorldNode = document.createTextNode('Hello world!');
htmlElement.appendChild(helloWorldNode);
var options = {
title: "Add item",
allowMaximize: true,
showClose: true,
width: 800,
height: 600,
html: htmlElement,
dialogReturnValueCallback: CurveDialog_ClosedCallback
};
SP.UI.ModalDialog.showModalDialog(options);
return false;
}
function CurveDialog_ClosedCallback(result, value) {
console.log('!! CurveDialog_ClosedCallback !!');
}
The function CurveDialog_ClosedCallback is never called.
In the same Web Part, I have added an element to the Web Part menu that calls the javascript function SP.UI.ModalDialog.showModalDialog() : it is working perfectly. I don't understand why it is working when calling showModalDialog() from the menu and not working from the LinkButton client event.
Any idea how to solve this very annoying behavior ?
thx
What probably happens is that the linkbutton performs a postback so that the page reloads, causing the dialog to disappear Try using a simple anchor-tag instead.
I have a page hosted in 'virtualcasa1' domain opening a modal dialog:
var options = {
title: "Repro",
width: 400,
height: 600,
url: http://domain2:999/sites/blank/_layouts/XDomainTest/XDomainTestTarget.aspx //[1]
//url: http://virtualcasa1/sites/blank/_layouts/XDomainTest/XDomainTestTarget.aspx [2]
};
SP.UI.ModalDialog.showModalDialog(options);
And I have this code to close it:
alert(document.domain);
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel, 'Cancelled clicked');
If both are in the same domain (case [2] above), the dialog closes well, no issues.
But - if target page hosted in the dialog (case [1] above), dialog does NOT close :-(
document.domain above shows the correct domain where page exists.
I suspect I'm facing a cross-domain issue here (duh), but how to fix it? Or am I wrong and issue is not XDomain-related?
Thanks much!
HTML5's postMessage is your answer.
https://developer.mozilla.org/en-US/docs/Web/API/Window.postMessage
Your parent window that initiates the dialog must have the following javascript:
function listener(event) {
//alert(event.data);
if (event.data == 'Cancel') {
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.cancel, 'Cancel clicked');
}
else {
SP.UI.ModalDialog.commonModalDialogClose(SP.UI.DialogResult.OK, event.data);
}
}
if (window.addEventListener) {
addEventListener("message", listener, false)
} else {
attachEvent("onmessage", listener)
}
Javascript for OK and Cancel buttons in your popup:
<input type="button" value="OK" onclick="parent.postMessage('Message to be displayed by the parent', '*');" class="ms-ButtonHeightWidth" />
<input type="button" value="Cancel" onclick="parent.postMessage('Cancel', '*');" class="ms-ButtonHeightWidth" />
Ajay's answer from the 1st of August 2014 is good, but it needs a bit more explanation. The reason for the failure to close the dialog is simple. Cross site scripting security features of modern browsers disallow a few things, one of which is the use of window.frameElement from within the framed window. This is a read-only property on the window object and it becomes set to null (or with IE, it actually throws an exception when you try to access it). The ordinary Cancel event handlers in the modal dialog conclude with a call to window.frameElement.cancelPopup(). This will fail of course. The ordinary Save handler where the Save worked on the server side results in SharePoint sending back a single line as the replacement document, which is a scriptlet to call window.frameElement.commitPopup(). This also will not work, and it's a real pain to overcome because the page has been reloaded and there is no script available to handle anything. XSS won't give us access to the framed DOM from the calling page.
In order to make a cross domain hosted form work seamlessly, you need to add script to both the page that opens the dialog and the framed page. In the page that opens the dialog, you set the message listener as suggested by Ajay. In the framed form page, you need something like below:
(function() {
$(document).ready(function() {
var frameElement = null;
// Try/catch to overcome IE Access Denied exception on window.frameElement
try {
frameElement = window.frameElement;
} catch (Exception) {}
// Determine that the page is hosted in a dialog from a different domain
if (window.parent && !frameElement) {
// Set the correct height for #s4-workspace
var frameHeight = $(window).height();
var ribbonHeight = $('#s4-ribbonrow').height();
$('#s4-workspace').height(frameHeight - ribbonHeight);
// Finds the Save and Cancel buttons and hijacks the onclick
function applyClickHandlers(theDocument) {
$(theDocument).find('input[value="Cancel"]').removeAttr('onclick').on('click', doTheClose);
$(theDocument).find('a[id="Ribbon.ListForm.Edit.Commit.Cancel-Large"]').removeAttr('onclick').removeAttr('href').on('click', doTheClose);
$(theDocument).find('input[value="Save"]').removeAttr('onclick').on('click', doTheCommit);
$(theDocument).find('a[id="Ribbon.ListForm.Edit.Commit.Publish-Large"]').removeAttr('onclick').removeAttr('href').on('click', doTheCommit);
}
// Function to perform onclick for Cancel
function doTheClose(evt) {
evt.preventDefault();
parent.postMessage('Cancel', '*');
}
// Function to perform onclick for Save
function doTheCommit(evt) {
evt.preventDefault();
if (!PreSaveItem()) return false;
var targetName = $('input[value="Save"]').attr('name');
var oldOnSubmit = WebForm_OnSubmit;
WebForm_OnSubmit = function() {
var retVal = oldOnSubmit.call(this);
if (retVal) {
var theForm = $('#aspnetForm');
// not sure whether following line is needed,
// but doesn't hurt
$('#__EVENTTARGET').val(targetName);
var formData = new FormData(theForm[0]);
$.ajax(
{
url: theForm.attr('action'),
data: formData,
cache: false,
contentType: false,
processData: false,
method: 'POST',
type: 'POST', // For jQuery < 1.9
success: function(data, status, transport) {
console.log(arguments);
// hijack the response if it's just script to
// commit the popup (which will break)
if (data.startsWith('<script') &&
data.indexOf('.commitPopup()') > -1)
{
parent.postMessage('OK', '*');
return;
}
// popup not being committed, so actually
// submit the form and replace the page.
theForm.submit();
}
}).fail(function() {
console.log('Ajax post failed.');
console.log(arguments);
});
}
return false;
}
WebForm_DoPostBackWithOptions(
new WebForm_PostBackOptions(targetName,
"",
true,
"",
"",
false,
true)
);
WebForm_OnSubmit = oldOnSubmit;
}
applyClickHandlers(document);
}
});
})();
This solution makes use of the jQuery library, which our organization uses extensively. It is our preferred framework (chosen by me). I'm sure someone very clever could rewrite this without that dependency, but this is a good starting point. I hope someone finds it useful, as it represents a good two days work. Some things to note:
SharePoint does a postback on all sorts of events on the page, including putting the page into edit mode. Because of this, it makes more sense to trap the specific button clicks, both on the form and in the ribbon, rather than wholesale redefinition of, for example, the global WebForm_OnSubmit function. We briefly override that on a Save click and then set it back.
On any Save click event, we defeat the normal posting of the form and replace that with an identical POST request using AJAX. This allows us to discard the returned scriptlet when the form was successfully posted. When the form submission was not successful, perhaps because of blank required values, we just post the form properly to allow the page to be updated. This is fine, since the form will not have been processed. An earlier version of this solution took the resulting HTML document and replaced all of the page contents, but Internet Explorer doesn't like this.
The FormData api allows us to post the form as multipart-mime. This api has at least basic support in all modern browsers, and there are workarounds for older ones.
Another thing that seems to fail in the cross domain hosted dialog is the scrolling of the content window. For whatever reason, the height is not set correctly on the div with id s4-workspace, so we also set that in the solution.
EDIT:
Almost forgot. You may also need to add this control to your framed ASPX page, which can be done with SharePoint Designer:
<WebPartPages:AllowFraming runat="server"/>
I have exactly the same issue - a dialog opening a view page for an item works fine when opened from a site collection on the same web app/domain, but the Close button fails to work when opening the same item from a site collection hosted in a separate web application. I'm assuming it is a cross-domain thing so I've altered the solution to accomodate this restriction, however, I'm not 100% happy about it as it does make the overall solution a little awkward to use from a user-perspective. I've put the issue to one side for now due to project timescales, but I'm still curious as to why. The only things I can think of is the whole cross-domain thing causing it and that maybe it is there by design to prevent XSS security holes.