CALLING A VISUALFORCE PAGE FROM A SALESFORCE DETAIL PAGE USING CUSTOM BUTTON

CALLING A VISUALFORCE PAGE FROM A SALESFORCE DETAIL PAGE Using Custom button.

What ingredients do we need to call a Visualforce page from a detail page in Salesforce?

1)  1 Apex Class
2)  1 Test Class
3)  1 Visualforce page
4)  1 Custom Button
5)  Adding the custom button to a page layout.

Once we mix all of these up to get them connected properly we will have the foundation to accomplish anything that Apex and Visualforce can provide.  I would liken this to creating a great pie crust.  This is your foundation and then you can add any pie filling you can come up with.  Strawberry-Rhubarb!  Yummy!

So here is our recipe…

1) Create one Apex Class.  This class will be used as the controller for our Visualforce page.  Here is an example of a very simple controller.

public with sharing class AccountController {

  private string accountID = '';
  public Account accountItem{get;set;}

  public AccountController(){
    //Constructor
    list<account> accountList = new list<account>();
    accountID = System.currentPageReference().getParameters().get('aId');  
    accountList = [Select ID, Name From Account Where ID = :accountID];
    if(accountList.isEmpty() == false){
      accountItem = accountList[0];
    }else{
      ApexPages.Message msg = new ApexPages.Message(ApexPages.Severity.ERROR, 'The Account ID is invalid.');
      ApexPages.addMessage(msg);
    }
  }

  public pageReference cancelAction(){
    return returnToOrigination();
  }

  public pageReference saveItem(){
    //Do something to the Account object and then update it
    //update accountItem;
    return returnToOrigination();
  }

  private pageReference returnToOrigination(){
    PageReference page = new PageReference('/' + aID);
    page.setRedirect(true);
    return page;
  }
   
}

2) Create a Test Class for our Apex class.  Apex requires 75% coverage so we want to get our test coverage off to a good start.  Testing controllers is not very intuitive until you have done it a couple of times.  Here is the structure that can help us to get started.

@isTest
private class TestAccountController {

  static testMethod void testSave() {
    Account a = new Account();
    a.Name = 'Account Name';
    insert a;

    PageReference ref = new PageReference('/apex/AccountPage?aId=' + a.Id);
    Test.setCurrentPage(ref);

    Test.startTest();
    //This will run the constructor of the controller
    AccountController myController = new AccountController();
    //Now we can test our action function on the controller
    PageReference ref2 = myController.saveItem();
    Test.stopTest();

    system.assertNotEquals(ref2, null);
  }

  //We should add another test method to test the CancelAction function too


}

3) Now that we have our logic working we can tie a user interface to our code.  We do this by building a Visualforce page and by naming our AccountController class as the controller.

<apex:page controller="AccountController">
  <apex:form>
  <apex:pagemessages>
        <apex:pageblock title="Manage this account" mode="edit">
            <apex:pageblockbuttons>
                <apex:commandbutton action="{!saveItem}" value="Save">
                <apex:commandbutton action="{!cancelAction}" value="Cancel">
            </apex:commandbutton></apex:commandbutton></apex:pageblockbuttons>
            <apex:pageblocksection title="Account Details" columns="2">                            
                <apex:outputfield label="Account Name: " value="{!accountItem.Name}">
            </apex:outputfield></apex:pageblocksection>
        </apex:pageblock>
    </apex:pagemessages></apex:form>   

</apex:page>

4) Now we just need a way to call our Visualforce page from the detail page.  This is done by creating a custom button, which can be created from any standard or custom object.  In our case we are creating a custom button from an Account.

A) Click on your name, Setup, App Setup, Customize, Accounts, Buttons and Links
B) Click on ‘New’ in the ‘Custom Buttons and Links’ section
C) Type in a label and name
D) The ‘Display Type’ is ‘Detail Page Button’
E) The Behavior is ‘Execute Javascript’
F) In this example the ‘Content Source’ is ‘OnClick JavaScript’‘
G) The JavaScript code looks like this:
  window.open(’/apex/AccountPage?aId={!Account.Id }’, ‘_self’);

5) Now just add this detail button to your page layout.  Open your page layout, click on the ‘Buttons’ link and then drag your new button to the ‘Custom Buttons’ section on the page layout.

This gives you the structure to call a Visualforce page from any page layout.  From here you can expand your Visualforce page and Apex Controller class to do anything that Visualforce and Apex allows you to do.

That's it..

Posted in: Apex Examples,CALLING A VISUALFORCE PAGE FROM A SALESFORCE DETAIL PAGE USING CUSTOM BUTTON,Salesforce,salesforce training,Visualforce,Visualforce examples