Chapter 111© copyright Janson Industries 2011 Custom Tags ▮ Tag Handlers ▮ XML ▮ Tag...

chapter 11 1© copyright Janson Industries 2011

Custom Tags

▮ Tag Handlers

▮ XML

▮ Tag Libraries

▮ Web Deployment Descriptor


Why Custom Tags?

▮ Bean tags are limited: useBean, getProperty, and setProperty

▮ Often need functions in JSPs that require scripts or extensive JSTL tags

▮ Using custom tags instead:▮ Simplifies the coding in the JSPs▮ Makes functions accessible to all JSPs▮ Easier to change the function


How do tags work?

▮ Tags can be tied to a java class called a tag handler

▮ As the tag is read, various tag handler methods will be invoked (by the server) ▮ doStartTag▮ doInitBody▮ doAfterBody▮ doEndTag▮ release


Generic Tag Classes

▮ A class is defined as a tag handler by extending a generic tag class or implementing a tag interface

▮ By implementing an interface or extending a generic tag class, the tag handler gets useful methods and variables


▮ Generic tag classes▮ TagSupport▮ BodyTagSupport (extends TagSupport)

▮ Tag interfaces▮ Tag▮ IterationTag (extends Tag)▮ BodyTag (extends IterationTag)

Generic Tag Classes


Generic Tag Classes

▮ TagSupport (implements IterationTag) subclasses inherit the methods:▮ doStartTag▮ doAfterBody▮ doEndTag▮ release

▮ BodyTagSupport (extends TagSupport and implements BodyTag) subclasses inherit the additional method:▮ doInitBody


Creating a tag handler

▮ Generates the following code:

▮ Not too exciting

▮ Need to add tag methods

package c11;

import javax.servlet.jsp.tagext.BodyTagSupport;

public class TestTag extends BodyTagSupport {

}


Click Source, Override/Implement Methods, select these methods, then

click OK


New methods simply call the superclass’ overridden

methods


We will add this code to the doStartTag method

A tag handler has been defined...


▮ ..however, creating a tag, tying a tag to a tag handler, and using the tag is a little more complicated

▮ A tag is defined and associated with a tag handler class in a tag library

▮ A tag library is a TLD (Tag Library Description) file that contains XML to associate tag(s) and tag handler(s) class(es)

Creating a Tag


▮ We will create a folder to hold tag libraries in MyWeb called TagLibs

▮ Within TagLibs we will create a tld file called MyTagLib

▮ Within MyTagLib, we will define a tag called mFT (MyFirstTag) and associate it with TestTag

Creating a Tag Library

chapter 11 14© copyright Janson Industries 2011Tag Libraries must reside in Web-INF


Create a new file in TagLibs


Just need to add the XML to tie the tag to the tag

handler


XML

▮ eXtensible Markup Language

▮ The "Duct Tape" of the Internet

▮ XML similar in syntax to all MLs▮ Start Tags▮ End Tags

▮ To define a tag, use the tag, name, and tagclass tags


<taglib>

<tag>

<name>mFT</name>

<tagclass>c11.TestTag</tagclass>

</tag>

</taglib>

XML

▮ XML syntax very flexible. This works too:

<taglib>

<tag>

<name>

mFT

</name>

<tagclass>

c11.TestTag

</tagclass>

</tag>

</taglib>


Using a Tag

▮ A little more complicated

▮ Simply coding the tag in a JSP is easy

▮ However, must tell the server where the tag library is ▮ So the server can find/run the tag handler

▮ A taglib directive (in the JSP) tells the server where to find the tag library with a URI (uniform resource identifier)


For instance, when a forEach tag was inserted from the palette..


...RAD inserted the tag (notice the prefix

c)...


... as well as taglib directives

The taglib directive indicates the URI for the

correct taglib


taglib directive

▮ Multiple tag libraries can be accessed in a JSP

▮ Therefore, taglib directives must assign a prefix (nickname) for each taglib

▮ And when the custom tag is specified, the prefix must be included


URI

▮ Lastly, the URI is tied to an actual path/file (in the Web deployment descriptor)

▮ For this example, we will create:

▮ A Tag Lib Reference in the Web deployment descriptor that ties MyTagLib.tld to the URI http://www.mytags.com/

▮ TT.jsp (TagTest). In TT: ▮ A taglib directive for the URI and prefix▮ The mFT tag with a prefix


