[Cocoon Wiki] Update of "cmnogueira" by cmnogueira

[Apache Wiki <wi...@apache.org>]

Dear Wiki user,

You have subscribed to a wiki page or wiki category on "Cocoon Wiki" for change notification.

The following page has been changed by cmnogueira:
http://wiki.apache.org/cocoon/cmnogueira

New page:
==  CFORMS: Dinamically display radio buttons on a table ==
- TARGET-AUDIENCE: '''*advanced*''' [[BR]]
- COCOON-RELEASES: 2.1.7[[BR]]
- DOCUMENT-STATUS: '''*draft*''' reviewed released[[BR]]
----
=== What you will get from this page ===
A piece of code that can dramatically ease the use of radio buttons on a cforms page.

=== Your basic skills ===
Take a while to understand how cforms various actions example work. 
XSL knowledge is also necessary to understand the code i wrote.

=== Technical prerequisites ===
All the xsl files under cocoon\samples\blocks\forms\resources.

At least the following xml files under cocoon\samples\blocks\forms\

form1.xml

form1_template_action.xml



Later you can remove the ones you don't wan't to use.
--------------------------------------------------------
As you might have noticed the current xsl provided with the cforms example is quite limited.
I needed to display something like this:
 
||radiobutton1||radiobutton2||radiobutton3||
||radiobutton4||radiobutton5||radiobutton6||

To achieve this efect follow these steps:

1. Edit forms-field-styling.xsl

1.1 Inside this file look for this line
{{{
<xsl:template match="fi:field[fi:selection-list][fi:styling/@list-type='radio']" priority="2">
}}}

1.2 Add the following variable line
{{{
<xsl:variable name="column" select="number(fi:styling/@column)"/>
}}}

1.3 Look for the  <xsl:otherwise>. Replace this hole section with this code
{{{
<xsl:otherwise>
<xsl:call-template name="produceColumns">
  <xsl:with-param name="nos" select="fi:selection-list/fi:item"/>
  <xsl:with-param name="id" select="$id"/>
  <xsl:with-param name="value" select="$value"/>
  <xsl:with-param name="column" select="$column"/>
</xsl:call-template>
</xsl:otherwise>
}}}

1.4 Create the template produceColumns with the following code
{{{
<xsl:template name="produceColumns">
	
 <xsl:param name="nodes"/>	
 <xsl:param name="id"/>
 <xsl:param name="value"/>
 <xsl:param name="column"/>
 <xsl:variable name="elements" select="count($nodes)"/>
 
 <tr>
      <xsl:for-each select="$nodes">
      <xsl:variable name="temp" select="($elements)-(count(following-sibling::*))"/>
      <td>
            <input type="radio" id="{generate-id()}" name="{$id}" value="{@value}">
            <xsl:if test="@value = $value">
	       <xsl:attribute name="checked">checked</xsl:attribute>
	    </xsl:if>  	

	    <xsl:apply-templates select="../.." mode="styling"/>
	    </input>

	    <xsl:apply-templates select="." mode="label">
	    <xsl:with-param name="id" select="generate-id()"/>
	    </xsl:apply-templates>		
      </td>

	    <xsl:if test="($temp mod $column)=0">			
            <xsl:call-template name="produceColumns">
	        <xsl:with-param name="nos" select="descendant::fi:item"/>
		<xsl:with-param name="id" select="$id"/>
		<xsl:with-param name="value" select="$value"/>
		<xsl:with-param name="column" select="$column"/>
	    </xsl:call-template>
	    </xsl:if>
      </xsl:for-each>
			
</tr>
</xsl:template>
}}}

2. Edit form1.xml declare the following widget:
{{{
<fd:field id="test">
 <fd:label>
  this is a test
 </fd:label>
 
 <fd:datatype base="string"/>
  <fd:selection-list>
   <fd:item value="radiobutton1"/>
   <fd:item value="radiobutton2"/>
   <fd:item value="radiobutton3"/>
   <fd:item value="radiobutton4"/>
   <fd:item value="radiobutton5"/>
   <fd:item value="radiobutton6"/>
   </fd:selection-list>
  </fd:field> 
}}}


3. Edit form1_template_action.xml declare the use of the previous widget where you think
is more convenient for you:
{{{
<table border="0">
  <ft:widget id="test">
  <fi:styling list-type="radio" list-orientation="horizontal" column="3"/>
  </ft:widget> 
</table>
}}}

4. Voilá! This should now produce a table with 3 columns. As you have 6 radiobuttons,
the number of lines will be determined by (6 items/3 columns) = 2 lines.

||radiobutton1||radiobutton2||radiobutton3||
||radiobutton4||radiobutton5||radiobutton6||




===  page metadata ===
- AUTHOR:CarlosMiguelNogueira[[BR]]
- AUTHOR-CONTACT: mailto:cmsbn@student.dei.uc.pt[[BR]]
- REVIEWED-BY:[[BR]]
- REVIEWER-CONTACT:[[BR]]