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/18 19:25:42 UTC

svn commit: r233337 - /beehive/trunk/docs/forrest/release/src/documentation/content/xdocs/pageflow/pageflow_datagrid.xml

Author: ekoneil
Date: Thu Aug 18 10:25:39 2005
New Revision: 233337

URL: http://svn.apache.org/viewcvs?rev=233337&view=rev
Log:
Add additional data grid documentation on paging.

BB: self
DRT: build.release pass


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=233337&r1=233336&r2=233337&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 Thu Aug 18 10:25:39 2005
@@ -390,8 +390,83 @@
 to render a data grid:
     <br/>    
       <img alt="Data Grid with Implicit Object Pager" src="images/netui/datagrid/datagridSimpleWithImplicitObjectPager.png"/>
-    <br/>    
+    <br/>   
+It can also be useful to disable the data grid's automatic rendering of the pager by setting the 
+<code>disableDefaultPager</code> as:
+</p>
+<source>
+    &lt;netui-data:configurePager disableDefaultPager="true"/>
+</source>
+<p>
+With this attribute set, the data grid will not render any pager UI.  The page author can then explicitly place the 
+pager inside of the grid using the <code>&lt;netui-data:renderPager></code> tag.  For example, the pager can be placed
+in the footer of the data grid with:
+</p>
+<source>
+    &lt;netui-data:dataGrid dataSource="pageScope.pets" name="pets">
+        &lt;netui-data:configurePager pageSize="2" disableDefaultPager="true"/>
+        &lt;netui-data:rows>
+            &lt;netui-data:spanCell value="${container.item.petId}"/>
+            &lt;netui-data:spanCell value="${container.item.name}"/>
+            &lt;netui-data:spanCell value="${container.item.description}"/>
+            &lt;netui-data:spanCell value="${container.item.price}"/>
+        &lt;/netui-data:rows>
+        &lt;netui-data:footer>
+            &lt;tr>&lt;td colspan="4">&lt;netui-data:renderPager/>&lt;/td>&lt;/tr>
+        &lt;/netui-data:footer>
+    &lt;/netui-data:dataGrid>
+</source>
+<p> 
+With the pager disabled, custom pager UI can be built anywhere inside of the data grid tags using the grid's 
+implicit objects.  The following example builds a custom pager that provides "jump to page" functionality via an HTML select box,
+for example:
         </p>
+<source>
+      &lt;netui-data:dataGrid dataSource="pageScope.pets" name="pets">
+          &lt;netui-data:configurePager defaultPageSize="2" pagerFormat="firstPrevNextLast" disableDefaultPager="true"/>
+          &lt;netui-data:header>
+              &lt;netui-data:headerCell headerText="Name"/>
+              &lt;netui-data:headerCell headerText="Description"/>
+              &lt;netui-data:headerCell headerText="Price"/>
+          &lt;/netui-data:header>
+          &lt;netui-data:rows>
+              &lt;netui-data:spanCell value="${container.item.name}"/>
+              &lt;netui-data:spanCell value="${container.item.description}"/>
+              &lt;netui-data:spanCell value="${container.item.price}"/>
+          &lt;/netui-data:rows>
+          &lt;netui-data:footer>
+            &lt;td colspan="2" align="left">
+              &lt;netui-data:renderPager/>
+            &lt;/td>
+            &lt;td colspan="1" align="right">
+                 &lt;c:if test="${dataGrid.dataSet.size > 0}">
+                  &lt;form name="pageForm" action="simple-pager-jumptopage.jsp">
+                    Jump to Page:
+                &lt;script type="text/javascript">
+                  function doPagerSubmit(comp)
+                  {
+                    var form = document.forms["pageForm"];
+                    form.method="GET";
+                    form.submit();
+                  }
+                  &lt;/script>
+                  &lt;select name="${dataGrid.urlBuilder.pagerRowQueryParamKey}" onchange="doPagerSubmit(this); return true;">
+                    &lt;netui-data:repeater dataSource="dataGrid.urlBuilder.pagerParamValues">
+                    &lt;c:choose>
+                      &lt;c:when test="${container.index == dataGrid.state.pagerModel.page}">
+                        &lt;option value="${container.item}" selected="true">${container.index+1}&lt;/option>
+                      &lt;/c:when>
+                      &lt;c:otherwise>
+                        &lt;option value="${container.item}">${container.index+1}&lt;/option>
+                      &lt;/c:otherwise>
+                    &lt;/c:choose>
+                    &lt;/netui-data:repeater>
+                  &lt;/select>
+                &lt;/c:if>
+            &lt;/td>
+          &lt;/netui-data:footer>
+      &lt;/netui-data:dataGrid>
+</source>
     </section>
 </section>
 </body>