20.12 Custom Tags in JSP 2.0
The JSP
pages in Examples Example 20-10 and Example 20-11 use the custom tags
<tags:attention> and
<tags:box>. In both cases, the JSP files
include an @taglib directive that maps the
tags: prefix to a directory in the
WEB-INF/ directory of the web application.
Within that directory are files named
attention.tag and box.tag,
which provide expansions for the two tags. Note that the tag names
are defined by the filenames of the .tag files.The
<attention> tag is a trivial one; its very short body
is the subject of Example 20-12. It consists simply of
a <span> tag and some CSS style attributes
that are wrapped around the contents to which the
user's attention should be drawn. In the tag body,
the <jsp:doBody/> tag is a placeholder for
the contents of the <attention> tag.
Example 20-12. attention.tag
<span style="color:#f00; font-weight: bold;">
<jsp:doBody/>
</span>
The box.tag file of Example 20-13 is
somewhat more complex because it can accept attributes. The
@attribute directives at the top of the file
declare these attributes. The bulk of the file consists of HTML
<div> tags and CSS styles for the box with
optional color, border, margins, and title. Expressions in
${ } place the attribute values into the CSS style
attributes as needed. Note that the expressions use the
?: ternary operator to provide default values when
the attribute is undefined. Again, the
<jsp:doBody/> tag is used as a placeholder
for the contents of the box.Note that the custom tags shown here are a JSP 2.0 feature. Prior to
JSP 2.0, custom tags had to be defined as Java classes and configured
with a TLD (tag library descriptor) file. While
this can be useful for tags with advanced features, many useful
custom tags are simple templates like these, and JSP 2.0 makes them
much easier to define.
Example 20-13. box.tag
<%@ attribute name="bgcolor" %>
<%@ attribute name="border" %>
<%@ attribute name="padding" %>
<%@ attribute name="margin" %>
<%@ attribute name="title" %>
<div style="
background-color: ${bgcolor!=null?bgcolor:"transparent"};
border: solid black ${border!=null?border:"0"}px;
margin: ${margin!=null?margin:"5"}px;
">
<div style="
background-color: #000;
color: ${bgcolor!=null?bgcolor:"transparent"};
margin: 0;
padding: ${title!=null?4:0}px;
font-family: sans-serif;
font-weight: bold;
text-align: left;
">
${title}
</div>
<div style="padding: ${padding!=null?padding:"5"}px;">
<jsp:doBody/>
</div>
</div>