action URL By Java Script (AUI module – Liferay.PortletURL)

Liferay.PortletURL.createActionURL will be used in liferay to create action URL in Javascript. liferay-portlet-url module of AUI (a JavaScript framework) provides Liferay.PortletURL object which is used to create action URL in Javascript.
Liferay provides nice way (by Liferay.PortletURL.createActionURL) to create action URL in Javascript. Liferay (till liferay 6.2 version) ships with Java script framework called AUI (Alloy UI – AUI is a modular framework and provides various modules to create components in Java script. In this article, I will be showing you how to create action URL in Javascript.

First you need to create LiferayMVC portlet with plugin project name as actionURL-by-JavaScript and -portlet will be appended by Liferay IDE while creating Liferay plugin project. Give portlet class as com.opensource.techblog.portlet.ActionURLByJavaScriptPortletThe project structure should look like below screenshot.
Liferay.PortletURL.createActionURL - Project structure

Adding Action method in Portlet

Add the following code in class.

package com.opensource.techblog.portlet;


import javax.portlet.ActionRequest;
import javax.portlet.ActionResponse;
import javax.portlet.PortletException;
import javax.portlet.ProcessAction;

import com.liferay.portal.kernel.exception.PortalException;
import com.liferay.portal.kernel.exception.SystemException;
import com.liferay.portal.kernel.log.Log;
import com.liferay.portal.kernel.log.LogFactoryUtil;
import com.liferay.portal.kernel.util.ParamUtil;
import com.liferay.util.bridges.mvc.MVCPortlet;

public class ActionURLByJavaScriptPortlet extends MVCPortlet {

	//define log for this class
	private static final Log _log = LogFactoryUtil.getLog(ActionURLByJavaScriptPortlet.class.getName());

	public void actionMethodByJavaApi(ActionRequest request, ActionResponse response)
			throws IOException, PortletException, PortalException, SystemException{
		String sampleParam = ParamUtil.get(request, "param", "defaultValue");"Sample Param is ::"+sampleParam);


  • I have added one action method. This method will be called when the user clicks on the action URL in JSP.
  • While creating the action URL (By Javascript in JSP), I will pass one parameter which I am reading in this action method. ParamUtil is a convenient class provided by liferay which is used to read request parameters.
  • Note that since we want to just understand how action URL is generated, I haven’t override render() method but if you want, you can override render() method to place render logic.

action URL by Liferay.PortletURL.createActionURL  in view.jsp

To create portlet URL with AUI (javascript), we will use liferay-portlet-url module of AUI. With the help of this module, actionURL can be created by Liferay.PortletURL.createActionURL (calling createActionURL method of Liferay.PortletURL javascript object). 
Add following code in the view.jsp
<%@page import="com.liferay.portal.kernel.portlet.LiferayWindowState"%>
<%@page import="com.liferay.portal.kernel.portlet.LiferayPortletMode"%>
<%@ taglib uri="" prefix="portlet" %>
<%@ taglib uri="" prefix="aui" %>
<%@ taglib uri="" prefix="liferay-theme" %>

<portlet:defineObjects />

<a id="actionURLWithJS" href=""> This action URL link is created with Javascript</a>
AUI().use('liferay-portlet-url', function(A) {
var actionURL = Liferay.PortletURL.createActionURL();
actionURL.setWindowState("<%=LiferayWindowState.NORMAL.toString() %>");
actionURL.setPortletMode("<%=LiferayPortletMode.VIEW %>");
actionURL.setParameter("param","This value comes from Javascript");
actionURL.setPortletId("<%=themeDisplay.getPortletDisplay().getId() %>");"#actionURLWithJS").set('href',actionURL.toString());
alert("actionURL is ->"+actionURL.toString());


  • First few lines are imports and taglib definition.
    • liferay-theme and portlet taglibs are defined to place <liferay-theme:defineObjects/> and <portlet:defineObjects/> tags respectively.These tags are used to make portlet implicit and liferay implicit objects available in JSP.
    • aui taglib is used to define <aui:script> tag, were we placed AUI code.
  • Next, I have added a link. Note that I have intentionally kept href blank at this moment. We will construct action URL in AUI and then assign it to href with JavaScript code during page load.
  • <aui:script> tag is used to place all AUI code. This tag internally create <script> tag and make AUI core modules ( like node etc) ready to use.
  • In <aui:script>, the code is written like AUI().use(‘liferay-portlet-url’, function(A) {
    • AUI is modular framework. You must have to register the module first. AUI module can be registered by declaring it in AUI().use method. More than one modules can be declared by comma separate in AUI().use method.
    • In our case, ‘liferay-portlet-url‘ module will be used to create action URL so we have registered it in AUI.use method.
    • in callback function(A), we have created action URL with following JavaScript code.
      • var actionURL = Liferay.PortletURL.createActionURL();
    • Javascript variable Liferay.PortletURL provides various methods to create different kind of portletURL. Here we need to create action URL so we called createActionURL() method (ex. Liferay.PortletURL.createActionURL()). If you wish to create render URL in javascript, you need to call createRenderURL() method on Liferay.PortletURL object.
    • You can set window state and portlet mode by calling setWindowState and setPortletMode method respectively.
    • Additional parameters can be passed by calling setParameter method. I set one parameter called ‘javax.portlet.action’. This is required to call specific action method. To understand how the action method is called, you can refer my blog on creating action URL by portlet tag (portlet:actionURL).at the end, we set this action URL to href by following code
        • A in AUI is a placeholder to apply selector. it’s similar like $ in JQuery.
        • We passed #actionURLWithJs (id of link) to and then set its href value to generated action URL by actionURL.toString();
    • Just debug purpose, I kept alert at the last. (You may remove it)
    • If you wish this action URL points to different portlet, then you need to set target portlet’s portletId in generated action URL (in setPortletId method).
    • In this action URL, we have passed current portlet’s Id by calling themeDisplay.getPortletDisplay.getId() which returns current portlet’s Id. themeDisplay is liferay implicit object which is available by adding <liferay-theme:defineObjects/> tag.

Save view.jsp and re-deploy the portlet. Once the portlet is deployed, refresh the page. When you click on the link, the action method will be called and you will see the parameter that we set in actionURL will be printed in the server console.

Summing Up

  • action URL can be created in Javascript by AUI module ‘liferay-portlet-url’.
  • Liferay.PortletURL object is used to create action URL. You need to call createActionURL method on Liferay.PortletURL.(ex Liferay.PortletURL.createActionURL())
  • You can set portlet mode and window state while creating actionURL in Javascript.
  • You can pass the additional parameters by calling setParameter method on generated action URL.
  • actionURL is created by JavaScript on client-side. In some cases, due to security reasons, actionURL may not be having a hostname. Please refer to this link for more information.

Apart from Liferay.PortletURL.createActionURL, following are other possible ways to create action URL in Liferay

Download Source 
Download Source

Recommended For You

About the Author: Nilang

Nilang Patel is a technology evangelist who loves to spread knowledge and helping people in all possible ways. He is an author of two technical books - Java 9 Dependency and Spring 5.0 Projects.

8 Comments to “action URL By Java Script (AUI module – Liferay.PortletURL)”

  1. Thanks a lot for your tutos, o lot of useful information . But i tried to apply that on input text, to fire and actionURL when the value of this input change (onchange). But Really nothing happen.

    Is it possible to do that ?

    1. Hello Jami,

      Thanks for appreciation and welcome to Techblog. For your problem you can try following solution.

      1) first define your action url with tag.
      2) write jquery on click event handler like
      //Call action url here….
      where ${actiionUrl} is variable represent actionURL which you defined in

      Hope this helps you.


  2. Hello Nilang,

    Thank you for very helpful post. that I need to refer.

    I am finding a way for back button in liferay in order to it can show inputted values when I back to previous page.

    Can you please give any suggestion?

    Best regards,
    Hung Tra n

    1. Hello Hund Tran,

      Sorry for late respond, and thanks for the appreciation ..!!
      In you case, you can crate json of the input that you put in previous screen and when you back, just get that json and fill with values. However, if there are more pages to forward and back, the JSON would be bigger. Hope this help to sort out your issue.

      Feel free to ask questions / give suggestion


      1. Hello Nilang,

        Thank you very much for this suggestion, I will try with it.

        I really appreciate your suggestion and your post.

        Best regards,
        Hung Tran

  3. Thanks for this useful write-up. As an addition I’d like to share that you need the following Liferay property:
    in order to be allowed to invoke createURL.

    1. Hi Willem,

      Welcome to Tech blog and appreciate your valuable feedback. I will include this so other get benefited.


Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.