Posts Tagged ‘click framework’

Click Framework And Jsp: Notes

Wednesday, July 1st, 2009


Rendered page example:

customer-table.jsp (src code) ==============>when accessing from browser: it should be accessed AS

customer-table.htm—this auto mapped to

customer-table.jsp-map to

(if accessing it as .jsp, page is not rendered correctly)

This will first invoke customer-table.jsp,

-then invoke

-then invoke border-template.jsp as indicated in getTemplate method in above .java

- then render customer-table.htm (mapped to .jsp) via ${forward} in border-template.jsp when rendering border-template.jsp

(template is also a .jsp file.


<%@taglib prefix=”c” uri=””%>
<%@taglib prefix=”fmt” uri=””%>

<style type=”text/css”>
th { color: white; }

Example JSP customers table.

<table style=”border: 1px solid black;” cellpadding=”6″ cellspacing=”0″>
<tr valign=”baseline” bgcolor=”404060″>
<th align=”center”> ID </th>
<th align=”left”> Name </th>
<th align=”left”> Email </th>
<th align=”center”> Age </th>
<th align=”left”> Category </th>
<th align=”center”> Portfolio </th>
<th align=”right”> Date Joined </th>
<th align=”center”> Active </th>

<c:forEach var=”customer” items=”${customers}” varStatus=”lineInfo”>

<c:when test=”${lineInfo.count % 2 == 0}”> <tr bgcolor=”#f7f7e7″> </c:when>
<c:otherwise> <tr bgcolor=”white”> </c:otherwise>

<td align=”center”> ${} </td>
<td align=”left”> ${} </td>
<td align=”left”> <a href=”${}”>${}</a> </td>
<td align=”center”> ${customer.age} </td>
<td align=”left”> ${} </td>
<td align=”right”> <fmt:formatNumber value=”${}” type=”currency”/></td>
<td align=”right”> <fmt:formatDate value=”${customer.dateJoined}” pattern=”dd MMM yyyy”/> </td>

<td align=”center”>
<c:when test=”${}”> <input type=”checkbox” checked=”checked”/> </c:when>
<c:otherwise> <input type=”checkbox”/> </c:otherwise>





The <tt>CustomerTable</tt> page is automatically mapped to the request:

<pre class=”codeConfig”>
GET customer-table.htm </pre>

When pages are configured to use automapping the <tt>ClickServlet</tt>
will automatically associated the file path <tt>customer-table.jsp</tt>
with the page class <tt>CustomerTable</tt>.



import java.util.List;


* Provides JSP Page example where a JSP page and JSP border template is used to
* render a table.
* @author Malcolm Edgar
public class CustomerTable extends BorderPage {

public List customers = null;

* @see
public void onRender() {
customers = getCustomerService().getCustomersSortedByName(10);

* Returns the name of the border template: &nbsp; <tt>”/border-template.jsp”</tt>
* @see
public String getTemplate() {
return “/border-template.jsp”;


This is the template file:

<!doctype html>
sabob 724639 3 <!–
4 Licensed to the Apache Software Foundation (ASF) under one
5 or more contributor license agreements.  See the NOTICE file
6 distributed with this work for additional information
7 regarding copyright ownership.  The ASF licenses this file
8 to you under the Apache License, Version 2.0 (the
9 “License”); you may not use this file except in compliance
10 with the License.  You may obtain a copy of the License at
14 Unless required by applicable law or agreed to in writing,
15 software distributed under the License is distributed on an
17 KIND, either express or implied.  See the License for the
18 specific language governing permissions and limitations
19 under the License.
20 –>
malcolm_edgar 715468 21
sabob 787399 23 <%– Menu –%>
24 <table id=“menuTable” border=“0″ width=“100%” cellspacing=“0″ cellpadding=“0″ style=“margin-top: 2px;”>
25 <tr>
26 <td>
27 <div class=“menustyle” id=“menu”>
28 <ul class=“menubar” id=“dmenu”>
29 <c:forEach items=“${rootMenu.children}” var=“topMenu”>
30 <li class=“topitem”>${topMenu}
31 <ul class=“submenu”
32 <c:forEach items=“${topMenu.children}” var=“subMenu”>
33 ><li>${subMenu}</li
34 </c:forEach>
35 ></ul>
36 </li>
37 </c:forEach>
38 <li class=“topitem”><a target=“_blank” href=“${context}/source-viewer.htm?filename=WEB-INF/classes/${srcPath}” title=“Page Java source”><img border=“0″ class=“link” alt=“” src=“${context}/assets/images/lightbulb1.png”/> Page Java</a>
39 </li>
40 <li class=“topitem”><a target=“_blank” href=“${context}/source-viewer.htm?filename=${path}” title=“Page Content source”><img border=“0″ class=“link” alt=“” src=“${context}/assets/images/lightbulb2.png”/> Page HTML</a>
41 </li>
42 </ul>
43 </div>
44 </td>
45 </tr>
46 </table>
47 </div>
malcolm_edgar 715468 48
sabob 787399 49 <%– Page Content –%>
50 <div class=“content”>
51 <h2>${title}</h2>  <============ from
52 <p/>
sabob 782056 53 <jsp:include page=${forward} flush=“true”/>  <============= htm equivalent of path; the .htm page requested, in this case it renders requesing .htm page: customer-table.htm
sabob 787399 54 </div>
56 </div>
malcolm_edgar 715468 57
sabob 757699 58 ${jsElements}
malcolm_edgar 715468 60 </body>
malcolm_edgar 716421 61 </html>

=========imports for jsp==========

public class PageImportsextends Object

Provides a utility object for rendering a Page’s HTML header imports and its control HTML header imports.

A PageImports instance is automatically added to the Velocity Context for Velocity templates, or as a request attribute for JSP pages using the key name “imports“.

PageImports Examples

To use the PageImports object simply reference it your page header section. For example: <html>
imports” include all javascript and stylesheet imports.
PageImports also provides a way of including the javascript and stylesheet separately using the key names “cssImports” and “jsImports“.

You should follow the performance best practice by importing CSS includes in the head section, then include the JS imports after the html body. For example:

Please also see Page.getHtmlImports() and Control.getHtmlImports().

Tip of the day: Click Framework: variables in JSP

Wednesday, July 1st, 2009

A variable in a JSP should be included in bracelets, otherwise it will not be traeted as variables, although it works with .htm with Velocity engine. So $path works in .htm, in JSP it should write as ${path} if you wnat it to be teated as a variable instead of a literal.