hey folks in this blog we are going to build a basic data table using visual force page.
Here we will be displaying Account data for demo. You can query any sObject as per you requirement
Apex Class
public class dataTableCon {
List<Account> accounts;
public List<Account> getAccounts() {
return [SELECT Name, Rating, Industry FROM Account LIMIT 20];
}
}
DataTable.vfp
<apex:page controller="dataTableCon" id="DataTablePage">
<style>
.container{
display:inline-block;
width:100%;
text-align:center;
margin-top:30px;
}
.container_in {
display:inline-block;
width:50%;
text-align:center;
border:1px solid #000;
padding:5px;
}
.gray {
background-color:#dddddd;
}
.white{
background-color:#fff;
}
td {
padding:0 15px 0 0;
text-align:left;
}
</style>
<div class="container">
<div class="container_in">
<apex:dataTable value="{!accounts}" var="account"
rowClasses="gray,white">
<apex:column>
<apex:facet name="header">Account Name</apex:facet>
<apex:outputText value="{!account.name}"/>
</apex:column>
<apex:column>
<apex:facet name="header">Rating</apex:facet>
<apex:outputText value="{!account.Rating}"/>
</apex:column>
<apex:column>
<apex:facet name="header">Industry</apex:facet>
<apex:outputText value="{!account.Industry}"/>
</apex:column>
</apex:dataTable>
</div>
</div>
</apex:page>
