Friday, September 25, 2009

Mandatory field Marking with Custom Tags..

In a web-page’s form there always exist some mandatory fields.

We alert the end-user with a marking (*) along the side of the input fields.

Usually we tend to write labels in HTML like this in all the pages


<span >*</span>


When developing with JSP we can encapsulate this label / mark in a JSTL custom taglib and bring it in the page with our own tags.

JSTL encapsulates common functionality required for web-pages as tags.It provides a mechanism to extend and write our own functionalities.

What is the use of doing it that way?
  • Your code resides in a common place.
  • When there is are requirement to change the marker ( from “*” to “#” or from “red” to “green”) its easy.
  • You get exposure to write your own custom tag ...its cool..

Steps to write a marker custom tag:

  1. Write your tag handler class.
  2. Describe your tag handler class in a .tld (tag library descriptor) file
  3. Introduce the .tld file to your web application with a fancy name in web.xml

Your custom tag is ready and you can use it in your web page.


Step # 1: Write a tag handler class MandatoryTag.java
package dev.aha;

import java.io.IOException;

import javax.servlet.jsp.JspException;
import javax.servlet.jsp.JspWriter;
import javax.servlet.jsp.tagext.TagSupport;

/**
*
* A TagHandler class to provide mandatory-marker for
* HTML forms
*
* Note: This class extends javax.servlet.jsp.tagext.TagSupport
* since it doesn't have a body else you should extend BodyTagSupport
*
* @author AhamedM
*
*/
public class MandatoryTag extends TagSupport {

private static final long serialVersionUID = 1L;

/**
* An attribute to define the color of the marker You can ignore this if not
* needed..
*/
private String color;

public String getColor() {
return color;
}

public void setColor(String color) {
this.color = color;
}

/**
* Note : We are overriding only the doStartTag() method because what we are
* developing is a empty-bodied-tag
*/
@Override
public int doStartTag() throws JspException {

JspWriter out = pageContext.getOut(); // Get the writer from pageContext
try {
if (getColor() == null getColor().equals("")) {
out.write("<span style=\"color:red\">*</span>");
} else if (color.equals("blue") color.equals("green"))
out.write("<span style=\"color:" + color + "\">*</span>");
} catch (IOException iex) {
}

/**
* We are returning SKIP_BODY as the body of this tag is empty
*/
return SKIP_BODY;
}
}


Step# 2: Describe the tag & tag handler in mytaglib.tld file



<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE taglib PUBLIC "-//Sun Microsystems, Inc.//DTD JSP Tag Library 1.1//EN"
"http://java.sun.com/j2ee/dtds/web-jsptaglibrary_1_1.dtd">
<taglib>
<tlibversion>1.0</tlibversion>
<jspversion>1.1</jspversion>
<shortname>Ahamed Tag Lib</shortname>
<info>My Simple Tag library</info>
<!-- A Simple tag -->
<tag>
<name>mandate</name>
<tagclass>dev.aha.MandatoryTag</tagclass>
<!--
Body content can have a value of empty: no body JSP: body that is
evaluated by container, then possibly processed by the tag
tagdependent: body is only processed by tag; JSP in body is not
evaluated.
-->
<bodycontent>empty</bodycontent>
<info> This is a simple tag to indicate mandatory fields. </info>

<!-- Optional attributes -->
<attribute>
<name>color</name>
<required>false</required>
<rtexprvalue>false</rtexprvalue>
</attribute>
</tag>
</taglib>




Step#3: Introduce the mytaglib.tld in web.xml


<jsp-config>
<taglib>
<taglib-uri>AhamedSampleTld</taglib-uri>
<taglib-location>/WEB-INF/mytaglib.tld</taglib-location>

</taglib>
</jsp-config>




That’s it…Yes..Its done…You can use this tag in your page to mark the fields..

Sample index.jsp page with our custom tag



<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1" isELIgnored="false"%>
<%@ taglib uri="AhamedSampleTld" prefix="aha"%>
<!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>Mandatory field- Sample</title>
</head>
<body>
<form action="someUrl">
<table>
<tr>
<td><aha:mandate />PAN No.</td>
<td><input type="text" /></td>
</tr>
<tr>
<td><input type="submit" value="SUBMIT" /></td>
<td></td>
</tr>
</table>
</form>
</body>
</html>



ENJOI !!!!!

1 comment: