function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion

dataTable Columns attribute not working

I'm trying to create a single pageblocktable where Columns="3" that will move every 4th item to a new row in the table.


I thought that by assigning the Columns attribute that SFDC would automatically move the 4th column to a new row, but instead they just start piling up on the right side of the screen, after the first 3 columns display correctly.


Currently I'm having to close each pageblock table after three columns, then and start a new data table underneath it. This is working, but it doesn't seem right to have to do that.


I've alsdo tried using the dataTable, but the same problem happens.


Here's my VF example:

<apex:pageBlockTable value="{!Service}" var="SVC" columns="3" columnsWidth="400px,400px,400px" width="100%" align="center">
         <apex:column >
           <apex:facet name="header">CustomerID: </apex:facet>
              <font size="3" color="black">{!Order.CustomerID__c}</font>
         <apex:column >
           <apex:facet name="header">MVNO: </apex:facet>
              <font size="3" color="black">{!Order.CustomerID__r.MVNO_Partner__r.Name}</font>
         <apex:column >
           <apex:facet name="header">Transaction Type: </apex:facet>
              <font size="3" color="black">{!Order.OrderType__r.OrderTypeDescription__c}</font>
          <apex:pageBlockTable value="{!Service}" var="SVC" columns="3" columnsWidth="300px,300px,300px" width="100%" align="center">
         <apex:column >
           <apex:facet name="header">ServiceID: </apex:facet>
              <font size="3" color="black">{!SVC.Name}</font>
         <apex:column >
           <apex:facet name="header">&nbsp;MVNO Market </apex:facet>
              <font size="3" color="black">&nbsp;{!SVC.MVNOMarketId__r.DisplayName__c}</font>
          <apex:column > &nbsp;

 I'm not really that fluent in HTML, so I'm kind of winging it here as far as formatting a page to look half-way decent. The above works as far as organizing the fields in more or less aligned rows. Width, Columnswidth, and align are kind of sketchy as well. Align doesn't seem to move anything. I realize I am probably using these wrong, but again, I'm having to trial-and-error this thing into shape.


Any help is appreciated.









Let me understand your issue correctly.


So you want to display data in 2 consequtive rows of 3 columns each right below other like below, correct?


Customer Id  |  MVNO_Partner_Name | Order Description

SVC Name    |  MVNO Market                  | -


If so you should use <apex:repeat> tag along with <tr> <td>


See the example below:


<apex:repeat var="r" value="{!test}">