Quick Review

<z:mFT></z:mFT>

<%@taglib uri="http://www.mytags.com/" prefix="z"%>

URI: http://www.mytags.com/

Location: /WEB-INF/TagLibs/MyTagLib.tld

Tag prefix identifies correct taglib directive

Taglib directive tells server to go to deployment descriptor

Deployment descriptor identifies the correct tag library

<name>mFT</name>

<tagclass>c11.TestTag</tagclass>

Tag definition identifies tag handler class to run

<z:mFT></z:mFT>


Why define a URI?

▮ You could specify the taglib file in the taglib directive

▮ However, if file location or name changes, all JSPs that use the tag library must be updated

▮ If URI defined in deployment descriptor:▮ A change in the taglib location or name

means only updating the tag library reference in the Web deployment descriptor

<%@taglib uri= "/WEB-INF/TagLibs/MyTagLib.tld" prefix="z"%>


TT has some static text


RAD not happy with taglib directive because the URI isn’t in the deployment

descriptorIn fact, there is no deployment descriptor!

We insert the taglib directive and tag in the

source code


To create a deployment descriptor, right click the project and select Java EE and Generate Deployment Descriptor Stub


A file called web.xml is created in WEB-INF

Open by right clicking, select Open With, then Web Application 3.0 Deployment Descriptor

Editor


Click Add…

…from Add Item, select JSP Configuration and then click OK


Click Add again …

…select Taglib and then click OK


Specify the tag library file and the URI


Save the deployment descriptor. Reference added.


When MyTagLib file created, didn’t specify the file extension as .tld


Rename and add .tld


Run TT.jsp on server


Custom Tag

▮ In the future defining a tag will be faster because you won't have to:

▮ Create a tag library and deployment descriptor

▮ Define a URI in the deployment descriptor

▮ You still have to:

▮ Define a tag handler

▮ Use XML to define the tag in the tag library


Tag Handler

▮ Tag handler methods are executed in a particular order

▮ For instance, doEndTag executed after doStartTag

▮ However, which tag handler methods are executed is based on whether the tag body is empty and what doStartTag returns

▮ Let's prove...


Refresh the browser


Tag Handler

▮ Notice, not all tag handler methods were run

▮ This is because (by default) doStartTag returns the inherited value SKIP_BODY

▮ If we:▮ Put text in the tag body▮ Change the returned value to

EVAL_BODY_INCLUDE


Put some text in the tag body

chapter 11 45© copyright Janson Industries 2011Change doStartTag to return

EVAL_BODY_INCLUDE


Tag body content (hello) passed to the JSP Writer (and displayed) and

doAfterBody run


Change doStartTag to EVAL_BODY_BUFFERED


Content not passed to JSP writer and no other methods called

However body content is available in a server supplied BodyContent object called

bodyContent


To retrieve body text use bodyContent.getString()


When body content is accessed:1. doInitBody run2. content is returned (and displayed)

3. doAfterBody runThen doEndTag finishes (skips a line) and release is invoked


Can prove that doInitBody and doAfterBody are called by bodyContent.getString()

After bodyContent.getString(), printed a <br> tag Notice that it is printed after the

doAfterBody msgthen the release method invoked


Tag Attributes

▮ Even though the tag handler has full access to the body content...

▮ ...body content not the way to control tag functions or pass info to tag

▮ Tag attributes used to specify tag parameters


Test Tag

▮ Change the tag so that the tag body content can be turned into a hyperlink email addr

▮ With option to specify the email addr

▮ Two tag attributes:

▮ One to specify whether to change to link

▮ One to specify the email addr


<attribute>

<name>link</name>

<required>true</required>

</attribute>

<attribute>

<name>addr</name>

</attribute>

Tag Attributes

▮ Defined with XML in the tag definition

▮ An attribute defined as required true, must be specified in the tag


Current Tag Definition


Tag Attributes

▮ For each attribute, must have a private String of the same name in the tag handler

▮ Tag handler needs setters and getters for each attribute variable

▮ If the attribute is specified in the tag, server will invoke setter in tag handler

▮ Tag handler must check variable to see if function should be performed


private String link;

private String addr;

public String getLink() {

return link; }

public void setLink(String l) {

link = l;}

public String getAddr() {

return addr;}

public void setAddr(String a) {

addr = a;}

Tag Attributes


Link Attribute

