How to get switch group functionality for each row in a table using jsf

Question

How to get the layout as shown below using the h:selectOneRadioenclosed inrich:dataTable

row1   col1   col2   col3

row2   radio1 radio1 radio1

row3   radio2 radio2 radio2

Answer 1

I think there are three ways to do this:

• Use the components of Tomahawk <t:selectOneRadio>and <t:radio>as described by Bozho . This is the simplest solution. The only drawback is that you need to integrate another component library ( Tomahawk) into the project . However, this library is compatible with other libraries such as Richfaces or Icefaces .

• . , , , Tomahawk ...

• <h:selectOneRadio/>, Javascript, , . , , . , <h:selectManyCheckbox> pageDirection lineDirection. pageDirection, HTML-, , Javascript.

, JSF:

<h:selectManyCheckbox id="rolesSelection" value="#{myRolesBean.selectedRoles}" layout="pageDirection">
    <f:selectItems value="#{myRolesBean.RolesList}"/>
</h:selectManyCheckbox>

<script type="text/javascript">
    splitElementsIntoTwoColumns("myForm\\:rolesSelection");
</script>

Javascript ( jQuery, Richfaces):

function splitElementsIntoTwoColumns(tableId) {
    var idx = 1;
    var row, next;
    while ((row = jQuery('#' + tableId + ' tr:nth-child(' + idx++ + ')')).length) {
        if ((next = jQuery('#' + tableId + ' tr:nth-child(' + idx + ')')).length) {
            row.append(next.find('td'));
            next.remove();
        }
    }
}

( )

Javascript , , <rich:datatable>.

Answer 2

Tomahawk <t:selectOneRadio> layout="spread" <t:radio> <rich:column>