Pages

Thursday, 13 September 2012

Liferay UI Tabs



Liferay UI Tabs
Creating Tabs is a really Cool feature and Liferay has an inbuilt functionality to do so.

Here is how it can be done.

1) In your Project , first create the following files under the following path
/docroot/jsps by creating a new folder called jsps

view.jsp
sunday.jsp
monday.jsp
tuesday.jsp
admin.jsp


code for view.jsp


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<%@ taglib uri="http://liferay.com/tld/portlet" prefix="liferay-portlet" %>
<%@ taglib uri="http://liferay.com/tld/theme" prefix="liferay-theme" %>
<%@ taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui" %>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<%@page import="com.liferay.portal.kernel.util.ParamUtil" %>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<liferay-theme:defineObjects />

//A renderURL is created because we need to render a jsp page you need to use //renderURL we can also  pass parameters if required

<liferay-portlet:renderURL var="portletURL"/>

<%
//We must Specify a default value for tabs. In this example it is sunday. Else it //will throw an error.
String tabValue = ParamUtil.getString(request, "tab", "sunday");
String tabsURL = "/jsps/" + tabValue.trim() + ".jsp";
String tabNames="Sunday,Monday,Tuesday" ;
String tabVal="sunday,monday,tuesday" ;
if(permissionChecker.isCompanyAdmin(themeDisplay.getCompanyId())){
tabNames+=",Admin" ;
tabVal+=",admin" ;
}
%>

<liferay-ui:tabs
names="<%=tabNames%>"
tabsValues="<%=tabVal%>"
param="tab"
url="<%= portletURL %>"
/>

//this wud render the tab page
<c:import url="<%= tabsURL %>"></c:import>


Here is how it would Look Like

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjdcP8p-G5tzTfIXUB22Fqncvq9tk7JYqd5OTbhLGKnW6X0lQqbI4u7UtjEnRLDfsJDJOVcy4n-JwcuPEDfNH1_s0SKMIBzwcI7mLRejdQCLtPnRY2-bJUDmWkAZZJ9JjazBNOeaWGUFo/s400/tabs.JPG

The Admin Page Will be Visible only if an Admin Logs in.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRECdaby7aa_TFwyXI5QX3Bvxv8_Rxyxr7mAbmyVIdFXAXQ7AyYoha7KPj9nfZX0PxQaAx8d6dWJWXogeVl7gGdvHUA4VN14G_nRcvPIZELWMrc98V-Ra_5Ul3q2FutZo698_FDVdCVFw/s400/admin.JPG

To Download the Project click
here

No comments:

Post a Comment