▮ When Link is “t”, tag body text must be defined as an email link

▮ If an addr parameter is specified that email addr is used else a default address of [email protected] will be used

▮ This is HTML to define an email link<A href="mailto:emailaddress">


if (link.equals("t")){

pageContext.getOut().write("<A href=\"mailto:");

if (addr == null){

pageContext.getOut().write("[email protected]\">");

}

else{

pageContext.getOut().write(addr + "\">"); }

}

doEndTag

▮ \" forces a " to be written onto page

▮ Will comment out the text printouts in all the methods


New tag handler code

Commented out text printouts


Must specify the required attribute link

62

Move mouse over link to show mail to address


This time specify a address


Save TT, refresh browser, move mouse over link to show new "mail to" address


Business Change

▮ Want to be able to insert and pay POs online

▮ Create a Web based application (using custom tags) to do this

▮ Easier to do this because of MVC▮ Because Model classes are separate

from the View (i.e. Frame) classes, can easily incorporate Client App Model into Web App


Business Change

▮ Need to insert PO info on the Web

▮ Could create a static Web page requiring user to input all the PO info

▮ That would be a lot of repetitive work for the user

▮ Must enter Customer name, item, date for each PO


Inserting a PO

▮ Instead, display all schools (in a DDM using a custom tag) and if the school name exists, populate the JSP with

▮ Customer name

▮ Current date

▮ Last purchase info

▮ Must provide for a new school also


So when user starts the “create PO process” we display a dropdown menu with existing

schools

And if they select an already existing school like Death Valley Univ...


The school name, buyer and previous purchase info is displayed

Also set the purchase date to the current date and have a button to actually insert the PO


And if they specify a new school...


...we can at least set the purchase date

Chapter 872

© copyright Janson Industries 2011

Inserting a PO

View

InsertPOSchool.jsp

User

SalesDB

All POs

Model

TransTable(POBean)

SchoolTagHandler

DDM with

Schools


Inserting a PO

▮ Notice that TransTable is used in the Web-base app

▮ Because we did not embed the business logic/Model (TransTable) in a Frame class, it can be used on the Web

▮ Imagine if you had embedded it:▮ You'd have to recode it for the Web▮ Every change would be done twice, once

for client app and once for Web app!!!


Inserting a PO

▮ Need to copy TransTable class into MyWeb/Java Resources/src/c11 and▮ DBFile▮ AccessFile or DB2File or OracleFile▮ InvalidLengthException

▮ These are the classes that comprise the client apps Model

Chapter 8

75© copyright Janson Industries 2011

After Specifying School Inserting

View Controller

School& purch

info

InsertPOSchool.jsp

User

ProcessPOSchool

(servlet)SalesDB

AddPO.jsp

Redirects

School& purchinfo &PO #

ModelPO #

TransTable(POBean) All PO info

Creates

School


Inserting a PO

▮ TransTable needs a new business function (getSchoolInfo) that

▮ Reads TxTable for a particular school

▮ Populates the TransTable fields associated with that school and the last PO

▮ This is how new business functions for classes come about – changes in business


public void getSchoolInfo(String school) {

read(" WHERE School = '" + school + "'");

this.getSchoolDataFromRS();

}

private void getSchoolDataFromRS() {

try { school = rs.getString(1);

customer = rs.getString(2);

itemName = rs.getString(5);

qty = rs.getInt(4);

price = rs.getDouble(6);

}

catch (SQLException sqlex) {

sqlex.printStackTrace();

System.out.println("\nSQL exception on rs get\n");

}

}

New TransTable Methods


...and tie InsertPOSchool's form to the servlet ProcessPOSchool

Insert custom tag (schoolsDDM) to display schools


schoolsDDM Tag

▮ Invokes SchoolTagHandler

▮ SchoolTagHandler will

▮ Create a TransTable object

▮ Invoke getAllPOs

▮ Generates the HTML that defines a DDM with the schools names


package c11;

import java.io.IOException;

import java.sql.ResultSet;

import java.sql.SQLException;

import javax.servlet.jsp.JspException;

import javax.servlet.jsp.tagext.TagSupport;

