Change portlet mode and window state on the client side

The client side programming model allows us to handle portlet mode and window state changes entirely on the client, rather than requiring a full server-client roundtrip.

In client-side aggregation, we can provide an event handler for changes of portlet mode and portlet window state. This handler gets called when a mode change or a window state change is triggered.

This function is currently only supported in the portal CSA theme and the CSA skin. We can adapt the CSA theme and skin to write our own custom themes and skins to support this feature. The return value of your handler determines whether or not the default action is executed:

• A return value of true allows execution of the default action, in this case the portlet mode or window state change.

• A return value of false cancels the default action.

This allows the portlet to handle these changes entirely on the client, with no server interaction.

You define the change handlers as follows:

• To define a portlet mode change handler, define a JavaScript function with the name <portlet:namespace/>doPortletMode in your portlet.

• To define a portlet window state change handler, define a function with the name <portlet:namespace/>doWindowState.

The CSA skin checks whether such a function is defined before processing any portlet mode or window state changes. The handler function provides two arguments:

• The first argument is the required portlet mode or window state in string form.

• The second argument is the markup element that should be used to insert a mode specific markup. This argument is necessary to support the inline modes that you see in the CSA version of the IBM portal skin.

Refer to the following example:

<portlet:namespace/>doPortletMode( portletMode, div )
{     var retVal = true;
   if ( portletMode == ibm.portal.portlet.PortletMode.VIEW ) 
   {
      //do view mode here       
      div.innerHTML = “...some view mode markup...”;
      retVal = false;
   }
   return retVal;
   }

Parent: The client side portlet programming model
Related:
Get started with the client side programming model for portlets
Handling portlet preferences on the client
JavaScript namespacing - observing good practice