[richfaces-svn-commits] JBoss Rich Faces SVN: r2496 - trunk/docs/userguide/en/src/main/docbook/included.
richfaces-svn-commits at lists.jboss.org
richfaces-svn-commits at lists.jboss.org
Sun Aug 26 09:30:46 EDT 2007
Author: vkorluzhenko
Date: 2007-08-26 09:30:46 -0400 (Sun, 26 Aug 2007)
New Revision: 2496
Added:
trunk/docs/userguide/en/src/main/docbook/included/scrollableDataTable.desc.xml
trunk/docs/userguide/en/src/main/docbook/included/scrollableDataTable.xml
Log:
http://jira.jboss.com/jira/browse/RF-447 - added new component
Added: trunk/docs/userguide/en/src/main/docbook/included/scrollableDataTable.desc.xml
===================================================================
--- trunk/docs/userguide/en/src/main/docbook/included/scrollableDataTable.desc.xml (rev 0)
+++ trunk/docs/userguide/en/src/main/docbook/included/scrollableDataTable.desc.xml 2007-08-26 13:30:46 UTC (rev 2496)
@@ -0,0 +1,35 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<section>
+<sectioninfo>
+<keywordset>
+ <keyword>scrollableDataTable</keyword>
+</keywordset>
+</sectioninfo>
+<section>
+<title>Description</title>
+ <para>The <emphasis role="bold">
+ <property><rich:scrollableDataTable></property>
+ </emphasis> component is used to represent the tabular data.</para>
+ <figure>
+ <title><rich:scrollableDataTable> component</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata fileref="images/scrollableDataTable.png"/>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ </section>
+ <section>
+ <title>Key Features</title>
+ <itemizedlist>
+ <listitem>Highly customizable look and feel</listitem>
+ <listitem>Variable content of the table cells</listitem>
+ <listitem>Dynamically fetching the rows from the server when the table is scrolled up and down</listitem>
+ <listitem>Resizing columns by mouse dragging the column bar</listitem>
+ <listitem>Sorting column by clicking the header</listitem>
+ <listitem>Fixed one or more left columns when table is scrolled horizontally</listitem>
+ <listitem>One and multi-selection rows mode</listitem>
+ <listitem>Built-it drag-n-drop support</listitem>
+ </itemizedlist>
+</section>
+</section>
\ No newline at end of file
Added: trunk/docs/userguide/en/src/main/docbook/included/scrollableDataTable.xml
===================================================================
--- trunk/docs/userguide/en/src/main/docbook/included/scrollableDataTable.xml (rev 0)
+++ trunk/docs/userguide/en/src/main/docbook/included/scrollableDataTable.xml 2007-08-26 13:30:46 UTC (rev 2496)
@@ -0,0 +1,226 @@
+<?xml version='1.0' encoding='UTF-8'?>
+
+<section>
+ <sectioninfo>
+ <keywordset>
+ <keyword>scrollableDataTable</keyword>
+ </keywordset>
+ </sectioninfo>
+
+ <table>
+ <title>Component identification parameters </title>
+ <tgroup cols="2">
+ <thead>
+ <row>
+ <entry>Name</entry>
+ <entry>Value</entry>
+ </row>
+ </thead>
+ <tbody>
+ <row>
+ <entry>component-type</entry>
+ <entry>org.richfaces.component.ScrollableDataTable</entry>
+ </row>
+ <row>
+ <entry>component-class</entry>
+ <entry>org.richfaces.component.html.HtmlScrollableDataTable</entry>
+ </row>
+ <row>
+ <entry>component-family</entry>
+ <entry>org.richfaces.component.ScrollableDataTable</entry>
+ </row>
+ <row>
+ <entry>renderer-type</entry>
+ <entry>org.richfaces.renderkit.html.ScrollableDataTableRenderer</entry>
+ </row>
+ <row>
+ <entry>tag-class</entry>
+ <entry>org.richfaces.taglib.ScrollableDataTableTag</entry>
+ </row>
+ </tbody>
+ </tgroup>
+ </table>
+
+ <section>
+ <title>Creating the Component with a Page Tag</title>
+ <para>Here is a simple example as it could be used on a page:</para>
+
+ <para>
+ <emphasis role="bold">Example:</emphasis>
+ </para>
+ <programlisting role="XML"><![CDATA[...
+ <rich:scrollableDataTable value="#{dataTableScrollerBean.allCars}" var="category">
+ <!--...//Set of columns and header/footer facets-->
+ </rich:scrollableDataTable>
+...
+]]></programlisting>
+ </section>
+ <section>
+ <title>Dynamical creation from Java code</title>
+
+ <para>
+ <emphasis role="bold">Example:</emphasis>
+ </para>
+ <programlisting role="JAVA"><![CDATA[import org.richfaces.component.html.HtmlScrollableDataTable;
+...
+HtmlScrollableDataTable myScrollableDataTable = new HtmlScrollableDataTable();
+...
+]]></programlisting>
+ </section>
+ <!--section>
+ <title>Details of Usage</title>
+ <para>The <property>table</property> component is very similar to the custom JSF dataTable one,
+ except for the common peculiarities of any rich component:</para>
+ <itemizedlist>
+ <listitem>Skin support. The <property>table</property> completely meets a three-class
+ principle of Rich Faces skinnability</listitem>
+ <listitem>Support of Ajax updates for a limited set of strings</listitem>
+ </itemizedlist>
+ <para>Skins support is described in the <link linkend="ArchitectureOverview">corresponding
+ section</link>. Ajax support is possible because the component is created basing on the
+ <emphasis role="bold">
+ <property><a4j:repeat></property>
+ </emphasis> component and as a result the component has its possibilities of Ajax updates for
+ a limited set of strings. The component is implemented with the <emphasis>
+ <property>"ajaxKeys"</property>
+ </emphasis> attribute for a <property>table</property> and in contrast to the <emphasis
+ role="bold">
+ <property><a4j:repeat></property>
+ </emphasis> outputs the standard HTML structure for table rendering.</para>
+
+ <para>
+ <emphasis role="bold">Example:</emphasis>
+ </para>
+ <programlisting role="XML"><![CDATA[...
+ <rich:dataTable value="#{capitalsBean.capitals}" var="capitals"
+ ajaxKeys="#{bean.ajaxSet}" binding="#{bean.table}" id="table">
+ <Set of columns and header/footer facets>
+ </rich:dataTable>
+...
+ <a4j:commandButton action="#{bean.someAction}" reRender="table"/>
+...
+]]></programlisting>
+ <para>For such a table during <property>someAction</property> method processing called with AJAX
+ request when the key is pressed it's possible to fill in lot's of ajaxKeys
+ with strings indices that are to be updated. A resulting output on the client contains only
+ required strings and they are updated in the tree, even when update is specified for the whole
+ table.</para>
+
+ </section>
+ <section>
+ <title>Look-and-Feel Customization</title>
+ <para>For skinnability implementation the components use a <emphasis>
+ <property>style class redefinition method</property>
+ </emphasis>.</para>
+ <para>Default style classes are mapped on <emphasis><property>skin
+ parameters</property>.</emphasis></para>
+ <para>To redefine appearance of all dataTables at once, there are two ways:</para>
+ <itemizedlist>
+ <listitem>to redefine corresponding skin parameters</listitem>
+ <listitem>to add <emphasis>
+ <property>style classes</property>
+ </emphasis> used by the dataTable to your page style sheets</listitem>
+ </itemizedlist>
+ </section>
+
+ <section>
+ <title>Definition custom Style Classes</title>
+ <figure>
+ <title>DataTable class names</title>
+ <mediaobject>
+ <imageobject>
+ <imagedata fileref="images/dataTable2.gif"/>
+ </imageobject>
+ </mediaobject>
+ </figure>
+ <para>On the screenshot there are class names defining the marked elements.</para>
+
+ <table>
+ <title>Component skin classes</title>
+ <tgroup cols="2">
+ <thead>
+ <row>
+ <entry>Class name</entry>
+ <entry>An element defined with a class</entry>
+ </row>
+ </thead>
+ <tbody>
+ <row>
+ <entry>rich-table</entry>
+ <entry>Applied to the <emphasis><property>"table"</property></emphasis> element</entry>
+ </row>
+ <row>
+ <entry>rich-table-caption</entry>
+ <entry>Applied to facet="caption"</entry>
+ </row>
+ <row>
+ <entry>rich-table-header</entry>
+ <entry>Applied to a whole header "header"</entry>
+ </row>
+ <row>
+ <entry>rich-table-headercell</entry>
+ <entry>Applied to a particular cell of a header "header"</entry>
+ </row>
+ <row>
+ <entry>rich-table-subheader</entry>
+ <entry>Applied to the whole subheader "header"</entry>
+ </row>
+ <row>
+ <entry>rich-table-subheadercell</entry>
+ <entry>Applied to a particular cell of subheader "header"</entry>
+ </row>
+ <row>
+ <entry>rich-table-cell</entry>
+ <entry> Applied to a particular table cell</entry>
+ </row>
+ <row>
+ <entry>rich-table-row</entry>
+ <entry>Applied to the whole table row</entry>
+ </row>
+ <row>
+ <entry>rich-table-subfooter</entry>
+ <entry>Applied to the whole subheader "footer"</entry>
+ </row>
+ <row>
+ <entry>rich-table-subfootercell</entry>
+ <entry>Applied to a particular subheader "footer"</entry>
+ </row>
+ <row>
+ <entry>rich-table-footer</entry>
+ <entry>Applied to the whole "footer"</entry>
+ </row>
+ <row>
+ <entry>rich-table- footercell</entry>
+ <entry>Applied to the specific of "footer"</entry>
+ </row>
+ </tbody>
+ </tgroup>
+ </table>
+ <para>To redefine an appearance of all <property>tables</property> on a page, redefine the
+ corresponding class in the CSS file used with the page.</para>
+ <para>To redefine a style of a particular page, use <emphasis>
+ <property>"component class"</property>
+ </emphasis> attributes which list is the same as the <property>dataTable</property> one and is
+ known to you.</para>
+ </section>
+ <section>
+ <title>Relevant resources links</title>
+ <para>
+ <ulink url="http://livedemo.exadel.com/richfaces-demo/richfaces/dataTable.jsf?c=dataTable"
+ >Here</ulink> you can see the example of <emphasis role="bold"
+ ><rich:dataTable></emphasis> usage and sources for the given example. </para>
+ <para>The article about <emphasis role="bold"><rich:dataTable></emphasis>
+ flexibility can be found <ulink url="http://labs.jboss.com/wiki/RichFacesArticleDataTable"
+ >here</ulink>.</para>
+ <para>More information about using <emphasis role="bold"
+ ><rich:dataTable></emphasis> and <emphasis role="bold"
+ ><rich:subTable></emphasis> could be found on the <ulink
+ url="http://www.jboss.com/index.html?module=bb&op=viewtopic&p=4059044#4059044">RichFaces Users Forum.</ulink>
+ </para>
+ <para>How to use <emphasis role="bold"><rich:dataTable></emphasis> and <emphasis
+ role="bold"><rich:dataScroller></emphasis> in a context of Extended
+ Data Model see <ulink
+ url="http://www.jboss.com/index.html?module=bb&op=viewtopic&t=115636"
+ >here</ulink>.</para>
+ </section-->
+</section>
More information about the richfaces-svn-commits
mailing list