public class SchoolTagHandler extends TagSupport {

TransTable tt = new TransTable();

ResultSet allPOsRS;

String schools;

public int doStartTag() throws JspException {

try { pageContext.getOut().write("<select name=\"School\">");

allPOsRS = tt.getAllPOs();

schools = allPOsRS.getString(1);

pageContext.getOut().write(

"<option selected value=\"" + schools + "\">" +

schools + "</option>");

while (allPOsRS.next()) {

schools = allPOsRS.getString(1);

pageContext.getOut().write("<option selected value=\"" +

schools + "\">" + schools + "</option>");}

pageContext.getOut().write("</select>");

} catch (IOException e1) {e1.printStackTrace();

} catch (SQLException e) {e.printStackTrace();}

return super.doStartTag(); } }


Add XML to MyTagLib that defines schoolsDDM and ties it to

c11.SchoolTagHandler


? is now resolved

As an alternative to typing in the taglib directive and tag…


…click on Custom, then the location on the JSP to put the tag

Need to specify the URI, click Add


Scroll down list and click www.mytags.com checkbox

Must also specify a prefix


Select the tag, click Insert, then Close


Run to test


Inserting a PO

▮ New to add a button (when clicked, ProcessPOSchool, a servlet, is invoked)

▮ ProcessPOSchool ▮ Creates a TransTable object▮ Defines it as a bean (POBean)▮ If user entered a new school, sets bean

school property to new school▮ If not, invokes getSchoolInfo (passing the

selected school)▮ Redirects to AddPO.jsp


AddPO

▮ Retrieves data (from POBean) and displays:

▮ School info

▮ Last purchase info

▮ Purchase date


So if user chose Hard Knocks U…

… last PO’s info displayed


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<%@page language="java" contentType="text/html; charset=ISO-8859-1"

pageEncoding="ISO-8859-1"%>

<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<html>

<head>

<title>AddPO</title><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"><meta name="GENERATOR" content="Rational Application Developer">

</head>

<body>

<p align="center">

<font size="5" color="black" face="Tahoma">Please enter the

Purchase Order Information </font>

</p>

<form action="AddPO.jsp" method="post">

<div align="center">

<table border="0">

<tbody>

<tr>

<td align="right"><font size="4" color="blue" face="Verdana">School:</font></td>

<td align="left"><input type="text" name="schoolTF" size="25"

value="${POBean.school}"></td>

</tr>

Will invoke itself when button

clickedUses EL to

retrieve info from POBean


<tr>

<td align="right"><font size="4" color="blue" face="Verdana">Customer:</font></td>

<td align="left"><input type="text" name="custTF" size="30"

value="${POBean.customer}"></td>

</tr>

<tr>

<td align="right"><font size="4" color="blue" face="Verdana">Purchase

Date:</font></td>

<td align="left"><input type="text" name="purchDataTF" size="10"

value="${POBean.purchDate}"></td>

</tr>

<tr>

<td align="right"><font size="4" color="blue" face="Verdana">Item:</font></td>

<td align="left"><input type="text" name="itemTF" size="30"

value="${POBean.itemName}"></td>

</tr>

<tr>

<td align="right"><font size="4" color="blue" face="Verdana">Quantity:</font></td>

<td align="left"><input type="text" name="qtyTF" size="5"

value="${POBean.qty}"></td>

</tr>

<tr>

<td align="right"><font size="4" color="blue" face="Verdana">Price:</font></td>

<td align="left"><input type="text" name="priceTF" size="7"

value="${POBean.price}"></td>

</tr>

<tr>

<td align="right"><font size="4" color="blue" face="Verdana">PO

Number:</font></td>

<td align="left"><input type="text" name="pONumTF" size="10"></td>

</tr>

<tr>

<td align="right"><font size="4" color="blue" face="Verdana">Comments:</font></td>

<td align="left"><input type="text" name="commentsTF"

size="30" maxlength="100"></td>

</tr>

</tbody>

</table>

</div>

<p align="center"><input type="submit" name="SubmitBtn"

value="Add PO"></p>

</form>

</body>

</html>

Gets rest of data from POBean and puts into

textfields


AddPO

▮ When button clicked want to:

▮ Move data from text fields to PO Bean

▮ Write the PO to the DB


<c:if test='${pageContext.request.method=="POST"}'>

<jsp:setProperty name="POBean" property="school" param="schoolTF" />

<jsp:setProperty name="POBean" property="customer" param="custTF" />

<jsp:setProperty name="POBean" property="purchDate" param="purchDateTF" />

<jsp:setProperty name="POBean" property="itemName" param="itemTF" />

