JSP custom tag with custom number of attributes

JSP custom tags are very powerful. In this writing, I’m going to show a way to reduce repetitive lines that we write in almost every JSP pages using JSP custom tags. starting from < !DOCTYPE> to the end of < head>tag.

We almost include same javascript, css, favicon etc in all JSP pages. The only thing that differs is the text inside < title> tag. Sometimes, we include special javascript or css files for some special pages e.g. we include special script for validating user information on a registration page, we’ll also take that into account.

A typical JSP/HTML page contains the following at the start:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>My Special Site</title>
    <link rel="stylesheet" href="/assets/style.css"/>
    <link rel="stylesheet" href="/assets/style2.css"/>
    <link rel="stylesheet" href="/assets/style3.css"/>
    
   <!-- Similarly it'd take some more lines to include javascript & other codes we need -->

Now, using JSP custom tag we can add those lines to any JSP page just by adding one line instead, e.g. . If we need additional javascripts and or css files we can just add them like this:

<my:head title="My Special Site" script1="somescript.js" script2="someotherscript.js"/>

or

<my:head title="My Special Site" style1="somestyle.css" style2="someotherstyle.css"/>

If we need anything other than javascript or css we can just write that like this:

<my:head title="My Special Site" script1="somescript.js">
   <script> <!-- additional lines -->
     var someVariable = 40;
   </script>
</my:head>

Now heres the code to do this. We’ll specify where the scripts & css files stays that we added by script1="..." and so on…

FILE: head.tag

<%@ tag  dynamic-attributes="dynamicttrs" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!-- We'll make title a required attribute, so that we'll be reminded if we miss it -->
<%@ attribute name="title" required="true" rtexprvalue="true" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	<title>${title}</title>
        <!-- We can use init parameters (defined in web.xml) here -->
	<c:set var="rooturl" value="${initParam.webRoot}"/>

        <!-- Include required css styles -->
	<link rel="stylesheet" href="${rooturl}/assets/style.css"/>
	<link rel="stylesheet" href="${rooturl}/assets/dialogstyle.css"/>
	<link rel="stylesheet" href="${rooturl}/assets/superdialog.css"/>

        <!-- Include required javascripts -->
	<script src="${rooturl}/js/jquery-1.8.2.js"></script>
	<script src="${rooturl}/js/calendar.js"></script>	
	<script src="${rooturl}/js/jquery-ui-personalized-1.5.2.packed.js"></script>
	<script src="${rooturl}/js/superdialog.js"></script>
	<script src="${rooturl}/js/jquery.livequery.js"></script>
	<script src="${rooturl}/js/script.js"></script>
        
        <!-- Now we take care of the dynamic attribute 'style' & 'script' -->
	<c:forEach var="item" items="${dynamicttrs}">
		<c:set var="name" value="${item.key}"/>
		<c:choose>
			<c:when test="${fn:startsWith(name, 'script') == true}">
				<script src="${rooturl}/js/${item.value}"></script>
			</c:when>
			<c:when test="${fn:startsWith(name, 'style') == true}">
				<link rel="stylesheet" href="${rooturl}/assets/${item.value}"/>
			</c:when>
		</c:choose>
	</c:forEach>
        <!-- If we have additional text in the tag body we show them here -->
	<jsp:doBody/>
</head>

Let’s keep this head.tag file inside WEB-INF/tags/ folder.
Now we can use this tag in any JSP page like this:

<%@ taglib prefix="my" tagdir="/WEB-INF/tags" %>
<my:head title="Home"/>
<body>
   <!-- your page's body -->
</body>
</html>

Leave a Reply