You need to sign in to do that
Don't have an account?
Matrix Table in Visualforce Page
Hi,
How to get a matrix table (like a matrix report with two grouping columns) in a visualforce page ? The matrix table should be like follwing image (colors is just for information):
Contractors/PLs | PL 1 | PL 2 | PL 3 | PL 4 |
Contractor 1 | Stage 1 | Stage 1 | Stage 1 |
|
Contractor 2 |
| Stage 2 | Stage 3 | Stage 5 |
Contractor 3 |
|
| Stage 4 |
|
Contractor 4 |
First line (Blue) --> get values for custom field PL__c (this is the first dimension
First column (green) --> get values for custom field Contractor__c (the the second dimension)
Content of the other cells (Orange) --> Stage__c
Except the top cell which will be the header (Red).
All the best,
Anzar,
Thanks for help,
This is a static table. Whet i need is get the values from SFDC using APEX and formatting the results in a matrix table. The html table should looks like the table described by "reddygari403", however the data comes from SOQL. I think that we need apex:repeat element to loop over rows.
All Answers
I suspect you'll need to use a wrapper class for this and just produce a regular HTML table based on iterating a list of them. There's an example of doing something along these lines in a blog post of mine at:
http://bobbuzzard.blogspot.co.uk/2010/09/rotating-visualforce-table.html
(Unfortunately the images have gone awol in that post, but the sample code is there)
Thanks for help.
My question is how to get two headers (as displayed in my previous post) with values from two custom fields. Just like in a matrix report. The fisrt line for (PL__c) and the first Column (Contractor__c)
If you use a custom or extension controller you can retrieve whatever records you like through SOQL.
I know this, my issue is how formatting the table to get a matrix one in the visualforce page.
Thanks a lot for helping.
That's where the wrapper class comes in. The way I've done this before is to create a list of row classes, each of which contains a list of cells. Each cell contains its data and formatting information. The VF page then iterates the rows, iterates the cells and draws a regular HTML table.
Any simple code to do this ?
Thanks,
Only extending the code in the blog post I linked to above.
<apex:page >
<html>
<body>
<table border='1'>
<tr>
<th><font color='#F11B1B'>Contractors/PLs</font></th>
<th><font color='#5141DF'>PL 1</font></th>
<th><font color='#5141DF'>PL 2</font></th>
<th><font color='#5141DF'>PL 3</font></th>
<th><font color='#5141DF'>PL 4</font></th>
</tr>
<tr>
<th><font color='#7CFC00'>Contractor 1</font></th>
<td><font color='#FFA500'>Stage 1</font></td>
<td><font color='#FFA500'>Stage 1</font></td>
<td><font color='#FFA500'>Stage 1</font></td>
<td> </td>
</tr>
<tr><th><font color='#7CFC00'>Contractor 2</font></th>
<td> </td>
<td>Stage 2</td>
<td>Stage 3</td>
<td>Stage 5</td>
</tr>
<tr><th><font color='#7CFC00'>Contractor 3</font></th>
<td> </td>
<td> </td>
<td><font color='#FFA500'>Stage 4</font></td>
<td> </td></tr>
<tr><th><font color='#7CFC00'>Contractor 4</font></th>
<td> </td>
<td> </td>
<td> </td>
<td> </td></tr>
</table>
</body>
</html>
</apex:page>
Thanks for help,
This is a static table. Whet i need is get the values from SFDC using APEX and formatting the results in a matrix table. The html table should looks like the table described by "reddygari403", however the data comes from SOQL. I think that we need apex:repeat element to loop over rows.
<apex:page standardController="Contact">
<html>
<body>
<table border='1'>
<tr>
<th><font color='#F11B1B'>Sales for {!contact.name}</font></th>
<th>VA</th>
<th>VAVE</th>
<th>VA5</th>
<th>VA6</th>
<th>VA7</th>
<th>MF</th>
<th>PlusMF</th>
<th>MYGA</th>
<th>FIA</th>
<th>PFIA</th>
<th>TOTALS</th>
</tr>
<tr>
<th>LTD</th>
<td>{!contact.LTD_Sales_VA__c}0</td>
<td>{!contact.LTD_Sales_VAVE__c}0</td>
<td>{!contact.LTD_Sales_VAVE5__c}0</td>
<td>{!contact.LTD_Sales_VAVE6__c}0</td>
<td>{!contact.LTD_Sales_VAVE7__c}0</td>
<td>{!contact.LTD_Sales_MF__c}0</td>
<td>{!contact.LTD_Sales_Plus_MF__c}0</td>
<td>{!contact.LTD_Sales_MYGA2__c}0</td>
<td>{!contact.LTD_Sales_FIA__c}0</td>
<td>{!contact.LTD_Sales_PFIA__c}0</td>
<td>{!contact.LTD_Sales_Total__c}0</td>
</tr>
<tr><th>YTD</th>
<td>{!contact.YTD_LiveWell_VA_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_VAVE_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_VAVE5_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_VAVE6_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_VAVE7_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_MF_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_Plus_MF_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_MYGA_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_FIA_Sales__c}0</td>
<td>{!contact.YTD_LiveWell_PFIA_Sales__c}0</td>
<td>{!contact.Total_YTD_MF_VA_Sales__c}0</td>
</tr>
<tr><th>Monthly</th>
<td>{!contact.Monthly_LiveWell_VA_Sales__c}0</td>
<td>{!contact.Monthly_LiveWell_VAVE_Sales__c}0</td>
<td>{!contact.Monthly_LiveWell_VAVE5_Sales__c}0</td>
<td>{!contact.Monthly_LiveWell_VAVE6_Sales__c}0</td>
<td>{!contact.Monthly_LiveWell_VAVE7_Sales__c}0</td>
<td>{!contact.Monthly_LiveWell_MF_Sales__c}0</td>
<td>{!contact.Monthly_LiveWell_Plus_MF_Sales__c}0</td>
<td>{!contact.Monthly_LiveWell_MYGA_Sales__c}0</td>
<td>{!contact.Monthly_LiveWell_FIA_Sales__c}0</td>
<td>{!contact.Monthly_LIveWell_PFIA_Sales__c}0</td>
<td>{!contact.Total_Monthly_MF_VA_Sales__c}0</td>
</tr>
<tr><th>AUM</th>
<td>{!contact.AUM_LiveWell_VA_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_VAVE_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_VAVE5_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_VAVE6_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_VAVE7_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_MF_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_Plus_MF_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_MYGA_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_FIA_Sales__c}0</td>
<td>{!contact.AUM_LiveWell_PFIA_Sales__c}0</td>
<td></td>
</tr>
<tr><th>Date of Last Sale</th>
<td>{!contact.Date_of_Last_VA_Sale__c}</td>
<td>{!contact.Date_of_Last_VAVE_Sales__c}</td>
<td>{!contact.Date_of_Last_VAVE5_Sale__c}</td>
<td>{!contact.Date_of_Last_VAVE6_Sale__c}</td>
<td>{!contact.Date_of_Last_VAVE7_Sale__c}</td>
<td>{!contact.Date_of_Last_MF_Sale__c}</td>
<td>{!contact.Date_of_Last_Sale_Plus_MF__c}</td>
<td>{!contact.Date_of_Last_MYGA_Sale__c}</td>
<td>{!contact.Date_of_Last_FIA_Sale__c}</td>
<td>{!contact.Date_of_Last_PFIA_Sales__c}</td>
</tr>
<tr><th>Amount of Last Sale</th>
<td>{!contact.Amount_of_Last_Sale_VA__c}0</td>
<td>{!contact.Amount_of_last_VAVE_Sales__c}0</td>
<td>{!contact.Amount_of_Last_Sale_VAVE5__c}0</td>
<td>{!contact.Amount_of_Last_Sale_VAVE6__c}0</td>
<td>{!contact.Amount_of_Last_Sale_VAVE7__c}0</td>
<td>{!contact.Amount_of_Last_Sale_MF__c}0</td>
<td>{!contact.Amount_of_Last_Sale_Plus_MF__c}0</td>
<td>{!contact.Amount_of_Last_Sale_MYGA__c}0</td>
<td>{!contact.Amount_of_Last_Sale_FIA__c}0</td>
<td>{!contact.Amount_of_Last_Sale_PFIA__c}0</td>
</tr>
<tr><th>Total Contracts Sold</th>
<td>{!contact.Total_LiveWell_VA_Contracts_Sold__c}</td>
<td>{!contact.Total_LiveWell_VAVE_Contracts_Sold__c}</td>
<td>{!contact.Total_LIveWell_VAVE5_Accounts_Sold__c}</td>
<td>{!contact.Total_LiveWell_VAVE6_Accounts_Sold__c}</td>
<td>{!contact.Total_LiveWell_VAVE7_Accounts_Sold__c}</td>
<td>{!contact.Total_LiveWell_MF_Accounts_Sold__c}</td>
<td>{!contact.Total_LiveWell_Plus_MF_Accounts_Sold__c}</td>
<td>{!contact.Total_LiveWell_MYGA_Accounts_Sold__c}</td>
<td>{!contact.Total_LiveWell_FIA_Accounts_Sold__c}</td>
<td>{!contact.Total_LIveWell_PFIA_Contracts_Sold__c}</td>
</tr>
</table>
</body>
</html>
</apex:page>
<tr><th>Date of Last Sale</th>
<td><apex:outputText value="{0,date,MM/dd/yy}">
<apex:param value="{!contact.Date_of_Last_VA_Sale__c}"/>
</apex:outputText>
</td>
Is this solved. If so, can you share the solution as i have a similar requirement.
Need an output as below in the custom visualforce.