Hi,

I have a Visualforce page where I am displaying a multipicklist field as checkboxes.I am facing an issue with the allignment of the checkboxes in the page.I want my checkboxes to be displayed in 5 rows and 5 columns.

I have tried 2 approaches for doing this:

1) Using a wrapper class to bind the checkbox to the picklist field and then displaying them in the page by looping through a data table.

2)I also tried using the selectcheckboxes option.

My problem is that i get the checkbox bound to my picklist value.But the allignment is distorted(either all in same row or in 1 column).

So,i tried using a style class which will provide me the tabular display of the values in the datatable.But still this doesnt help.

Here is the javascript i used:

<script>

window.onload = init;

 function init() {

tables = document.getElementsByTagName("table");

for (i = 0; i < tables.length; i++) {

table = tables[i];

if (table.className == 'makeRows') {

makeRows(table,4);

}

}

}

function makeRows(table, columnCount) {

cells = table.rows[0].cells;

cellCount = cells.length;

rowCount = Math.ceil(cellCount / columnCount);

for (i = 0; i < rowCount; i++) {

table.insertRow(0);

}

for (i = 0; i < cellCount; i++) {

row = Math.floor(i / columnCount);

table.rows[row].appendChild(cells[i].cloneNode(true));

}

table.deleteRow(rowCount);

}

</script>

The datatable in my page looks like:

<apex:dataTable value="{!IndustryValues}" var="ind" styleClass="makeRows" >

<apex:column >

<apex:inputCheckbox value="{!ind.selected}"/>

<apex:outputText value="{!ind.induswrap}" />

</apex:column>

</apex:dataTable>

Please help me to find a solution to this problem.The styleclass seems to have no effect in the datatable.I am totally lost..

Thanks & Regards,

Vinny