Creating a visualization for a custom component tag

  1. Creating a visualizer plug-in

  2. Updating the plugin.xml file for a VCT

In this task, you will first create a JSP file using the run-time workbench. Then, you will add a VCT to the JSP page.

  1. Now you can run the visualizer in the run-time workbench.

    1. Select

      Run | Run from the menu. The

      Create, manage and run configurations wizard page is displayed.

    2. Select

      Eclipse Application, and display the context menu. In the context menu, select

      New menu item..

  2. Click

    Run. The run-time workbench is displayed.

  3. In a Dynamic Web project, use Page Designer to edit a JSP file with the visual custom tag. Make sure you have a taglib directive. (However, the actual TLD file is not required.) For example: <%@taglib uri="/WEB-INF/lib/sample.jar" prefix="vct" %>. See the example that follows for a sample JSP page.

  4. Add the following VCT tag to your JSP file: <vct:date/>. Place the tag where you want to display the current date and time.

  5. Select Display >Visually Render JSP Components from the menu. The VCT tag is rendered so that you see the actual date and time in Page Designer.

You have now written a visualizer and successfully used a VCT on your JSP page. You should be able to view an actual date and time in Page Designer.

Here is a sample JSP page with the VCT-related tags in bold:

<HTML>
<HEAD>
<%@ taglib uri="/WEB-INF/lib/sample.jar" prefix="vct" %>
<%@ page
language="java"
contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"
%>
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<META name="GENERATOR" content="IBM® WebSphere® Studio">
<META http-equiv="Content-Style-Type" content="text/css">
<LINK href="theme/Master.css" rel="stylesheet" type="text/css">
<TITLE>index.jsp</TITLE>
</HEAD>
<BODY>
The current date and time is:
<vct:date/>
</BODY>
</HTML>

 

Related concepts

Custom tag libraries

Visual custom tags (VCTs)

 

Related tasks

Creating visual custom tags (VCTs)

Creating a visualizer plug-in

Updating the plugin.xml file for a VCT