Dynamic Visualforce Bindings with Example

This blog will be explaining how to use dynamic Visualforce bindings with example. Sometimes we have to build Visualforce pages based on certain conditions or based on user input, i.e fields on page are determined at run time rather than compile time, In this case rendering based on conditions is not enough to achieve the goal. At this point dynamic Visualforce bindings come into the picture.

In dynamic Visualforce bindings along with user input there are methods and properties of the controller that determine how to assemble a new page.

Syntax :

reference [expression]

We can use dynamic binding in formula expression on Visualforce like
{!reference [expression]}

Where reference can be Sobject or Apex class, expression can be name of the field or object which recursively returns field.

In this blog we will be creating Visualforce page for case creation and fields on the form will be decided at run time based on fields selected form will be created. We will show only editable fields.

Visualforce Page :

//Dynamic_Page_Creation
<apex:page standardController="Case" extensions="DynamicRecordCreationController">

<apex:pageBlock title="Select Fields for layout" id="selectionBlock">
        <apex:form >
        <apex:panelGrid columns="3">
            <apex:selectList id="availableFields"
                value="{!selected}" multiselect="true" size="20" style="width:200px">
                <apex:selectOptions value="{!availableOptions}"/>
            </apex:selectList>
            <apex:panelGroup >
            <br/><br/><br/><br/><br/>
                <apex:commandButton value=">>" 
                    action="{!doAdd}" rerender="selectionBlock" disabled = "{!disbaleAdd}"/>
                <br/>
                <apex:commandButton value="<<" 
                    action="{!doRemove}" rerender="selectionBlock" disabled="{!disableRemove}"/>
            </apex:panelGroup>
            <apex:selectList id="selected_list" required="false" 
                value="{!selectedRight}" multiselect="true" size="20" style="width:200px">
                <apex:selectOptions value="{!selectedOptions}"/>
            </apex:selectList>
        </apex:panelGrid>
        <apex:commandButton value="Create Form" 
        action="{!createForm}"  disabled="{!disableRemove}"/>
        <apex:outputPanel rendered="{!showForm}" styleClass="formCSS">
       <apex:pageBlockTable value="{!fieldsforForm}" var="f" Id="formId" >
              <apex:column > {!f.label} : </apex:column>
             <apex:column >
              <apex:inputField value="{!Case[f.value]}" id="inputFieldId"/>
              </apex:column>
        
       </apex:pageBlockTable>
       <apex:commandbutton action="{!save}" value="Save"/>
       </apex:outputPanel>
      
      
    </apex:form>
    </apex:pageBlock>
  <style type="text/css">
.formCSS{
    overflow:auto;
    width: 35%;
    height:355px;
    background-color: white;
    padding: 10px;
    position: absolute;
    top: 10%;
    left: 60%;
}
</style>
</apex:page>

Controller Extension :

// DynamicRecordCreationController

public class DynamicRecordCreationController {
    public List<SelectOption> selectedOptions { get; set; }
    public List<SelectOption> availableOptions { get; set; }
    Map<String, SelectOption> allOptionsByValyeMap;
    public  List<String> selected   { get; set; }
    public  List<String> selectedRight { get; set; }
    public  List<wrapLabelValue> fieldsforForm   { get; set; }
    public boolean showForm {get; set; }
    Set<String> tempSet;
    public PageReference doRemove() {
    
         for(String s : selectedRight)
        {
           if(selectedOptions == null)
           return null;
           availableOptions.add(allOptionsByValyeMap.get(s));
           selectedOptions = removeAll(selectedOptions, s);
        }
        
        return null;
    }
    public PageReference doAdd() {
      
        for(String s : selected)
        {
           if(selectedOptions == null)
           selectedOptions = new List<SelectOption>(); 
           selectedOptions.add(allOptionsByValyeMap.get(s));
           availableOptions = removeAll(availableOptions, s);
        }
        
        return null;
    }
    public DynamicRecordCreationController() {
    }
     public DynamicRecordCreationController(ApexPages.StandardController controller) {
        getFieldSeletOptions();
    }
    
    public void getFieldSeletOptions()
    {
        List<SelectOption> options = new List<SelectOption>();
        String type='Case';
        Map<String, Schema.SObjectType> schemaMap = Schema.getGlobalDescribe();
        Schema.SObjectType caseSchema = schemaMap.get(type);
        Map<String, Schema.SObjectField> fieldMap = caseSchema.getDescribe().fields.getMap();
        
            for (String fieldName: fieldMap.keySet()) {
            Schema.DisplayType fieldType = fieldMap.get(fieldName).getDescribe().getType();
            
                if(fieldMap.get(fieldName).getDescribe(). isUpdateable())
               {
                    SelectOption option = new SelectOption(fieldName, fieldMap.get(fieldName).getDescribe().getLabel());
                    options.add(option);
                }
            }
          availableOptions = options; 
          allOptionsByValyeMap = valuleLabelMap(options);
        
     }
     private Map<String, SelectOption> valuleLabelMap(List<SelectOption> selectOptionList)
     {
         Map<String, SelectOption> valueLabelMap = new Map<String, SelectOption>();
         for(SelectOption s : selectOptionList)
         valueLabelMap.put(s.getValue(), s);
         
         return valueLabelMap;
         
     }
     
    private  List<SelectOption> removeAll(List<SelectOption> target, String remove) {
        for(Integer i = target.size() - 1; i >= 0; i--) {
            if((target[i].getValue()).equals(remove)) {
                target.remove(i);
            }
        }
        return target;
    }
    
    public boolean getDisbaleAdd()
    {
        if(availableOptions == null ||availableOptions.Size() == 0)
        return true;
        
        return false;
    }
    
    public boolean getDisableRemove()
    {
        if(selectedOptions == null || selectedOptions.Size() ==0)
        return true;
        
        return false;
    }
    
    public void createForm()
    {
        showForm = true;
        tempSet = new Set<String>();
        fieldsforForm = new List<wrapLabelValue>();
        for(SelectOption so : selectedOptions)
        {
            if(!tempSet.Contains(so.getValue()))
            {
                tempSet.add(so.getValue());
                fieldsforForm.add(new wrapLabelValue(so.getLabel(), so.getValue()));
            }
        }
        
    }
    public class wrapLabelValue{
    public String label {get; set; }
    public String value {get; set; }
    public wrapLabelValue(String label, String Value)
    {
        this.label = label;
        this.value = value;
    }
    }
    
}

Quick Demo :