Including your template elements within your JSPs

From OpenCms Wiki
Revision as of 16:53, 4 July 2011 by Ben (Talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search

Assigning a template to a JSP involves two steps:

1) creating a "well formed" (we will see it later) template for later inclusion

2) creating a JSP which includes the parts from template

3) activate in-place editing for our jsp


Creating a well formed template


A well formed template is a template with no HTML hanging around:

<%@ page session="false" %>
<%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms" %>
 
<%
org.opencms.jsp.CmsJspActionElement cms = new org.opencms.jsp.CmsJspActionElement(pageContext, request, response);
String uri = cms.getRequestContext().getUri();
uri = uri.replaceFirst(".jsp$",".html");
%>
 
<% //  ------------------- %>
 
<cms:template element="head">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>PageTitle</title>
<link rel="stylesheet" type="text/css" href="<cms:link>../resources/css/screen.css</cms:link>" />
<cms:editable />
</head>
 
<body>
 
<div id="layout">
<!-- start head -->
	<div id="head">
 
            <cms:include page="/system/modules/it.iisconsulting.opencms.modcli078/elements/menu/mnuLev1it.jsp" />
		</div>
	</div>
	<!-- end head -->
</cms:template>
 
<% //  ------------------- %>
 
<cms:template element="colonna_dx">
	<!-- start right column -->
		<div id="coldx">
			<div class="cdx">
 
			<h2 class="hmt"><cms:include page="<%= uri %>" element="title" editable="true"/></h2>
				<div class="txt_clt">
				<cms:include page="<%= uri %>" element="body" editable="true"/>
				</div>
				<p class="col_btm">&nbsp;</p>
			</div>
 
		</div>
	<!-- end right column -->
</cms:template>
 
<% //  ------------------- %>
 
 
<cms:template element="foot"> 
 
	</div>
 
	<!--end body -->
	<!-- start footer -->
	<div id="footer">
	</p>
	</div>
	<!-- end footer -->
</div>
</body>
</html>
</cms:template>

As you can see everything in HTML area is enclosed in <cms:template> elements. The template is now ready for use. Let's see how:

1) Create an empty JSP page

2) Set its Advanced Property "Template" pointing to the previously created template

3) write the code


The first two steps are straightforward. Let's see the third a little bit more.

<%@ page import="org.opencms.main.OpenCms" %>
<%@ page import="java.sql.*" %>
<%@ taglib prefix="cms" uri="http://www.opencms.org/taglib/cms" %>
 
<cms:include property="template" element="head" />
 
<%
	String username = request.getParameter("username");
	String password = request.getParameter("password");
	String inputType = "password";
	if(username != null && password != null) {
 
		Connection  con = OpenCms.getSqlManager().getConnection("dbpcn02mys");
[ Snip ]

As you can see we simply "shop" for what we need in template: the head element is included and then we proceed In writing our jsp.

3) In-place editing

Let's see how it supports in place editing for a JSP. How ? Simple. It includes an html page with the same name to allow the editing transparently. Let's have a look at the template.

we prepare the name:

String uri = cms.getRequestContext().getUri();
uri = uri.replaceFirst(".jsp$",".html");

then we include it:

<cms:include page="<%= uri %>" element="body" editable="true"/>

Done!

Personal tools
Namespaces
Variants
Actions
Navigation
Toolbox