function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Chinnu ChinnuChinnu Chinnu 

Can anyone please tell me how to develop a vf page and display the account with corresponding related contacts

Gangadhar T 15Gangadhar T 15
goto --->vfpage--> new-->label as"forum1"


<apex:page standardController="Account">
<!-- Define Tab panel .css styles -->
<style>
.activeTab {background-color: #236FBD; color:white; background-image:none}
.inactiveTab { background-color: lightgrey; color:black; background-image:none}
</style>
<!-- Create Tab panel -->
<apex:tabPanel switchType="client" value="{!IF(ISBLANK($CurrentPage.Parameters.tabName),'account',$CurrentPage.Parameters.tabName)}" id="AccountTabPanel" tabClass="activeTab" inactiveTabClass="inactiveTab">
<apex:tab label="Account" name="account" id="account">
<apex:detail relatedList="false"/>
</apex:tab>
<apex:tab label="Contacts" name="contacts" id="contacts">
<apex:form >
<apex:repeat value="{!Account.contacts}" var="con">
<apex:pageBlock title="{!con.Name}">
<apex:pageBlockSection >
<apex:outputField value="{!con.FirstName}"/>
<apex:outputField value="{!con.LastName}"/>
<apex:outputField value="{!con.Email}"/>
<apex:outputField value="{!con.Phone}"/>
</apex:pageBlockSection>
<apex:pageBlockButtons location="top">
\<apex:commandButton value="Edit" action="/{!con.Id}/e?retURL=/{!Account.Id}?tabName=contacts"/>
<apex:commandButton value="Delete" action="{!URLFOR($Action.Contact.delete,con.id,['retURL'=id+'?tabName=contacts'])}" onclick="return confirm('Are you sure, do you want to delete?');"/>
</apex:pageBlockButtons>
</apex:pageBlock>
/apex:repeat>
</apex:form>
</apex:tab>
</apex:page>



 after the code goto-->customize-->accounts-->button,links and action-->override the Button "view" with vf page

















Thanks,
www.nubeselite.com



 
Gangadhar T 15Gangadhar T 15
if it is useful,please  mark as best answer
Ajay K DubediAjay K Dubedi
Hi Chinnu,

Use the below code for show account with corresponding related contacts. 

VF Page=======:

<apex:page standardController="Account" showHeader="false" >
    <apex:form >
        <apex:pageBlock title="Account Detail">
            <apex:pageBlockSection columns="2" >
                <apex:pageBlockSection columns="2" >
                    <apex:outputText value="{!account.Owner.CompanyName}"/><br/>
                    <apex:outputText value="{!account.Owner.Name}"></apex:outputText><br/>
                    <apex:outputText value="{!account.Owner.City}" />
                </apex:pageBlockSection>
            </apex:pageBlockSection>
            <apex:pageBlockSection columns="2" >
                <apex:pageBlockSection columns="1" >
                    <apex:outputText value="{!account.Name}"></apex:outputText>
                    <apex:outputText value="{!account.Phone}"></apex:outputText>
                </apex:pageBlockSection>
                <apex:pageBlockSection columns="1" >
                    <apex:outputText value="{!account.BillingStreet}"></apex:outputText>
                    <apex:outputText value="{!account.BillingCity}"></apex:outputText>
                </apex:pageBlockSection>
            </apex:pageBlockSection>
            
        </apex:pageBlock>
        <apex:pageBlock >
            <apex:pageBlockSection columns="1" collapsible="true" title="Contact Detail Related Account">
                <apex:pageBlockTable value="{!account.contacts}" var="conObj">
                    <apex:column >
                        <apex:facet name="header">Contact_Name</apex:facet>
                        <apex:commandLink value="{!conObj.Name}" /><br />
                    </apex:column>
                    <apex:column >
                        <apex:facet name="header">Email</apex:facet>
                        <apex:commandLink value="{!conObj.Email}" /><br />
                    </apex:column>
                    <apex:column >
                        <apex:facet name="header">Phone_Number</apex:facet>
                        <apex:commandLink value="{!conObj.Phone}" /><br />
                    </apex:column>
                </apex:pageBlockTable> 
            </apex:pageBlockSection>
        </apex:pageBlock>
    </apex:form>
</apex:page>

I hope you find the above solution helpful. If it does, please mark as Best Answer to help others too.

Thanks and Regards,
Ajay Dubedi
www.ajaydubedi.com
Khan AnasKhan Anas (Salesforce Developers) 
Hi Chinnu,

Greetings to you!

Please refer to the below links which might help you further with the above requirement.

https://www.biswajeetsamal.com/blog/salesforce-how-to-craete-treeview-in-visualforce-page/

http://salesforceblogger.blogspot.com/2012/03/hierarchy-in-visualforce.html

http://www.forcetree.com/2011/04/tree-view-in-visualforce-page.html

http://www.infallibletechie.com/2012/11/tree-view-in-visualforce-page.html

I hope it helps you.

Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.

Thanks and Regards,
Khan Anas
Chinnu ChinnuChinnu Chinnu
Hey, This is my code..
VF page:
<apex:page controller="ContactsVisualforceController" standardStylesheets="false">
    <apex:form>
    <apex:pageBlock title="Contacts List">
   
             
        <apex:repeat value="{!displayAccounts}" var="acc">
           <dl>
                <dt>Account Name:</dt>
                <dd><apex:outputText value="{!acc.Name}"/></dd> 
            </dl>
            
            <dl><dt>Contact Names:</dt></dl>

            <apex:pageblocktable value="{!acc.Contacts}" var="cont">
                
                <apex:column value="{!cont.firstname}"/>
                <apex:column value="{!cont.lastname}"/>

         </apex:pageblocktable>
       </apex:repeat>
    </apex:pageBlock>
    </apex:form>
</apex:page>

Controller:
public class ContactsVisualforceController {
    public list<Account> displayAccounts {get; set;}
    public ContactsVisualforceController(){
        displayAccounts = [select id,name,(select id,name,firstname,lastname from Contacts) from Account];
    }
}


This is working fine ok.. But now I want to display as Block means

AccountName1 here          All related Contacts For that AccountName1 should display here
AccountName2 here          All related Contacts For that AccountName2 should display here
AccountName3 here          All related Contacts For that AccountName3 should display here

like this I want to display 10 records in one page and another 10 records on another page so pagination we have to use..
So I want how can we do that can anyone please tell me..