You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@beehive.apache.org by ek...@apache.org on 2005/08/16 01:42:05 UTC
svn commit: r232907 - in
/beehive/trunk/docs/forrest/release/src/documentation:
content/xdocs/pageflow/ resources/images/netui/
resources/images/netui/datagrid/
Author: ekoneil
Date: Mon Aug 15 16:41:55 2005
New Revision: 232907
URL: http://svn.apache.org/viewcvs?rev=232907&view=rev
Log:
Additional data grid doc work.
BB: self
DRT: build.release pass
Added:
beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/
beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/
beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimple.png (with props)
beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithAnchor.png (with props)
beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithFormatter.png (with props)
beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithHeader.png (with props)
Modified:
beehive/trunk/docs/forrest/release/src/documentation/content/xdocs/pageflow/pageflow_datagrid.xml
Modified: beehive/trunk/docs/forrest/release/src/documentation/content/xdocs/pageflow/pageflow_datagrid.xml
URL: http://svn.apache.org/viewcvs/beehive/trunk/docs/forrest/release/src/documentation/content/xdocs/pageflow/pageflow_datagrid.xml?rev=232907&r1=232906&r2=232907&view=diff
==============================================================================
--- beehive/trunk/docs/forrest/release/src/documentation/content/xdocs/pageflow/pageflow_datagrid.xml (original)
+++ beehive/trunk/docs/forrest/release/src/documentation/content/xdocs/pageflow/pageflow_datagrid.xml Mon Aug 15 16:41:55 2005
@@ -34,10 +34,46 @@
This data grid binds to a List of PetBean objects stored in the PageContext's attribute map and renders an HTML table
that is four cells wide (ie four columns) containing the petId, name, description, and price fields. The rendered table
would appear as:
+ <br/>
+ <img src="images/netui/datagrid/datagridSimple.png" alt="Simple data grid"/>
+ <br/>
</p>
+<!--
<source>
- <strong>TODO</strong>
+<table class="datagrid">
+ <tr class="datagrid-even">
+ <td class="datagrid"><span>dog1</span></td>
+ <td class="datagrid"><span>Golden Retriever</span></td>
+ <td class="datagrid"><span>Dog</span></td>
+ <td class="datagrid"><span>99.99</span></td>
+ </tr>
+ <tr class="datagrid-odd">
+ <td class="datagrid"><span>dog2</span></td>
+ <td class="datagrid"><span>Cocker spaniel</span></td>
+ <td class="datagrid"><span>Cocker spaniel</span></td>
+ <td class="datagrid"><span>89.99</span></td>
+ </tr>
+ <tr class="datagrid-even">
+ <td class="datagrid"><span>dog3</span></td>
+ <td class="datagrid"><span>Labrador Retriever</span></td>
+ <td class="datagrid"><span>Black Labrador dog</span></td>
+ <td class="datagrid"><span>79.99</span></td>
+ </tr>
+ <tr class="datagrid-odd">
+ <td class="datagrid"><span>fish1</span></td>
+ <td class="datagrid"><span>Koi</span></td>
+ <td class="datagrid"><span>Fish</span></td>
+ <td class="datagrid"><span>199.99</span></td>
+ </tr>
+ <tr class="datagrid-even">
+ <td class="datagrid"><span>fish2</span></td>
+ <td class="datagrid"><span>Barracuda</span></td>
+ <td class="datagrid"><span>Fish</span></td>
+ <td class="datagrid"><span>199.99</span></td>
+ </tr>
+</table>
</source>
+-->
<p>
The values for the cells are specified with a JSP 2.0 expression and can reference any implicit object. In this case, an
expression like <code>${container.item.petId}</code> references an implicit object called <code>container</code> that the
@@ -64,18 +100,22 @@
<source>
<netui-data:dataGrid dataSource="pageScope.pets" name="petGrid">
<netui-data:rows>
- <netui-data:spanCell value="${container.item.petId}"/>
<netui-data:spanCell value="${container.item.name}"/>
<netui-data:spanCell value="${container.item.description}"/>
<netui-data:spanCell value="${container.item.price}"/>
+ <netui-data:anchorCell value="Details" action="details">
+ <netui:parameter name="id" value="${container.item.petId}"/>
+ </netui-data:anchorCell>
</netui-data:rows>
</netui-data:dataGrid>
</source>
<p>
-This data grid displays <strong>TODO</strong>.
+This data grid displays three columns of text with a fourth column containing HTML anchors.
+Though it's not visible in the image, each anchor contains an HTTP request parameter
+with name <code>id</code> and value <code>${container.item.petId}</code>.
<br/>
<br/>
- <strong>TODO</strong>
+ <img alt="Data Grid with Anchor" src="images/netui/datagrid/datagridSimpleWithAnchor.png"/>
<br/>
<br/>
</p>
@@ -104,21 +144,52 @@
<p>
The data grid rendered here will have a single HTML table row that contains header cells
with titles for the data columns. This table might appear as:
-<br/>
-<br/>
- <strong>TODO</strong>
-<br/>
-<br/>
+ <br/>
+ <img alt="Data Grid with Header" src="images/netui/datagrid/datagridSimpleWithHeader.png"/>
+ <br/>
</p>
</section>
<section id="datagrid-cell-formatting">
<title>Formatting Cells</title>
- <p><strong>TODO</strong></p>
+ <p>
+The NetUI formatter tags can also be applied to data grid cells. For example, a cell containing
+a Date object could be formatted using:
+ </p>
+<source>
+ <netui-data:dataGrid dataSource="pageScope.pets" name="pets">
+ <netui-data:header>
+ <netui-data:headerCell headerText="Name"/>
+ <netui-data:headerCell headerText="Invoice Date"/>
+ </netui-data:header>
+ <netui-data:rows>
+ <netui-data:spanCell value="${container.item.name}"/>
+ <netui-data:spanCell value="${container.item.invoiceDate}">
+ <netui:formatDate pattern="M/dd/yy"/>
+ </netui-data:spanCell>
+ </netui-data:rows>
+ </netui-data:dataGrid>
+</source>
+<p>
+which would render a data grid where the formatted column has dates in M/dd/yy format:
+ <br/>
+ <img alt="Data Grid with Formatter" src="images/netui/datagrid/datagridSimpleWithFormatter.png"/>
+ <br/>
+</p>
</section>
</section>
<section id="datagrid-styles-support">
<title>Adding Styles to the Data Grid</title>
- <p><strong>TODO</strong></p>
+ <p>
+The data grid has three ways to apply styles to the rendered HTML elements including table rows,
+cells, captions, and the HTML table itself. By default, the data grid renders a set of HTML
+style class names which can be used in conjunction with a user-provided CSS file to automatically
+apply styles to the grid. The default CSS names for various data grid regions are as follows:
+
+In addition, the style information can be customized by the page author in two ways via the
+<code>style</code> and <code>styleClass</code> attributes. Many of the data grid tags provide
+these attributes and set the HTML <code>style</code> and <code>class</code> attributes on
+rendered HTML elements.
+ </p>
<section id="datagrid-style">
<title>Style Attributes</title>
<p><strong>TODO</strong></p>
Added: beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimple.png
URL: http://svn.apache.org/viewcvs/beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimple.png?rev=232907&view=auto
==============================================================================
Binary file - no diff available.
Propchange: beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimple.png
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithAnchor.png
URL: http://svn.apache.org/viewcvs/beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithAnchor.png?rev=232907&view=auto
==============================================================================
Binary file - no diff available.
Propchange: beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithAnchor.png
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithFormatter.png
URL: http://svn.apache.org/viewcvs/beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithFormatter.png?rev=232907&view=auto
==============================================================================
Binary file - no diff available.
Propchange: beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithFormatter.png
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithHeader.png
URL: http://svn.apache.org/viewcvs/beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithHeader.png?rev=232907&view=auto
==============================================================================
Binary file - no diff available.
Propchange: beehive/trunk/docs/forrest/release/src/documentation/resources/images/netui/datagrid/datagridSimpleWithHeader.png
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream