From richfaces-svn-commits at lists.jboss.org Tue Nov 8 15:00:36 2011 Content-Type: multipart/mixed; boundary="===============2283243236034851185==" MIME-Version: 1.0 From: richfaces-svn-commits at lists.jboss.org To: richfaces-svn-commits at lists.jboss.org Subject: [richfaces-svn-commits] JBoss Rich Faces SVN: r22910 - in modules/docs/trunk/Component_Reference/src/main/docbook/en-US: extras and 2 other directories. Date: Tue, 08 Nov 2011 15:00:36 -0500 Message-ID: <201111082000.pA8K0aXh008073@svn01.web.mwc.hst.phx2.redhat.com> --===============2283243236034851185== Content-Type: text/plain; charset="utf-8" MIME-Version: 1.0 Content-Transfer-Encoding: quoted-printable Author: bleathem Date: 2011-11-08 15:00:36 -0500 (Tue, 08 Nov 2011) New Revision: 22910 Added: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/exa= m-Component_Reference-richpickList-ItemLabel_use.xml_sample modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/exa= m-Component_Reference-richpickList-richcolumn_use.xml_sample modules/docs/trunk/Component_Reference/src/main/docbook/en-US/images/fig= u-Component_Reference-richpickList-richpickList.png modules/docs/trunk/Component_Reference/src/main/docbook/en-US/skinning/t= abl-richpickList.xml Modified: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/chap-Compo= nent_Reference-Rich_inputs.xml Log: RFPL-1575: Documented the pickList Modified: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/cha= p-Component_Reference-Rich_inputs.xml =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D --- modules/docs/trunk/Component_Reference/src/main/docbook/en-US/chap-Comp= onent_Reference-Rich_inputs.xml 2011-11-08 16:14:18 UTC (rev 22909) +++ modules/docs/trunk/Component_Reference/src/main/docbook/en-US/chap-Comp= onent_Reference-Rich_inputs.xml 2011-11-08 20:00:36 UTC (rev 22910) @@ -2260,7 +2260,7 @@
<sgmltag><rich:orderingList></sgmltag> - The <rich:orderingList> is a componen= t for ordering items in a list. This component allows one to reorder a list= and sort it on the client side. + The <rich:orderingList> is a componen= t for ordering items in a list (client-side). =
@@ -2280,7 +2280,7 @@
Basic usage - To use the <rich:orderingList> bind the value attribute to the list to be ordered. This var= attribute specifies a variable to use when iterating through the= list values. The var attribute is used within the itemLabel to assign the object value to be displayed. Simil= arly, the var attribute is used within the item= Value attribute to specify the object value mapped by the display= value. If the itemValue is not of type String, a c= onverter must be specified for this itemValue using either the con= verter attribute, or a nested <f:converter> tag. + To use the <rich:orderingList> bind the value attribute to the list to be ordered. The var<= /varname> attribute specifies a variable to use when iterating through the = list values. The var attribute is used within the itemLabel to assign the object value to be displayed. Simila= rly, the var attribute is used within the itemV= alue attribute to specify the object value mapped by the display = value. If the itemValue is not of type String, a co= nverter must be specified for this itemValue using either the conv= erter attribute, or a nested <f:converter> tag. ItemLabel/ItemValue use @@ -2294,14 +2294,14 @@ - The arrow keys on a keyboard can be used to highlight different items = in the list. Pressing ctrl modifier with the arrow keys w= ill move the selected item up or down within the list. + The arrow keys on a keyboard can be used to highlight different items = in the list. Pressing the ctrl modifier with the arrow ke= ys will move the selected item up or down within the list.
=
Column Layout - In addition to the above simple itemLabel display, the <ri= ch:orderingList> supports a columnar layout of the itemValues = to be sorted. This is achieved by nesting <rich:column> tags within the ordering list, and referencing the var attribute from within the <rich:column> EL. + In addition to the above simple itemLabel display, the <ri= ch:orderingList> supports a columnar layout of the itemValues = to be sorted. This is achieved by nesting <rich:column> tags within the orderingList, and referencing the var attribute from within the <rich:column> EL. Nested <sgmltag><rich:column></sgmltag> tags @@ -2407,6 +2407,163 @@
+ = + +
+ <sgmltag><rich:pickList></sgmltag> + + The <rich:pickList> is a component fo= r selecting items from a list. Additionally, it allows for the selected it= ems to be ordered (client-side). From the client side perspective, items a= re added/removed from the source list, and removed/added to the target list= . However it is important to note that the server-side source of items is = never modified, and always represents the list of all items available for s= election. If the list of unselected items is required, it can be determine= d by subtracting the collection of all selected items from the collection o= f all available items. + = +
+ <sgmltag><rich:select></sgmltag> + + + + + + + A <rich:pickList> component. + + + +
+ +
+ Basic usage + + To use the <rich:pickList> bind the = value attribute to the target list, where the selected items will= be stored. The list of source items is provided by nesting a S= electItem source, such as a <f:selectItems> tag, or a list of <f:selectItem> tags. If t= he itemValue of the SelectItem is not of type String, a converter must be specified for this itemValue u= sing either the converter attribute, or a nested <f:converter> tag. + + + Simple pickList use + + + Using the default SelectItem itemLabel = to generate the pickList source and target items. + + + + + + + + The items in the target list can be ordered client-side by= setting the orderable attribute of the <ric= h:pickList> tag to true. The arrow keys on a key= board can then be used to highlight different items in the target list, and= pressing the ctrl modifier with the arrow keys will move = the selected item up or down within the target list. + +
+ +
+ Column Layout + + In addition to the above simple SelectItem item= Label display, the <rich:pickList> supports a colu= mnar layout of the items to be selected. This is achieved by adding a var attribute used to represent the collection of nested SelectItems, and nesting <rich:column> tags within the pickList. The var attribute of= the <f:selectItem> is then referenced from within= the <rich:column> EL. + + + Nested <sgmltag><rich:column></sgmltag> tags + + + Using <rich:column> tags nested withi= n the <rich:pickList> + + + + + + +
+ +
+ JavaScript API + + The <rich:pickList> component can be cont= rolled through the JavaScript API. The JavaScript API provides the followin= g functions: + + + + getSourceList() + + + Returns the javascript list object backing the &= lt;rich:pickList> source list. This list can be used to selec= t/unselect item(s). + + + + + getTargetList() + + + Returns the javascript list object backing the &= lt;rich:pickList> target list. This list can be used to selec= t/unselect item(s). + + + + + add() + + + Add the currently selected items to the target list, remo= ving them from the source list. + + + + + addAll() + + + Add all the source items to the target list, removing the= m from the source list. + + + + + remove() + + + Remove the currently selected items from the target list,= adding them to the source list. + + + + + removeAll() + + + Remove all the source items from the target list, adding = them to the source list. + + + + + toggleButtons() + + + Activate/de-activate the pickList buttons based on the cu= rrent component item state. + + + + +
+ +
+ Reference data + + + + component-type: org.richfaces.Pick= List + + + + + component-class: org.richfaces.com= ponent.UIPickList + + + + + component-family: org.richfaces.Se= lectMany + + + + + renderer-type: org.richfaces.PickL= istRenderer + + + +
+ +
+ Style classes and skin parameters + +
+
+ = Added: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras= /exam-Component_Reference-richpickList-ItemLabel_use.xml_sample =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D --- modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/ex= am-Component_Reference-richpickList-ItemLabel_use.xml_sample = (rev 0) +++ modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/ex= am-Component_Reference-richpickList-ItemLabel_use.xml_sample 2011-11-08 20:= 00:36 UTC (rev 22910) @@ -0,0 +1,7 @@ + + + + \ No newline at end of file Added: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras= /exam-Component_Reference-richpickList-richcolumn_use.xml_sample =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D --- modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/ex= am-Component_Reference-richpickList-richcolumn_use.xml_sample = (rev 0) +++ modules/docs/trunk/Component_Reference/src/main/docbook/en-US/extras/ex= am-Component_Reference-richpickList-richcolumn_use.xml_sample 2011-11-08 20= :00:36 UTC (rev 22910) @@ -0,0 +1,16 @@ + + + + + Flag + + + + Name + #{capital.name} + + + State + #{capital.state} + + \ No newline at end of file Added: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/images= /figu-Component_Reference-richpickList-richpickList.png =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D (Binary files differ) Property changes on: modules/docs/trunk/Component_Reference/src/main/docboo= k/en-US/images/figu-Component_Reference-richpickList-richpickList.png ___________________________________________________________________ Added: svn:mime-type + application/octet-stream Added: modules/docs/trunk/Component_Reference/src/main/docbook/en-US/skinni= ng/tabl-richpickList.xml =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D= =3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D=3D --- modules/docs/trunk/Component_Reference/src/main/docbook/en-US/skinning/= tabl-richpickList.xml (rev 0) +++ modules/docs/trunk/Component_Reference/src/main/docbook/en-US/skinning/= tabl-richpickList.xml 2011-11-08 20:00:36 UTC (rev 22910) @@ -0,0 +1,244 @@ + + + + + Style classes (selectors) and corresponding skin parameters + + + + + + + + Class (selector) + Skin Parameters + Mapped CSS properties + + + + = + + + + + .rf-pick + + + This class defines styles for the pickList control itself. + + + + + + No skin parameters. + + = + + + + + .rf-pick-cntr + + + This class defines styles for the container of the pickList contr= ol. + + + + + + No skin parameters. + + + + + + + .rf-pick-src-cptn, .rf-pick-t= gt-cptn + + + These classes define styles for the so= urce and target captions of the pickList control. + + + + + + headerTextColor= + color + + + headerSizeFont<= /entry> + font-size + + + headerFamilyFont + font-family + + + headerWeightFont + font-weight + + + + + + + .rf-pick-lst + + + This class defines styles for the items list of the pickList cont= rol. + + + + + + No skin parameters. + + = + + + + + .rf-pick-hdr + + + This class defines styles for the header of the items list. + + + + + + headerBackgroundColor<= /para> + background-color + + + headerTextColor= + color + + + headerSizeFont + font-size + + + headerFamilyFont + font-family + + + headerWeightFont + font-weight + + + + + + + .rf-pick-opt + + + This class defines styles for an option in the pickList control. + + + + + + generalTextColor + color + + + generalSizeFont + font-size + + + generalFamilyFont + font-family + + = + + + + + .rf-pick-sel + + + This class defines styles for the selected option of the pickList= control. + + + + + + generalTextColor + border-color + + = + + + + + .rf-pick-dflt-lbl + + + This class defines styles for the default label of the pickList c= ontrol. + + + + + + No skin parameters. + + = + + + + + .rf-pick-btn + + + This class defines styles for the button of the pickList control. + + + + + + headerBackgroundColor + background-color + + + panelBorderColor + border-left-color + + = + + + + + .rf-pick-btn-dis + + + This class defines styles for the button of the pickList control = when it is disabled. + + + + + + No skin parameters. + + = + + + + + .rf-pick-lst-scrl + + + This class defines styles for the list scrollbar. + + + + + + No skin parameters. + + = + + +
--===============2283243236034851185==--