<jsp:setProperty name="POBean" property="qty" param="qtyTF"/>

<jsp:setProperty name="POBean" property="price" param="priceTF" />

<jsp:setProperty name="POBean" property="PONum" param="pONumTF" />

<jsp:setProperty name="POBean" property="comments" param="commentsTF" />

</c:if>

There is no setPurchDate that accepts a string


Need to create one


insertPO Tag

▮ Need another tag (insertPO) to invoke the write method

▮ Create InsertPOHandler

▮ Add XML to tag library

▮ Put tag in AddPO.jsp


package c11;

import javax.servlet.jsp.JspException;

import javax.servlet.jsp.tagext.TagSupport;

public class InsertPOHandler extends TagSupport {

TransTable tt;

public int doStartTag() throws JspException {

tt = (TransTable)pageContext.getSession().getAttribute("POBean");

tt.write();

return super.doStartTag();

}

}

Retrieves POBean and invokes the write method


In AddPO, insert the custom tag at the end of the if tag and add the page directive…


and define the prefix


Add the tag


Add a submit button to InsertPOSchool

Must create ProcessPOSchool servlet


package c11;

import java.io.IOException;

import javax.servlet.ServletException;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import javax.servlet.http.HttpSession;

@WebServlet("/ProcessPOSchool")

public class ProcessPOSchool extends HttpServlet {

private static final long serialVersionUID = 1L;

private String school = null;

private TransTable newPO;

public ProcessPOSchool() {

super();

}

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

}


protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

newPO = new TransTable();

newPO.setPurchDate();

school = request.getParameter("schoolTF");

if (school.equals("")){

school = request.getParameter("School");

newPO.getSchoolInfo(school);

}else{

try {

newPO.setSchool(school);

} catch (InvalidLengthException e) {

e.printStackTrace();

}

}

HttpSession session = request.getSession();

session.setAttribute("POBean", newPO);

response.sendRedirect("AddPO.jsp");

}

}


Run InsertPOSchool


Test by entering new school and click Submit


Add PO info and click AddPO


Prove it worked by going back to InsertPOSchool. New school will be in DDM.


Alternatives

▮ Custom tags can invoke JSP code instead of a TagHandler

▮ Need:▮ A new folder called Tags in WEB-INF

▮ A tag file in tags folder with:▮ the tag name as prefix ▮ .tag as suffix

▮ Put JSP code in the tag file

▮ Insert taglib directive and tag in a JSP


Folder and file created, JSP code entered in tag file


Taglib directive ids prefix and location of the tag file

Create JSP to use tag


Run UsingDudeJSP on server


Alternative

▮ Use this technique if JSP code will be used in many JSPs

▮ What actually happens is that the web container creates a tag handler from the JSP in the tag file

▮ Custom tag can receive attributes, pass variables back, & access all objects available to the JSP


Attributes

▮ To define, need an attribute directive in the tag file

▮ JSP using the tag specifies a value for attribute

▮ Tag file uses the attribute value


Dudecolor value accessed using EL then assigned to font's color attribute

In tag file, attribute directive defines dudecolor


UsingDudeJSP sets a value for attribute dudecolor


Run UsingDudeJSP on server (may have to remove app from server to force reload of

dude.tag, then refresh browser)


JSP creates request variable custname and sets value to John. (Also, need taglib directive

to core)

Changed color to green.


Tag gets the custname value using EL and displays


The tag accessed the variable


To access the body of a tag: <jsp:doBody/>Also, tag will display in brown to prove that

tag retrieves and displays the content (not the JSP)


Content in the tag body (changed dudecolor too)


Can define a variable in the tag file with a variable directive (Must have taglib directive

to core)Then use/access via tags and EL


May have to remove app from server to force reload of dude.tag, then refresh browser (or

create a new server to run on)


Points to Remember

▮ Custom tags used to simplify JSP coding

▮ If custom tag tied to tag handler:▮ Tag prefix identifies a taglib directive

▮ Taglib directive identifies the URI

▮ Deployment descriptor ties URI to tag library

▮ Tab library contains the tag definition

▮ Tag definition identifies tag handler to be run

Chapter 111© copyright Janson Industries 2011 Custom Tags ▮ Tag Handlers ▮ XML ▮ Tag...

Documents

Transcript of Chapter 111© copyright Janson Industries 2011 Custom Tags ▮ Tag Handlers ▮ XML ▮ Tag...