AJAX call in portlet configuration pop-up window

[Martin Pasko, modificado hace 8 años.]

Hi, is it possible to use AJAX in configuration mode?

I am using custom class extending DefaultConfigurationAction to customize my portlet in the configuration mode. I override processAction and render methods, which work OK, but when I try to implement serveResource method, it is never called (returned status is 200 OK, but no data is fetched and no debug message is printed to the Liferay console).

My code for serveResource method:

public class TestConfigurationController extends DefaultConfigurationAction {
...
    @Override
    public void serveResource(PortletConfig portletConfig, ResourceRequest resourceRequest,
            ResourceResponse resourceResponse) throws PortletException, IOException, Exception {
        String resourceID = resourceRequest.getResourceID();
        System.out.println("Resource id=" + resourceID
                + " in TestConfigurationController.serveResource().");         // this message never prints, method is not invoked
        if (IMG_EDIT_ADD_NEW.equals(resourceID)) {
            // more code
            include(EDIT_NEW_IMAGE, context, resourceRequest, resourceResponse);    // uses PortletRequestDispatcher, returns a JSPF fragment
        } else {
            super.serveResource(portletConfig, resourceRequest, resourceResponse);
        }
    }
}

I tried all options on the JS side, including both JQuery and AUI. Here is relevant code in configuration.jsp:

<!-- before is a form with an actionURL, which is working fine -->
<portlet:resourceurl var="newImageJsp" id="<%=IMG_EDIT_ADD_NEW%>">
</portlet:resourceurl>
<!--i tried also liferay-portlet:resourceURL-->
&lt;%--<liferay-portlet:resourceurl portletconfiguration="true" var="newImageJsp1"></liferay-portlet:resourceurl>--%&gt;

<aui:button name="addNewImage" type="button" value="${addImage}" />
<div id="<portlet:namespace/>newImageContainer">
    <aui:field-wrapper name="newImageContainer" label="${addImage}">
    </aui:field-wrapper>
</div>

<script type="text/javascript" charset="utf-8">
// Even this simple AUI AJAX call does not trigger serveResource method!

//    AUI().ready('aui-base', 'aui-module', 'node', 'aui-io-request', function (A) {
//        A.io.request('<%=newImageJsp1.toString()%>');
//    });

    jQuery(document).ready(function () {
        jQuery('#<portlet:namespace/>addNewImage').on('click', function (event) {
            console.log('addNewImage clicked, url: ${newImageJsp}');                   // returns correct url
            jQuery.ajax({
                dataType: 'text',
                url: '${newImageJsp}',
                success: function (data, status) {
                    console.log('returned resource: ' + data);          // returns empty string
                    console.log('returned status: ' + status);            // returns 200 OK, which is also in the Firebunetwork panel
                    $('#<portlet:namespace/>newImageContainer').html(data);
                }
            });
            return false;
        });
    });
</script>

Debugging in console revealed, JS is working fine, function was called and returned status was 200 OK. However, returned data was empty and serveResource method on the server was never called.

As an experiment, I also tried to set

<aui:form action="${newImageJsp}" method="get" name="fm1"></aui:form>

which didn't call the serveResource method either, instead, it returned the view.jsp of the configured portlet.

And finally my configuration, which is exactly as in this working case:

portlet.xml:

<portlet>
		<portlet-name>test-portlet</portlet-name>
		<portlet-class>org.springframework.web.portlet.DispatcherPortlet</portlet-class>
		<init-param>
			<name>contextConfigLocation</name>
			<value>/WEB-INF/spring-context/portlet/test-portlet.xml</value>
                </init-param>
                <init-param>
                    <name>config-template</name>
                    <value>/WEB-INF/jsp/carousel/configuration.jsp</value>
                </init-param>
		<expiration-cache>0</expiration-cache>
		<supports>
			<mime-type>text/html</mime-type>
                        <portlet-mode>view</portlet-mode>
                        <portlet-mode>edit</portlet-mode>
		</supports>
		<portlet-info>
			<title>Test</title>
		</portlet-info>
	</portlet>

and liferay-portlet.xml:

<liferay-portlet-app>
	<portlet>
		<portlet-name>test-portlet</portlet-name>
		<icon>/icon.png</icon>
                <configuration-action-class>com.test.TestConfigurationController</configuration-action-class>
                <requires-namespaced-parameters>false</requires-namespaced-parameters>
                <ajaxable>true</ajaxable>
		<header-portlet-css>/css/main.css</header-portlet-css>
                <header-portlet-javascript>/js/jquery-1.11.3.min.js</header-portlet-javascript>
		<header-portlet-javascript>/js/main.js</header-portlet-javascript>
	</portlet>
</liferay-portlet-app>

So, it seems I have the same problem, as here.

I was thinking, that maybe it is the window state? Configuration mode always uses 'pop-up', but in all examples I only found AJAX calls using 'normal' window state. Maybe that is the problem? Is it even possible to make asynchronous JSPF loadings in pop-up mode? And even in configuration window? I never found a working example of use of AJAX in configuration mode and official Liferay only has examples for view mode.

Last but not least, I tested the same code in view.jsp for view mode and the resource serving method in TestViewController was called OK. I used Spring annotations here (@ResourceMapping). So the problem must be with Liferay and configuration mode. A bug maybe?

Thank you!

[Tomas Polesovsky, modificado hace 8 años.]

Hi Martin,

it's a bug, I filled a ticket for it: LPS-61339

Try to use this workaround:
1, Implement serveResource in your portlet, not in the configuration action
2, Use <liferay-portlet:resourceURL portletName="${param.portletResource}" id="some-resource-id" /> inside the configuration JSP