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
sneha kavyasneha kavya 

Hi I am new to salesforce... there is 1 task given to me please help me... My senior wants only this type of look

please help me
Saurabh BSaurabh B
Hi Sneha,
Use this,

Controller:
public class MyController {
    
    Public List <Account> getAcc  (){
        List <Account> Acc = [SELECT Id, Name,( SELECT Name, Email FROM Contacts )
                              FROM Account];
        
        return Acc ;
        
    }
    
}
Visualforce Page:
<apex:page Controller="MyController">
    <apex:form >
        <apex:sectionHeader title="Account, Cases and Comments" />
        <apex:pageBlock id="list">  
            <table class="list" border="1" cellpadding="0" cellspacing="0">
                <tr class="headerRow">
                    <th >Account</th>
                    <th colspan="3">Contact</th>
                </tr>
                <apex:repeat value="{!Acc}" var="A">
                    <tr colspan="1"> 
                        <td colspan="1">
                            <apex:outputField style="width:80%" value="{!A.Name}" />
                        </td>
                        <td>
                        </td>
                    </tr>
                    <apex:repeat value="{!A.Contacts}" var="con">
                        <tr> 
                            <td> 
                                &nbsp;
                            </td>
                            <td style="font-weight:bold">
                                Name
                            </td>
                            <td style="font-weight:bold">
                                Email
                            </td>
                        </tr>
                        <tr> 
                            <td>
                                &nbsp;
                            </td>
                            <td>
                                <apex:outputField style="width:80%" value="{!con.Name}"/>
                            </td>
                            <td>
                                <apex:outputField value="{!con.Email}"/>
                            </td>
                            <td>
                            </td>
                        </tr>
                    </apex:repeat>
                    
                    <tr>
                        <td>
                            &nbsp;
                        </td>
                        <td>
                        </td>
                        <td colspan="2">
                            &nbsp;
                        </td>
                    </tr>
                    <tr>
                        <td colspan="4" style="border-bottom: black 1px solid;">&nbsp;</td>
                    </tr>
                </apex:repeat>
                <tr>
                    <td>
                    </td>
                    <td colspan="3">
                        &nbsp;
                    </td>
                </tr>
            </table>
        </apex:pageBlock>
    </apex:form>
</apex:page>

Please mark this as Best Answer if it helps you!

Thanks!
Dushyant SonwarDushyant Sonwar
Hi Sneha, 

Try with this one , it will give you the same output as shown in screenshot.
You can use the same controller created by saurabh.
Visualforce Page:
<apex:page Controller="MyController" tabstyle="Account">
        <apex:sectionHeader title="Account and child Contacts" subtitle="Account Details" />
        <apex:pageBlock >  
            <table class="list" border="1" cellpadding="0" cellspacing="0">
                <tr class="headerRow">
                    <th >Account</th>
                    <th colspan="2">Contact</th>
                </tr>
                <apex:repeat value="{!Acc}" var="A">
                    <tr colspan="1"> 
                        <td colspan="1">
                            <apex:outputField style="width:80%" value="{!A.Name}" />
                        </td>                                            
                        <td>                     
                            <apex:repeat value="{!A.Contacts}" var="con">
                                <table class="list" border="1" cellpadding="0" cellspacing="0" >
                                    <tr class="headerRow"> 
                                        <td style="font-weight:bold">
                                            Name
                                        </td>
                                        <td style="font-weight:bold">
                                            Email
                                        </td>
                                    </tr>
                                    <tr>                             
                                        <td>
                                            <apex:outputField style="width:80%" value="{!con.Name}"/>
                                        </td>
                                        <td>
                                            <apex:outputField value="{!con.Email}"/>
                                        </td>                            
                                    </tr>
                                  </table>  
                                </apex:repeat>                         
                        </td>                       
                    </tr> 
                </apex:repeat>
                
            </table>
            
        </apex:pageBlock>
</apex:page>