The Window toolkit provides a typical layout mechanism, such as determining the location of component elements in a container. There are layout managers in AWT and Swing, and there are wrappers in VisualWorks Smalltalk. This article will introduce a JSP template mechanism that allows layouts to be encapsulated and reused. JSP templates minimize the impact of layout changes, and here we will encourage everyone to adopt package modular design.
Although web development tools are improving very quickly, they still lag behind graphical user interface (GUI) toolkits (Swing and VisualWorks Smalltalk). For example, a layout manager is provided in a traditional GUI toolkit, which allows layout operations to be encapsulated and reused in one form or another. The JSP template mechanism introduced in this article, like the layout manager, can encapsulate the layout, so it can be reused rather than just copied.
Since many changes have occurred in the development of layout, the packaging of functions is a very important step, and it can be modified freely to minimize the impact on other applications.
JSP does not provide direct support for encapsulation layouts, so web pages with a unified format can usually copy layout code; for example, in Figure 1, a web page is shown that contains the title, footer, toolbar, and main content of the page.
Figure 1. Web page layout Click to enlarge (22 KB)
The web page layout shown in Figure 1 will be executed as HTML table tags:
Example 1. Includes content:
<html><head><title>JSPtemplates</title></head>
<body background='graphics/'>
<table>
<tr valign='top'><td><%@include file=''%></td>
<td><table>
<tr><td><%@include file=''%></td></tr>
<tr><td><%@include file=''%></td></tr>
<tr><td><%@include file=''%></td></tr>
</table>
</td>
</tr>
</table>
</body></html>
In the example above, the JSP include command is included, which allows page content to be changed - by changing the included files - without modifying the web page itself. However, since the layout is difficult to encode, layout changes require modification of the web page. If a website has multiple pages of the same format, then in general, even simple layout changes will involve modifications to the entire page.
In order to reduce the impact of layout changes, we need a mechanism that only includes layout; using this mechanism, both layout and content can be modified separately without modifying the file. This mechanism is JSP template.
Using templates
A template is a JSP file that contains parameterized content. The templates discussed here are executed using a set of customized tags: template:get, template:put, and template:insert. The template:get tag accesses parameterized content, just like in the example, it will generate a web page in the same format as Figure 1.
Example. A template
<%@taglib uri='/WEB-INF/tlds/' prefix='template' %>
<html><head><title><template:get name='title'/></title></head>
<body background='graphics/'>
<table>
<tr valign='top'><td><template:get name='sidebar'/></td>
<td><table>
<tr><td><template:get name='header'/></td></tr>
<tr><td><template:get name='content'/></td></tr>
<tr><td><template:get name='footer'/></td></tr>
</table>
</td>
</tr>
</table>
</body></html>
Example is almost exactly the same as Example 1, but in the example we used template:get instead of the include command in Example 1. Let's analyze how template:get runs.
template:get uses a special name (within the scope of the request) to modify a Java Bean. A bean contains a URI (a component of a web page that is included in template:get). For example, in the template list of examples, template:get obtains a URI——from a bean named header (within the scope of the request). Then it is included in template:get.
template:put Puts the bean into the requested scope (this range will be modified by template:get later). The template is included in template:insert. The examples illustrate the usage of put and insert tags:
Example. Use templates from examples
<%@taglib uri='/WEB-INF/tlds/' prefix='template' %>
<template:inserttemplate='/'>
<template:put name='title' content='Templates' direct='true'/>
<template:put name='header' content='/' />
<template:put name='sidebar' content='/' />
<template:put name='content' content='/'/>
<template:put name='footer' content='/' />
</template: insert>
The tag at the beginning of insert specifies the included template, in this example, the template is in the example. Each put tag stores a bean within the request scope, and the tag at the end of the insert contains the template. The template then accesses the bean as described above.
The property of direct can be specified for template:put; if direct is set to true, the content associated with the tag will not be included in template: get.
A website contains multiple pages of the same format, so that a template can be used, for example, listed a template in the example, which is used in many JSP web pages (examples).
Another benefit of using templates is that you can design modularly. For example, the JSP file listed in the example contains it, let's look at the following example.
example.
<table>
<tr>
<td><img src='graphics/'/></td>
<td><img src='graphics/'/></td>
</tr>
</table><hr>
Since it is included, it does not have to copy its code in the page where the header needs to be displayed. Moreover, although it is an HTML file, the general starting HTML tags (such as <html> or <body>) are not used in the file because these tags will be defined by the template. Since it is included in the template, these tags are no longer necessary.
Note: JSP provides two ways to include content: static method, using include command; dynamic method, using include action. The include command contains the reference source of the target page, which is similar to #include in C and import in Java. include action contains the response generated by the target during runtime.
Like the JSP include action, the template contains dynamic content. Therefore, although the JSP web pages in Example 1 and Example are functionally consistent, the static content contained in the previous one is dynamically included later.
Optional content
All template content is optional, and the template content can be easily used in more web pages. For example, in Figures and Figures, two pages are displayed—Logins and Lists—they use the same template. Both pages contain a header, footer, and main content. There is an edit Panel in the list page (which is missing from the landing page) to change the list.
Figure. A login window Click to enlarge (24 KB)
Figure. A list page Click to enlarge (42 KB)
Below, you will find that the template will be shared by the login and the manifest page:
<%@taglib uri='' prefix='template' %>
……
<table width='670'>
<tr><td width='60'></td>
<td><template:get name='header'/></td></tr>
<tr><td width='60'></td>
<td><template:get name='main-content'/></td></tr>
<tr><td width='60'></td>
<td><template:get name='editPanel'/></td></tr>
<tr><td width='60'></td>
<td><template:get name='footer'/></td></tr>
</table>
……
The listing page uses the template above and content specifically used to edit Panels:
<%@taglib uri='' prefix='template' %>
<%@taglib uri='' prefix='security' %>
<template:inserttemplate='/'>
……
<template:put name='editPanel'
content='/'/>
……
</template:insert>
In contrast to the above, the login page does not have content specifically used to edit Panel:
<%@taglib uri='' prefix='template' %>
<template:inserttemplate='/'>
<template:put name='title' content='Login' direct='true'/>
<template:put name='header' content='/'/>
<template:put name='main-content'
content='/'/>
<template:put name='footer' content='/'/>
</template:insert>
Since there is no content in the login page dedicated to editing the Panel, it is not included.
Role-based content
Web applications often generate different content based on different users. For example, for the same JSP template, editing Panel appears only when the user is an administrator. Below are two different pages derived (as shown in the figure and.)
Figure. Administrator's list page Click to enlarge (27 KB)
Figure. List page of other users Click to enlarge (21 KB)
The template in the figure and uses the role attribute of template:get:
<%@taglib uri='' prefix='template' %>
......
<table>
......
<td><template:get name='editPanel' role='curator'/></td></tr>
......
</table>
......
The get tag only contains content when the user's Role matches the Role attribute. Let's see how the tag handler uses the Role property:
public class GettagextendstagSupport {
private String name = null， role = null;
......
public void setRole(String role) { = role; }
......
public int doStartTag() throws JspException {
......
if(param != null) {
if(roleIsValid()) {
// include or print content ......
}
}
......
}
private boolean roleIsValid() {
return role == null || // valid if role isn't set
(()
()).isUserInRole(role);
}
}
Although web development tools are improving very quickly, they still lag behind graphical user interface (GUI) toolkits (Swing and VisualWorks Smalltalk). For example, a layout manager is provided in a traditional GUI toolkit, which allows layout operations to be encapsulated and reused in one form or another. The JSP template mechanism introduced in this article, like the layout manager, can encapsulate the layout, so it can be reused rather than just copied.
Since many changes have occurred in the development of layout, the packaging of functions is a very important step, and it can be modified freely to minimize the impact on other applications.
JSP does not provide direct support for encapsulation layouts, so web pages with a unified format can usually copy layout code; for example, in Figure 1, a web page is shown that contains the title, footer, toolbar, and main content of the page.
Figure 1. Web page layout Click to enlarge (22 KB)
The web page layout shown in Figure 1 will be executed as HTML table tags:
Example 1. Includes content:
<html><head><title>JSPtemplates</title></head>
<body background='graphics/'>
<table>
<tr valign='top'><td><%@include file=''%></td>
<td><table>
<tr><td><%@include file=''%></td></tr>
<tr><td><%@include file=''%></td></tr>
<tr><td><%@include file=''%></td></tr>
</table>
</td>
</tr>
</table>
</body></html>
In the example above, the JSP include command is included, which allows page content to be changed - by changing the included files - without modifying the web page itself. However, since the layout is difficult to encode, layout changes require modification of the web page. If a website has multiple pages of the same format, then in general, even simple layout changes will involve modifications to the entire page.
In order to reduce the impact of layout changes, we need a mechanism that only includes layout; using this mechanism, both layout and content can be modified separately without modifying the file. This mechanism is JSP template.
Using templates
A template is a JSP file that contains parameterized content. The templates discussed here are executed using a set of customized tags: template:get, template:put, and template:insert. The template:get tag accesses parameterized content, just like in the example, it will generate a web page in the same format as Figure 1.
Example. A template
<%@taglib uri='/WEB-INF/tlds/' prefix='template' %>
<html><head><title><template:get name='title'/></title></head>
<body background='graphics/'>
<table>
<tr valign='top'><td><template:get name='sidebar'/></td>
<td><table>
<tr><td><template:get name='header'/></td></tr>
<tr><td><template:get name='content'/></td></tr>
<tr><td><template:get name='footer'/></td></tr>
</table>
</td>
</tr>
</table>
</body></html>
Example is almost exactly the same as Example 1, but in the example we used template:get instead of the include command in Example 1. Let's analyze how template:get runs.
template:get uses a special name (within the scope of the request) to modify a Java Bean. A bean contains a URI (a component of a web page that is included in template:get). For example, in the template list of examples, template:get obtains a URI——from a bean named header (within the scope of the request). Then it is included in template:get.
template:put Puts the bean into the requested scope (this range will be modified by template:get later). The template is included in template:insert. The examples illustrate the usage of put and insert tags:
Example. Use templates from examples
<%@taglib uri='/WEB-INF/tlds/' prefix='template' %>
<template:inserttemplate='/'>
<template:put name='title' content='Templates' direct='true'/>
<template:put name='header' content='/' />
<template:put name='sidebar' content='/' />
<template:put name='content' content='/'/>
<template:put name='footer' content='/' />
</template: insert>
The tag at the beginning of insert specifies the included template, in this example, the template is in the example. Each put tag stores a bean within the request scope, and the tag at the end of the insert contains the template. The template then accesses the bean as described above.
The property of direct can be specified for template:put; if direct is set to true, the content associated with the tag will not be included in template: get.
A website contains multiple pages of the same format, so that a template can be used, for example, listed a template in the example, which is used in many JSP web pages (examples).
Another benefit of using templates is that you can design modularly. For example, the JSP file listed in the example contains it, let's look at the following example.
example.
<table>
<tr>
<td><img src='graphics/'/></td>
<td><img src='graphics/'/></td>
</tr>
</table><hr>
Since it is included, it does not have to copy its code in the page where the header needs to be displayed. Moreover, although it is an HTML file, the general starting HTML tags (such as <html> or <body>) are not used in the file because these tags will be defined by the template. Since it is included in the template, these tags are no longer necessary.
Note: JSP provides two ways to include content: static method, using include command; dynamic method, using include action. The include command contains the reference source of the target page, which is similar to #include in C and import in Java. include action contains the response generated by the target during runtime.
Like the JSP include action, the template contains dynamic content. Therefore, although the JSP web pages in Example 1 and Example are functionally consistent, the static content contained in the previous one is dynamically included later.
Optional content
All template content is optional, and the template content can be easily used in more web pages. For example, in Figures and Figures, two pages are displayed—Logins and Lists—they use the same template. Both pages contain a header, footer, and main content. There is an edit Panel in the list page (which is missing from the landing page) to change the list.
Figure. A login window Click to enlarge (24 KB)
Figure. A list page Click to enlarge (42 KB)
Below, you will find that the template will be shared by the login and the manifest page:
<%@taglib uri='' prefix='template' %>
……
<table width='670'>
<tr><td width='60'></td>
<td><template:get name='header'/></td></tr>
<tr><td width='60'></td>
<td><template:get name='main-content'/></td></tr>
<tr><td width='60'></td>
<td><template:get name='editPanel'/></td></tr>
<tr><td width='60'></td>
<td><template:get name='footer'/></td></tr>
</table>
……
The listing page uses the template above and content specifically used to edit Panels:
<%@taglib uri='' prefix='template' %>
<%@taglib uri='' prefix='security' %>
<template:inserttemplate='/'>
……
<template:put name='editPanel'
content='/'/>
……
</template:insert>
In contrast to the above, the login page does not have content specifically used to edit Panel:
<%@taglib uri='' prefix='template' %>
<template:inserttemplate='/'>
<template:put name='title' content='Login' direct='true'/>
<template:put name='header' content='/'/>
<template:put name='main-content'
content='/'/>
<template:put name='footer' content='/'/>
</template:insert>
Since there is no content in the login page dedicated to editing the Panel, it is not included.
Role-based content
Web applications often generate different content based on different users. For example, for the same JSP template, editing Panel appears only when the user is an administrator. Below are two different pages derived (as shown in the figure and.)
Figure. Administrator's list page Click to enlarge (27 KB)
Figure. List page of other users Click to enlarge (21 KB)
The template in the figure and uses the role attribute of template:get:
<%@taglib uri='' prefix='template' %>
......
<table>
......
<td><template:get name='editPanel' role='curator'/></td></tr>
......
</table>
......
The get tag only contains content when the user's Role matches the Role attribute. Let's see how the tag handler uses the Role property:
public class GettagextendstagSupport {
private String name = null， role = null;
......
public void setRole(String role) { = role; }
......
public int doStartTag() throws JspException {
......
if(param != null) {
if(roleIsValid()) {
// include or print content ......
}
}
......
}
private boolean roleIsValid() {
return role == null || // valid if role isn't set
(()
()).isUserInRole(role);
}
}