Capita spesso di dover realizzare applicazioni che espongono diverse funzionalità ed è possibile implementare diverse soluzioni, una di queste è quella di inserire ciascuna funzionalità all'interno di un tab diverso.

In questo articolo impareremo ad utilizzare nelle nostre pagine JSP i tab messi a disposizione dalle taglib di Liferay.

Innanzitutto prepariamo la pagina JSP principale, ossia tipicamente la pagina view.jsp; prima di vedere il codice precisiamo che ciascun tab sarà collegato ad una diversa pagina dell'applicazione raggiungibile cliccando sul tab stesso.

<%
// Valore del tab da preselezionare al caricamento della pagina
// Il nome di default del parametro utilizzato dalla taglib è "tabs1"
String currentTab = ParamUtil.getString(request, "tabs1", "tab1");
%>

<!-- Questo rappresenta il link associato ad ogni tab per caricare la pagina relativa -->
<liferay-portlet:renderURL var="changeTabURL" />

<!--
    Definizione dei tab da utilizzare; l'elenco dei nomi ha una molteplice funzionalità:
    definisce i tab da visualizzare, definisce le chiavi di traduzione dei tab e definisce
    i valori da confrontare con "currentTab". Inoltre viene specificata la URL da associare
    a ciascun tab
-->
<liferay-ui:tabs
    names="tab1,tab2,tab3"
    url="<%= changeTabURL %>"
/>

<!--
    A ciascun tab è associata una pagina differente e questa taglib consente di includere
    la pagina corretta a seconda del valore del parametro "currentTab"; per comodità tutte
    le pagine dei tab sono posizionate in una sottocartella apposita.
    Il parametro "servletContext" valorizzato ad "application" serve a stabilire che le pagine
    devono essere cercate nel contesto dell'applicazione corrente e non tra le pagine di portale
-->
<liferay-util:include
    page='<%= "/html/tab_sample/tabs/" + TextFormatter.format(currentTab, TextFormatter.N) + ".jsp" %>'
    servletContext="<%= application %>"
/>

Si legga l'articolo La classe TextFormatter per i dettagli sull'utilizzo della classe per generare il nome del file della pagina JSP da visualizzare.

Il lavoro è terminato, ora serve solo creare le pagine JSP relative ai singoli tab (che si devono quindi chiamare come i tab stessi), ossia:

• html/tab_sample/tabs/tab1.jsp;
• html/tab_sample/tabs/tab2.jsp;
• html/tab_sample/tabs/tab3.jsp.

Prima di concludere occorre fare un'ultima precisazione: quando si lavora con i tab non bisogna mai dimenticare che ogni URL creata deve sempre possedere il parametro "tabs1" in modo da posizionarsi correttamente nel tab desiderato, ad esempio:

<liferay-portlet:renderURL var="gotoTab2URL">
    <liferay-portlet:param name="mvcPath" value="/html/tab_sample/view.jsp" />
    <liferay-portlet:param name="tabs1" value="tab2" />
</liferay-portlet:renderURL>