tags的布局

在xhtml theme中，组件都会被自动生成<tr><td>,结合form自动生成的<table>，构成表格。
在css_xhtml theme中，自动生成的是<div>.以下讨论的都是基于css_xhtml theme。
在ajax theme中，也自动生成<tr><td>，原因：
<#if parameters.label?if_exists != "">
 <#include "/${parameters.templateDir}/xhtml/controlheader.ftl" />。

ajax组件， 如sx:datetimepicker
<sx:datetimepicker name="appdate" cssClass="app" cssStyle="display:inline;" label="Date of Application"
     displayFormat="yyyy-MM-dd" value="%{'today'}" /></td>
生成的最终代码是：
<tr>
    <td class="tdLabel"><label for="widget_1751767510" class="label">Date of Application:</label></td>
    <td><div
     dojoType="struts:StrutsDatePicker"    id="widget_1751767510"    value="2012-02-01T22:03:48"    name="appdate"    inputName="dojo.appdate"    class="app"

   style="display:inline;"    displayFormat="yyyy-MM-dd"  saveFormat="rfc"></div>
    </td>
</tr>
<script language="JavaScript" type="text/javascript">djConfig.searchIds.push("widget_1751767510");</script>

通过设置style="display:inline;"（将div的块级别作用化解掉），两个datetimepicker可以在同一行中呈现（tr和td不起作用，因为没有包含在<table>里）。
但如果放到<table>中的话（虽然包含在一个大的<td>里），tr和td将起作用，即使设置了style="display:inline;"，datetimepicker仍然形成新的行，不能和其他组件在同一行

中呈现。
---------------------------------------
一般struts2的ui组件，如s:textfield,
方法1：将该类组件放在<table>的<td>中，可以保证即使是<div>也可以在同一行输出(设置labelposition="left"，保证label和text输入框在同一行)。
方法2：
如编写
<s:textfield name="locatio"  label="Location(City)"  labelposition="left" cssStyle="display:inline;"/>
生成的最终代码是：
<div id="wwgrp_LeaveRequest_locatio" class="wwgrp">

<span id="wwlbl_LeaveRequest_locatio" class="wwlbl">
<label for="LeaveRequest_locatio" class="label">       
Location(City):
</label>
</span>

<span id="wwctrl_LeaveRequest_locatio" class="wwctrl">
<input type="text" name="locatio" value="" id="LeaveRequest_locatio" style="display:inline;"/>
</span>
</div>
可见其结构为一个div下包含label和text两个组件。通过锚定其整体的div，其class="wwgrp"，在css文件中设置：
.wwgrp{
 display:inline;
}
可使该类ui组件在同一行中呈现（同样也要设置labelposition="left"）。

通过设置labelposition="left"，是将label和text组件设置成span，如labelposition="top"（default），则为div。
在<s:textfield>中设置cssStyle="display:inline;"只是将<input type="text">的组件设成display:inline;并不能使其整体的div呈现inline。

注意labelposition="left"设置与否产生的区别
<s:textfield name="locati"  label="Location(City)" />
生成的最终代码是：
<div id="wwgrp_LeaveRequest_locati" class="wwgrp">

<div id="wwlbl_LeaveRequest_locati" class="wwlbl">
<label for="LeaveRequest_locati" class="label">       
Location(City):
</label>
</div> <br />

<div id="wwctrl_LeaveRequest_locati" class="wwctrl">
<input type="text" name="locati" value="" id="LeaveRequest_locati"/>
</div>
</div>

---------------------------------------
通过对ajax组件设置cssStyle="display:inline;"，对一般ui组件通过设置整体的div为display:inline;两者结合可使ajax组件和一般ui组件在同一行布局。