Si la JSR 286 a ouvert la voie à l’introduction des mécanismes AJAX au sein des portlets via les ResourceURL, il existe finalement assez peu d’exemples disponibles à ce sujet sur le Web.
Cela s’explique essentiellement par la facilité de mise en oeuvre de cette solution. Preuve en est, ce petit exemple, vraiment pas bien méchant, qui mets à jour une date, après un appel serveur. Bien entendu, il est interdit de recharger entièrement la page du portail. Le développement est effectué à partir du template de portlet fournit par le Liferay Plugin SDK 5.2.2.
On commence par la partie la plus facile, l’implémentation de GenericPortlet :
@Override
public void serveResource(ResourceRequest request, ResourceResponse response)
throws PortletException, IOException {
Date date = new Date();
request.setAttribute("now", date);
include(viewJSP, request, response);
}
@Override
public void doView(RenderRequest renderRequest, RenderResponse renderResponse)
throws IOException, PortletException {
renderRequest.setAttribute("now", "No yet set");
include(viewJSP, renderRequest, renderResponse);
}
L’implémentation reste donc simplifiée à l’extrême :
- la phase render – méthode doView -, ajoute un attribut now dont la valeur est un message.
- la phase resource – méthode serverResource -, initialise ce même attribut à la date courante du serveur.
Ici, Quick & Dirty de rigueur, je demande le parsing complet de la ma JSP au niveau des 2 phases. C’est JQuery qui s’occupera d’injecter tout ce contenu dynamquement au niveau de l’arbre DOM de notre vue.
Il ne reste plus que notre fichier JSP, référencée par la variable viewJSP au niveau du code précédent. Ici également, rien d’exceptionnel…
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<portlet:defineObjects />
<div id="toBeUpdate">
<p>Click on refresh to update the date via AJAX</p>
<portlet:resourceURL var="resourceUrl"></portlet:resourceURL>
Date = ${now} | <button onclick="refresh()">Refresh</a>
</div>
<script language="JavaScript">
function refresh() {
var url = '${resourceUrl}';
jQuery('#toBeUpdate').load(url);
return false;
}
</script language>
JQuery mettra à jour le contenu lors du click utilisateur.
| Avant | Après |
|---|---|
|
|
|
Ensuite? Vous pouvez fermer votre navigateur et reprendre une activité normale.
