You need to sign in to do that
Don't have an account?
Create Data Grid in Visualforce page?
Hi All,
I would like to create a grid on visualforce page.
Like
Target col1 col2 col3 col4 col5 ............... col..n
T1 row11 row21 row31 row41 row51 row..n
T2 row12 row22 row32 row42 row52 row..n
T3 row13 row23 row33 row43 row53 row..n
T4 row14 row24 row34 row44 row54 row..n
T..n
Here i have to display dynamically like row 11,row12,row13,row4 according to col1.
Please help me to how to iterate the list in such matrix. if you have any idea about apex code then please share me.
Thanks in Advance
Rakesh
Hi Abhay,
Thanks for your suggestion.
According to ur suggestion i tried it but it gives some different type of display by the way
I fixed my problem that i am looking for.I would like to share my code that i am using now.
Controller.............................
List<Key_Message_vod__c> keyList ;
List<Key_Message_Status_nov__c> keyStatusList;
List<Cycle_Plan_Target_vod__c> targetList{get;set;}
public void myController(){
keyList = [SELECT Name, Product_vod__c FROM Key_Message_vod__c where Product_vod__c =:productList];
if(keyList !=null){
keyStatusList = [SELECT Key_Message_Status_nov__c FROM Key_Message_Status_nov__c where Parent_Key_Message_Report_nov__c =:keyList];
}
targetList= [SELECT Cycle_Plan_Account_vod__r.name FROM Cycle_Plan_Target_vod__c];
}
public List<Key_Message_vod__c> getRecords()
{
return keyList;
}
public List<Key_Message_Status_nov__c> getStatus()
{
return keyStatusList;
}
public List<Cycle_Plan_Target_vod__c> getTargetList()
{
return targetList;
}
And VF page Code
<apex:pageBlock >
<table border="1" class="main">
<tr class="thedear">
<td>
Target Name
</td>
<apex:repeat value="{!Records}" id="repeat1" var="item">
<td>
<apex:outputField value="{!item.name}" id="theValue"/>
</td>
</apex:repeat>
</tr>
<apex:repeat value="{!targetList}" id="repeat2" var="pitem">
<tr>
<td><b><apex:outputField value="{!pitem.Cycle_Plan_Account_vod__r.name}" id="theValue"/></b></td>
<apex:repeat value="{!Status}" id="repeat3" var="item">
<td>
<center><apex:outputField value="{!item.Key_Message_Status_nov__c}" id="theValue"/></center>
</td>
</apex:repeat>
</tr>
</apex:repeat>
</table>
Rakesh
All Answers
Hi Rakesh,
There are 2 possible approaches for this
1.) Apex Pageblocktable OR Apex repeat
2.) Wrapper class
<apex:pageblockTable value="{!LISTOFITEMS}" var="e">
<apex:column headerValue="COL1">
<apex:inputField value="{!e.DATAFORROW1}" />
</apex:column>
<apex:column headerValue="COL2">
<apex:inputField value="{!e.DATAFORROW1}" />
</apex:column>
</apex:pageblockTable>
Hi Abhay,
Thanks for quick reply.
As per as code its oneway dynamic data matrix..
here is my code example
apex code
public with sharing class NOV_TargetActionClass {
public void myController(){
matrix = new List<List<String>>();
List<Key_Message_vod__c> keyList = [SELECT Name, Product_vod__c FROM Key_Message_vod__c where Product_vod__c =:productList];
List<Key_Message_Status_nov__c> keyStatusList = [SELECT Key_Message_Status_nov__c FROM Key_Message_Status_nov__c where Parent_Key_Message_Report_nov__c =:keyList];
List<String> row = new List<String>();
row.add('Target Name');
for(Integer i = 0; i<keyList.size(); i++){
row.add(keyList[i].Name);
}
matrix.add(row);
for(Integer j=0; j<keyStatusList.size(); j++){
row = new List<String>();
// System.debug(keyStatusList[j].Key_Message_Status_nov__c);
row.add(keyStatusList[j].Key_Message_Status_nov__c);
}
matrix.add(row);
}
}
VF code
<table border="2">
<apex:repeat value="{!matrix}" var="r">
<tr>
<apex:repeat value="{!r}" var="c">
<td>{!c}</td>
</apex:repeat>
</tr>
</apex:repeat>
</table>
i dont know where i am missing ..
Rakesh
<table border="2">
<apex:repeat value="{!matrix}" var="r">
<tr><td>
<apex:repeat value="{!r}" var="c">
<table><tr> <td>{!c}</td> </tr></table.
</apex:repeat>
</td></tr>
</apex:repeat>
</table>
Hope above helps
If this dosent helps lets sumamrize your problem so that i can get you the exact code
1.) You have accounts(Rows)
2.) Under each Account You have contacts(Columns)
You want to display the data such as
Account1 Con1 Con2 Con3 Con4 Con5 Con6 Con7 Con8 Con9....ConN
Account2 Con1 Con2 Con3 Con4 Con5 Con6 Con7 Con8 Con9....ConN
Account3 Con1 Con2 Con3 Con4 Con5 Con6 Con7 Con8 Con9....ConN
Account4 Con1 Con2 Con3 Con4 Con5 Con6 Con7 Con8 Con9....ConN
if Above is correct then solution is
<apex:page controller="gridController">
<apex:repeat value="{!lstAcc}" var="acc">
<table>
<tr>
<td>{!acc.name}</td>
<td>
<table>
<tr>
<apex:repeat value="{!acc.contacts}" var="con">
<td>{!con.name}</td>
</apex:repeat>
</tr>
</table>
</td>
</tr>
</table>
</apex:repeat>
</apex:page>
public with sharing class gridController {
public list<Account> lstAcc{get;set;}
public gridController(){
lstAcc=new list<Account>();
lstAcc=[select id,name,(select id,name from contacts) from account limit 100];
}
}
Hi,
if your problem is solved mark it as solved
Hi Abhay,
Thanks for your suggestion.
According to ur suggestion i tried it but it gives some different type of display by the way
I fixed my problem that i am looking for.I would like to share my code that i am using now.
Controller.............................
List<Key_Message_vod__c> keyList ;
List<Key_Message_Status_nov__c> keyStatusList;
List<Cycle_Plan_Target_vod__c> targetList{get;set;}
public void myController(){
keyList = [SELECT Name, Product_vod__c FROM Key_Message_vod__c where Product_vod__c =:productList];
if(keyList !=null){
keyStatusList = [SELECT Key_Message_Status_nov__c FROM Key_Message_Status_nov__c where Parent_Key_Message_Report_nov__c =:keyList];
}
targetList= [SELECT Cycle_Plan_Account_vod__r.name FROM Cycle_Plan_Target_vod__c];
}
public List<Key_Message_vod__c> getRecords()
{
return keyList;
}
public List<Key_Message_Status_nov__c> getStatus()
{
return keyStatusList;
}
public List<Cycle_Plan_Target_vod__c> getTargetList()
{
return targetList;
}
And VF page Code
<apex:pageBlock >
<table border="1" class="main">
<tr class="thedear">
<td>
Target Name
</td>
<apex:repeat value="{!Records}" id="repeat1" var="item">
<td>
<apex:outputField value="{!item.name}" id="theValue"/>
</td>
</apex:repeat>
</tr>
<apex:repeat value="{!targetList}" id="repeat2" var="pitem">
<tr>
<td><b><apex:outputField value="{!pitem.Cycle_Plan_Account_vod__r.name}" id="theValue"/></b></td>
<apex:repeat value="{!Status}" id="repeat3" var="item">
<td>
<center><apex:outputField value="{!item.Key_Message_Status_nov__c}" id="theValue"/></center>
</td>
</apex:repeat>
</tr>
</apex:repeat>
</table>
Rakesh
Hi rakesh,
Grt work... Please mark it as solved..
I have same problem.
Would you please share your javascipt classes.
Thank you
Suja