Change Background color using Custom Tag
In this program, We will create a Custom Tag which changes the background color.
In this program, We will create a Custom Tag which changes the background color.
Change Background color using Custom Tag
In this program, We will create a Custom Tag which changes the background
color.
JSP Custom Tags :
-
Provide a mechanism to a Web programmer to reuse and encapsulate
complex recurring code in a JSP application.
-
Provide simplicity and reusability of Java code.
-
Enable you to perform various functions, such as:
-
Accessing all implicit variables of a JSP page, such as
request,
response, in, and out.
-
Modifying the response generated by a calling JSP page.
- Initializing and instantiating a JavaBean component.
Types of Custom Tags
The various types of custom tags that you can develop in JSP are :
- Empty tags: Refer to the custom tags that do not have any attribute or
body. The following code snippet shows an empty custom tag:
<td:welcome />
- Tags with attributes: Refer to custom tags for which you can define
attributes to customize the behavior of the custom tag. The following code
snippet shows a custom tag with an attribute color:
<td: welcome color=?blue?></td:welcome>
-
Tags with a body: Refer to the custom tag within which you can define nested
custom tags, scripting elements, actions, HTML text, and JSP
directives. The following code snippet shows a custom tag that contains a JSP
scripting element as its body:
<td: welcome>
<%=today_date%>
</td:welcome>
<td1:ifTag condition ?<%=eval>? >
<td2:valueTrue>
The expression evaluates to true
</td2:valueTrue>
</td1:ifTag>
Development of Custom Tag :
To develop a custom tag, you need to perform following steps:
-
Develop a tag handler or class file(.java)
-
Develop the Tag Library Descriptor (TLD) file
-
Include the Tag Library in a JSP page
- Deploy the application
EXAMPLE : In this Example, We will create a Custom Tag which
changes the background color .When you enter your Name in Html form & select
color -color changes according to your choice, this background color change is
due to the custom tag, which we have created with the help of tag handler
class :-
Tag Handler File :
Build a class that implements the
javax.servlet.jsp.tagext tag interface as follows. Compile it and place it
under the web-inf/classes directory (in the appropriate package structure).
HelloTag.java
package hello;
/* Import packages that are required for implementing custom tag */
import java.io.*;
import javax.servlet.jsp.*;
import javax.servlet.jsp.tagext.*;
import java.util.GregorianCalendar;
/* Extending the BodyTagSupport interface */
public class HelloTag extends BodyTagSupport
{
private String name;
private PageContext pageContext;
private Tag parent;
String color;
/* Declaring the constructor for the class */
public HelloTag()
{
super();
}
/* Initializing the name */
public void setName(String name)
{
this.name = name;
}
/* Initializing the color */
public void setColor(String color)
{
this.color = color;
}
public int doAfterBody() throws JspException
{
try
{
/* Creating an instance of the BodyContent class */
// Get the bodycontent as string
BodyContent bc = getBodyContent();
// GetJspWriter to output content
String body = bc.getString();
/* Creating an instance of the JspWriter class */
JspWriter out = bc.getEnclosingWriter();
String dt;//Declaring the variable for system date
/* Creating an instance of the GregorianCalendar class */
GregorianCalendar now = new GregorianCalendar();
/* Invoking the getTime() method */
dt = now.getTime().toString();
/* Finding the substring of the date type variable dt */
String dt1 = dt.substring(11,16);
/* Setting the color as selected by the user */
out.print("<body bgcolor="+color+">");
/* Displaying the custom message to the user according to
the system time */
if(body != null)
out.print("<CENTER>Hi"+body+"! </CENTER>");
if(dt1.compareTo("12.00")<0)
out.print("<CENTER>Good Morning to You.</CENTER>");
if((dt1.compareTo("12.00")>0) && (dt1.compareTo("16.00")<0))
out.print("<CENTER>Good Afternoon to You.</CENTER>");
if((dt1.compareTo("16.00")>0) && (dt1.compareTo("24.00")<0))
out.print("<CENTER>Good Evening to You.</CENTER>");
out.print("<BR>");
out.print("<CENTER>Welcome to ABC Inc.</CENTER>");
out.print("<BR>");
out.print("<CENTER>The current time: "+dt1+"</CENTER>");
out.print("</body>");
}
catch(IOException ioe)
{
throw new JspException("Error:"+ioe.getMessage());
}
return SKIP_BODY;
}
} |
Tag Library Descriptor (TLD) file :
Now we need to describe the tag,
so create a file called Mytaglib.tld and place it under the web-inf directory.
<taglib>
<tlib-version>1.0</tlib-version>
<jsp-version>1.2</jsp-version>
<short-name>first</short-name>
<!-- tag specifies how you are going to reference the tag library
from the JSP page -->
<uri>/Mytaglib.tld</uri>
<!-- tag can be used as a unique identifier for your tag library.-->
<info>A simple tag library for the examples</info>
<tag>
<name>hello</name>
<tag-class>hello.HelloTag</tag-class>
<body-content>JSP</body-content>
<attribute>
<name>color</name>
<rtexprvalue>true</rtexprvalue>
<required>true</required>
</attribute>
</tag>
</taglib> |
HTML File :
AcceptInput.html
<html>
<body>
<h2>Select a color of your choice </h2>
<font size=4 face="Verdana" color=#112244>
<form method="post" action="helloCustomTag.jsp">
<br>
<input type="radio" name="r1" value="G" checked="false">Green
<br>
<input type="radio" name="r1" value="Y" checked="false">Yellow
<br>
<input type="radio" name="r1" value="R" checked="false">Pink
<br>
<input type="radio" name="r1" value="B" checked="false">Blue
<br>
<p>Enter Name <input type="type" name="uname">
<br>
<br>
<input type="Submit" value= "Submit" name="b1">
</p>
</form>
</body>
</html> |
JSP File :
helloCustomTag.jsp
<%-- Providing the location of the Mytaglib directive --%>
<%@ taglib uri="/Mytaglib.tld" prefix="first" %>
<HTML>
<HEAD>
<TITLE>Customized Tag</TITLE>
</HEAD>
<%
/* Setting the color parameter selected by the user */
String str = request.getParameter("r1");
/* Comparing the color and then invoking the custom
tag with attribute color and body */
if(str.compareTo("G")==0)
{
%>
<first:hello color="LIGHTGREEN">
<%=request.getParameter("uname")%>
</first:hello>
<%
}
if(str.compareTo("R")==0)
{
%>
<first:hello color="RED">
<%=request.getParameter("uname")%>
</first:hello>
<%
}
if(str.compareTo("Y")==0)
{
%>
<first:hello color="LIGHTYELLOW">
<%=request.getParameter("uname")%>
</first:hello>
<%
}
if(str.compareTo("B")==0)
{
%>
<first:hello color="LIGHTBLUE">
<%=request.getParameter("uname")%>
</first:hello>
<%
}
%>
<BR>
<B>
</BODY>
</HTML> |
Deployment of application (OUTPUT) :
After Submitting the values :
Download Source Code
