Author: ochikvina Date: 2009-09-25 12:28:29 -0400 (Fri, 25 Sep 2009) New Revision: 15670 Modified: branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_scrollableDataTable.xml Log: https://jira.jboss.org/jira/browse/RF-7913 - the component review and restructuring the tables of style classes; Modified: branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_scrollableDataTable.xml =================================================================== --- branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_scrollableDataTable.xml 2009-09-25 16:03:41 UTC (rev 15669) +++ branches/community/3.3.X/docs/userguide/en/src/main/docbook/included/rich_scrollableDataTable.xml 2009-09-25 16:28:29 UTC (rev 15670) @@ -75,12 +75,12 @@ optionally resizable. Resizing is available using "drag and drop" of the column vertical borders. <!--There is possibility to expand or collapse the columns through JS API on the client side. -->You can define - the number of the fixed columns from the left side using attribute <emphasis> + the number of the fixed columns from the left side using the <emphasis> <property>"frozenColCount"</property> - </emphasis> that is not scrolled via horizontal scroll. </para> - <para> There is possibility to increase component performance using attribute <emphasis> + </emphasis> attribute that is not scrolled via horizontal scroll. </para> + <para> There is possibility to increase component performance using the <emphasis> <property>"hideWhenScrolling"</property> - </emphasis>. If attribute value is "true" data is + </emphasis> attribute. If the attribute value is "true" data is hidden during scrolling. </para> <para> It's possible to select the whole row with onclick on the row or @@ -109,14 +109,14 @@ </listitem> </itemizedlist--> <para> It's possible to sort the table content after - clicks on the header. The feature is optional (to disable it, use attribute sortable on rich:column ). Every column should be + clicks on the header. The feature is optional (to disable it, use the <emphasis> + <property>&quot;sortable&quot;</property></emphasis> attribute in <emphasis role="bold"> + <property>&lt;rich:column&gt;</property></emphasis>). Every column should be pointed to the comparator method that is used for sorting the table. In case the <emphasis role="bold"> <property>&lt;rich:scrollableDataTable&gt;</property> </emphasis> is already sorted by some column and the header of this column has been clicked again - the sorting is reversed. </para> - <para>After sorting selection that was made before is reset</para> - <para> <emphasis role="bold">The typical variant of using:</emphasis> </para> @@ -149,12 +149,8 @@ <ulink url="&apidoc_framework;org/richfaces/model/selection/Selection.html"> <code>org.richfaces.model.selection.Selection</code> - </ulink>. - interface - - - interface, containing current collection of objects selected by you.</para> - <para>In the following example when you submit the form, current collection of + </ulink> interface, containing the current collection of objects selected by you.</para> + <para>In the following example when you submit the form, the current collection of the selected objects is placed in the object's property. Then on complete action the <emphasis role="bold"> <property>&lt;rich:modalPanel&gt;</property> @@ -222,8 +218,8 @@ </mediaobject> </figure> <para> - <ulink url="http://wiki.jboss.org/wiki/RichFacesCookbook/ScrollableDataTabl... RichFaces LiveDemo page </ulink> you can find fuller example of use of this - attribute with example bean.</para> + <ulink url="http://wiki.jboss.org/wiki/RichFacesCookbook/ScrollableDataTabl... RichFaces LiveDemo page </ulink> you can find the fuller example of usage of this + attribute as well as the example bean.</para> <para> The <emphasis role="bold"> <property>&lt;rich:scrollableDataTable&gt;</property> </emphasis> component has the following extra attributes for event @@ -273,10 +269,11 @@ </listitem> </itemizedlist> - <para>From version 3.3.1 it becomes possible to switch selection mode with selectionMode attribute</para> + <para>Starting with the 3.3.1 version of the components framework it becomes possible to switch selection mode with the <emphasis> + <property>&quot;selectionMode&quot;</property></emphasis> attribute.</para> - <para>Information about sorting and filtering you can find in RichFaces Developer guide section about<link linkend="sort">sorting</link>.</para> - <para> Information about the <emphasis> + <para>Information about sorting and filtering you can find in the RichFaces Developer guide section about <link linkend="sort">sorting</link>.</para> + <para> Information on the <emphasis> <property>"process"</property> </emphasis> attribute usage you can find in the <link linkend="process"> "Decide what to process" </link> guide section. </para> @@ -355,133 +352,151 @@ </tbody> </tgroup> </table> - <table id="scrdattableC"> - <title>Classes names that define a component appearance</title> - - <tgroup cols="2"> - <thead> - <row> - <entry>Class name</entry> - - <entry>Description</entry> - </row> - </thead> - - <tbody> - <row> - <entry>rich-sdt</entry> - - <entry>Defines styles for a component - appearance</entry> - </row> - - </tbody> - </tgroup> - </table> - <table> - <title>Classes names that define footer and header elements</title> - - <tgroup cols="2"> - <thead> - <row> - <entry>Class name</entry> - - <entry>Description</entry> - </row> - </thead> - - <tbody> - - <row> - <entry>rich-sdt-header-cell</entry> - - <entry>Defines styles for header - cells</entry> - </row> - - <row> - <entry>rich-sdt-header-row</entry> - - <entry>Defines styles for a header - raw</entry> - </row> - - <row> - <entry>rich-sdt-column-cell</entry> - - <entry>Defines styles for column - cells</entry> - </row> - <row> - <entry>rich-sdt-footer-cell</entry> - - <entry>Defines styles for footer - cells</entry> - </row> - - <row> - <entry>rich-sdt-footer-row</entry> - - <entry>Defines styles for a footer - raw</entry> - </row> - <row> - <entry>rich-sdt-hsep</entry> - - <entry>Defines styles for header - separators</entry> - </row> - - </tbody> - </tgroup> - </table> - <table> - <title>Classes names that define different states</title> - - <tgroup cols="2"> - <thead> - <row> - <entry>Class name</entry> - - <entry>Description</entry> - </row> - </thead> - - <tbody> - - <row> - <entry>rich-sdt-row-active</entry> - - <entry>Defines styles for an active - row</entry> - </row> - - <row> - <entry>rich-sdt-row-selected</entry> - - <entry>Defines styles for a selected - row</entry> - </row> - - <row> - <entry>rich-sdt-column-sort-up</entry> - - <entry>Defines styles for ascending - sorted column</entry> - </row> - - <row> - <entry>rich-sdt-column-sort-down</entry> - - <entry>Defines styles for descending - sorted column</entry> - </row> - </tbody> - </tgroup> - </table> - You can find all necessary information about style classes redefinition in + + <table> + <title>Style classes (selectors) with the corresponding skin parameters</title> + <tgroup cols="4"> + <thead> + <row> + <entry>Class (selector) name</entry> + <entry>Description</entry> + <entry>Skin Parameters</entry> + <entry>CSS properties mapped</entry> + + </row> + </thead> + <tbody> + <row> + <entry morerows="2">.rich-sdt</entry> + <entry morerows="2">Defines styles for a component appearance</entry> + <entry>tableBackgroundColor</entry> + <entry>background-color</entry> + </row> + <row> + <entry>tableBorderColor</entry> + <entry>border-color</entry> + </row> + <row> + <entry>tableBorderWidth</entry> + <entry>border-width</entry> + </row> + + <row> + <entry>.rich-std-header-row</entry> + <entry>Defines styles for a header raw</entry> + <entry>headerBackgroundColor</entry> + <entry>background-color</entry> + </row> + + <row> + <entry morerows="4">.rich-sdt-header-cell</entry> + <entry morerows="4">Defines styles for header cells</entry> + <entry>tableBorderWidth</entry> + <entry>border-bottom-width, border-right-width</entry> + </row> + <row> + <entry>tableBorderColor</entry> + <entry>border-bottom-color, border-right-color</entry> + </row> + <row> + <entry>headerTextColor</entry> + <entry>color</entry> + </row> + <row> + <entry>generalFamilyFont</entry> + <entry>font-family</entry> + </row> + <row> + <entry>generalSizeFont</entry> + <entry>font-size</entry> + </row> + + <row> + <entry>.rich-sdt-hsplit</entry> + <entry></entry> + <entry>tipBorderColor</entry> + <entry>border-right-color</entry> + </row> + + <row> + <entry>.rich-std-footer-row</entry> + <entry>Defines styles for a footer raw</entry> + <entry>tableSubfooterBackgroundColor</entry> + <entry>background-color</entry> + </row> + + <row> + <entry>.rich-sdt-footer-cell</entry> + <entry>Defines styles for footer cells</entry> + <entry>tableBorderColor</entry> + <entry>border-right-color</entry> + </row> + + <row> + <entry>.rich-sdt-column-cel</entry> + <entry>Defines styles for column cells</entry> + <entry>tableBorderColor</entry> + <entry>border-bottom-color, border-right-color</entry> + </row> + + <row> + <entry>.rich-sdt-row-selected</entry> + <entry>Defines styles for a selected row</entry> + <entry>additionalBackgroundColor</entry> + <entry>background-color</entry> + </row> + + <row> + <entry>.rich-sdt-row-active</entry> + <entry>Defines styles for an active row</entry> + <entry>tabDisabledTextColor</entry> + <entry>color</entry> + </row> + + <row> + <entry morerows="1">.rich-sdt-header-cell-body, .rich-sdt-column-cell-body, .rich-sdt-footer-cell-body</entry> + <entry morerows="1">Define styles for the component cells body</entry> + <entry>generalFamilyFont</entry> + <entry>font-family</entry> + </row> + <row> + <entry>generalSizeFont</entry> + <entry>font-size</entry> + </row> + </tbody> + </tgroup> + </table> + + <table id="scrdattableC"> + <title>Style classes (selectors) without skin parameters</title> + <tgroup cols="2"> + <thead> + <row> + <entry>Class name</entry> + <entry>Description</entry> + </row> + </thead> + <tbody> + <row> + <entry>.rich-sdt-hsep</entry> + <entry>Defines styles for header separators</entry> + </row> + + <row> + <entry>.rich-sdt-column-sort-up</entry> + <entry>Defines styles for ascending sorted column</entry> + </row> + + <row> + <entry>.rich-sdt-column-sort-down</entry> + <entry>Defines styles for descending sorted column</entry> + </row> + </tbody> + </tgroup> + </table> + <para>You can find all necessary information about style classes redefinition in <link linkend="customstyles">Definition of Custom Style Classes</link> - section. + section.</para> </section> <section> <title>Relevant Resources Links</title> @@ -490,7 +505,9 @@ <property>&lt;rich:scrollableDataTable&gt;</property> </emphasis> usage. </para> <para>Cookbook article <ulink url="http://www.jboss.org/community/docs/DOC-11857"> - Scrollable dataTable Selection Usage - </ulink> provides a simple example of how you can use the "selection" attribute in order to get row selection in rich:scrollableDataTable. </para> + Scrollable dataTable Selection Usage</ulink> provides a simple example of how you can use the <emphasis> + <property>&quot;selection&quot;</property></emphasis> attribute in order to get row selection in <emphasis role="bold"> + <property>&lt;rich:scrollableDataTable&gt;</property>. + </emphasis></para> </section> </section>