Tag Archives: Visualforce

Salesforce: License Key Automation


User have to manually assign license keys to the related software in Opportunity Line Item whenever the opportunities are closed as won.

The process involve users going in to the license keys object and look for the available license key. They have to manually populate the software info into the assigned license key records as well.


Create a trigger that allows users to assign license key to the related software automatically by a button click. The solution covers:

  1. Listing out the software in Opportunity Line Item that will go through the license key assignment process. From the list, users have options to proceed or cancel.
  2. If proceed, the license key assignment process will start.
  3. In the assignment process, the trigger will search for the “Available” license key based on the type and version of the software. Once the list of available license keys have been found, one license key will be selected and assigned to the software. The software details will be populated into the assigned license key and the status of the licensed key will be set as “Not Available”.
Related Objects Opportunity and Custom Object
Components Apex Trigger, Visualforce
Complexity Complex

Customizing Quote Template

You may be using the Salesforce default Quote feature and you want to further customize the quote template so that it matches your requirement?

To do so, we can utilize the Visualforce page feature in Salesforce (Professional Edition supported) to create the quote template instead. With Visualforce page option, the quote template and its content can be further customize (i.e. by using HTML and CSS).

For example, following is a simple quote sample with customized background that is generated through the Visualforce page:

Additionally, emailing the generated Visualforce Quote to the respective contact or particular recipient is possible too. To find out more about this approach, check out our example posted here.

Iterating a map in Visualforce page

The common solution to display a list of values or SObject’s field value in Visualforce page is looping through a List. For example:

Controller method

List keyList = new List{'value for first','value for second','value for third'};

public List getKeyList(){
    return keyList;

Visualforce page

<apex:repeat value="{!KeyList}" var="key" >
    <apex:outputText value="{!key}" />


However, sometimes we may need to construct our data into a map instead and have it displayed in Visualforce page. Here is how you can loop through a map and it’s value:


Controller method

public Map getDemoMap(){

    Map demoMap = new Map();
    demoMap.put('first', 'value for first');
    demoMap.put('second', 'value for second');
    demoMap.put('third', 'value for third');
    demoMap.put('forth', 'value for forth');

    return demoMap;

Visualforce page

<apex:repeat value="{!DemoMap}" var="key" >
    <apex:repeat value="{!DemoMap[key]}" var="keyvalue" >
        <apex:outputText value="{!keyvalue}" />

Salesforce: Cross Object Page View With Extensible Filters

Salesforce object view allows records to be displayed based on the filter criteria of your choice. And the fields to be filtered are restricted to within its object as such:

There have been requirements that:

  • the filter needs be extended in the manner that it can also filter the fields for other related records
  • records can be mass updated via inline editing
  • records can be sorted

This is mostly implemented between custom objects and occasionally involves records from standard objects. As an illustration of what is required, we will use the Salesforce standard objects as an example.

For a full description, please check out our use case here.

Salesforce: Page View Wizard using Visualforce Page

In Salesforce, Visualforce page can help to display the object views extensively. In a recent customisation we have done, there is a request to display a view that gathers all the related parent child information from different objects and display them as a page wizard. The requirement can be illustrated as such:

  • involves 3 custom object and 1 standard object with parent child relationship
  • the display of the views is also incorporated with logics

For details on the case study, please see: http://www.wdcigroup.net/visualforce_apex_class_implementing_page_wizard.html

Salesforce: Invoking Visualforce Action via Javascript

We did a lot of Salesforce implementation and customisation work recently. We came across a situation where we need to perform some action in Javascript and invoke a  VisualForce action after that. We did some research and found a useful component <apex:actionFunction>. This component exposes a controller method as a Javascript function so that we can invoke it by using Javascript in our  VisualForce page. Here is simple example on how to do this.

Visualforce Controller

public class VisualforceJavascriptDemo{

    public string myparam {get; set;}

    public VisualforceJavascriptDemo(){
        myparam = 'Initial value';

    public PageReference myJSAction(){
        return null;
In the controller, we create the following:
  • a variable called “myparam” – this will be defined in <apex:param> component within <apex:actionFunction> to hold the value passed by Javascript in  VisualForce page
  • an action function called “myJSAction” – this will be defined in action attribute in <apex:actionFunction> as an action function to be invoke by Javascript in VisualForce page
Alright, that’s what we have in the controller. The following will be the code that we have in the VisualForce page:-
<apex:page controller="VisualforceJavascriptDemo">
    <apex:form >
        <apex:actionFunction name="myJSAction" action="{!myJSAction}" rerender="mypanel">
            <apex:param name="firstparam" assignTo="{!myparam}" value="" />

        <apex:outputpanel id="mypanel">
            <apex:outputText value="{!myparam}"></apex:outputText> - <a href="javascript:innerJavascript()">Invoke action here</a>

            function innerJavascript(){
                alert('Start invoking vf action!');

                myJSAction('Value is changed by action called by Javascript in Visualforce.');
As you can see that we define the <apex:actionFunction> as discussed above. Please take note that the “name” attribute is important as that will be the Javascript function name. We named it as “myJSAction” here.

Yup, we are done. Now you just need to call the myJSAction anywhere within the VisualForce page (e.g, via onclick, onchange action or Javascript function) and you should see the magic!

Visualforce Development: Development Mode Footer

This feature can make your Visualforce development easier by providing a view to look at the actual page and the code at the same time. Before this, the developer need to refresh the page whenever a change is made to the Visualforce page or the Apex Controller.

Below are the steps to activate the Development mode footer in your account:
Step 1
  • Click on you name -> Select Setup -> Click on the My Personal Information on the left panel -> Select Personal Information
Step 2
  • Click Edit button first -> Check the Development Mode and  Show View State in Development Mode check boxes
  • Click Save 
Once you have done. Please refresh you browser and you will be able to the different like figure below.

Once you have activated this feature, you will be able view the change directly by click
the save button () and the latest change will display.