WebWork2教程（中文版）(4.1.1)

来源：互联网发布：常德市优化办工作人员编辑：程序博客网时间：2024/06/11 18:22

4.1.1、WebWork UI标记

（1）创建表单

WebWork UI标记和HTML标记很相似，很容易从它的名字辨认出。你可以直接使用这些标记创建表单，和HTML标记的区别在于：参数使用双引号和单引号括起，这是因为要和Value Stack中的名字区分。看下面的例子：

ex01-index.jsp：

<%@ taglib uri="WebWork" prefix="ww" %>

<html>

<head>

<title>WebWork Tutorial - Lesson 4.1.1 - Example 1</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">

       .errorMessage { color: red; }

</style>

</head>

<body>

<p>UI Form Tags Example:</p>

<ww:form action="'formProcessing.action'" method="'post'">

       <ww:checkbox name="'checkbox'" label="'A checkbox'" fieldValue="'checkbox_value'" />

       <ww:file name="'file'" label="'A file field'" />

       <ww:hidden name="'hidden'" value="'hidden_value'" />

       <ww:label label="'A label'" />

       <ww:password name="'password'" label="'A password field'" />

       <ww:radio name="'radio'" label="'Radio buttons'" list="{'One', 'Two', 'Three'}" />

       <ww:select name="'select'" label="'A select list'" list="{'One', 'Two', 'Three'}"

              emptyOption="true" />

       <ww:textarea name="'textarea'" label="'A text area'" rows="'3'" cols="'40'" />

       <ww:textfield name="'textfield'" label="'A text field'" />

       <ww:submit value="'Send Form'" />

</ww:form>

</body>

</html>

经WebWork处理后的HTML结果如下：

<html>

<head>

<title>WebWork Tutorial - Lesson 4.1.1 - Example 1</title>

<style type="text/css">

  .errorMessage { color: red; }

</style>

</head>

<body>

<p>UI Form Tags Example:</p>

<table>

<form action="formProcessing.action" method="post" >

<tr><td valign="top" colspan="2">

<table width="100%" border="0" cellpadding="0" cellspacing="0">

<tr><td valign="top">

<input type="checkbox" name="checkbox" value="checkbox_value" />

</td>

<td width="100%" valign="top">

<span class="checkboxLabel">

A checkbox

</span>

</td></tr>

</table>

</td></tr>

<tr><td align="right" valign="top">

<span class="label">

A file field:

</span>

</td>

<td>

<input type="file" name="file" />

</td></tr>

    <input type="hidden" name="hidden" value="hidden_value" />

<tr><td align="right" valign="top">

<span class="label">

A label:

</span>

</td>

<td>

<label> </label>

</td></tr>

<tr><td align="right" valign="top">

<span class="label">

A password field:

</span>

</td>

<td>

<input type="password" name="password" />

</td></tr>

<tr><td align="right" valign="top">

<span class="label">

Radio buttons:

</span>

</td>

<td>

<input type="radio" name="radio" id="radioOne" value="One" />

<label for="radioOne">One</label>

<input type="radio" name="radio" id="radioTwo" value="Two" />

<label for="radioTwo">Two</label>

<input type="radio" name="radio" id="radioThree" value="Three" />

<label for="radioThree">Three</label>

</td></tr>

<tr><td align="right" valign="top">

<span class="label">

A select list:

</span>

</td>

<td>

<select name="select">

<option value=""></option>

<option value="One">One</option>

<option value="Two">Two</option>

<option value="Three">Three</option>

</select>

</td></tr>

<tr><td align="right" valign="top">

<span class="label">

A text area:

</span>

</td>

<td>

<textarea name="textarea" cols="40" rows="3" ></textarea>

</td></tr> <script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 160x600, 创建于 08-4-23MSDN */google_ad_slot = "4367022601";google_ad_width = 160;google_ad_height = 600;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>