Use Case: Display Quote Property

Last updated
Save as PDF

This use case walks you through using the PropertyComponent to display the property view for the Quote object creation page. The high level steps are:

Build a Field Set

The PropertyComponent uses a field set to build up the quote creation page. Create a field set you want to use in the PropertyComponent.

Implement the Apex Controller

In your controller, make a public property of type PropertyComponentOptions and build it in the controller's constructor as shown in the sample code below:

public with sharing class PropertyComponentSampleController extends zqu.PropertyComponentController.ParentController{
   
    ApexPages.StandardController controller;
    public zqu__Quote__c quote                      { get; set; }
    public zqu.PropertyComponentOptions theOptions  { get; set; }
    public Opportunity opp                             { get; set; }
   
    public PropertyComponentSampleController(ApexPages.StandardController stdController){
      System.debug('PropertyComponentSampleController(stdCtrl) executed!');
      this.controller = stdController;
     
      this.quote = (zqu__Quote__c) this.controller.getRecord();
     
      setOpportunity('006i0000003psrY');
     
      // Initialize property component options
      theOptions = new zqu.PropertyComponentOptions();      theOptions.objectName = 'zqu__Quote__c';
      theOptions.viewType = zqu.ViewConfigurationManager.VIEW_CONFIGURATION_VIEW_TYPE_CREATE;
      theOptions.propertyPageTitle = 'Property Component Sample';
      theOptions.isEditMode = true;
      theOptions.parentController = this;
      theOptions.instanceName = 'sampleProperty';
     
      Schema.SObjectType objectType = zqu__Quote__c.sObjectType;
      Map<String, Schema.RecordTypeInfo> recordTypeInfoMap = objectType.getDescribe().getRecordTypeInfosByName();
      theOptions.recordTypeId = recordTypeInfoMap.get('Default').getRecordTypeId();
     
      theOptions.customRenderingFields.add('Custom_Picklist_Field__c');
      theOptions.customRenderingFields.add('Custom_Text_Field__c');
     
      theOptions.readonlyFields.add('zqu__Opportunity__c');
     
      theOptions.populateValuePlugin = 'PropertyComponentSampleController.PopulateDefaultFieldValuePlugin';
      theOptions.relatedObjectPlugin = 'PropertyComponentSampleController.PopulateRelatedObjectFieldPlugin';
      theOptions.updatePlugin = 'PropertyComponentSampleController.UpdateRecordPlugin';
      theOptions.cancelPlugin = 'PropertyComponentSampleController.CancelRecordPlugin';
    }
   
    public String selectedCustomPicklistValue { get; set; }
   
    // Set field default value
    public class PopulateDefaultFieldValuePlugin implements IPopulateValuePlugin {
      public void populateDefaultFieldValue(SObject record, zqu.PropertyComponentController.ParentController pcc) {
       
        // Get PropertyComponentSampleController instance
        PropertyComponentSampleController parentController = (PropertyComponentSampleController)pcc;
        Opportunity opportunity = parentController.opp;
       
        // Set default field values when create new quote
        if (parentController.quote.Id == null && opportunity != null) {
         
          // Set default opportunity
          record.put('zqu__Opportunity__c',opportunity.Id);
         
        }
      }
    }
   
    public class PopulateRelatedObjectFieldPlugin implements IRelatedObjectPlugin {
      public Map<String,SObject> getRelatedObject(zqu.PropertyComponentController.ParentController pcc) {
       
        // Get PropertyComponentSampleController instance
        PropertyComponentSampleController parentController = (PropertyComponentSampleController)pcc;
       
        Map<String, SObject> relatedObjectMap = new Map<String, SObject>();
       
        // Set value for related object field : Opportunity__r.AccountId
        relatedObjectMap.put('zqu__Opportunity__r',parentController.opp);
       
        return relatedObjectMap;
      }
    }
   
    public class UpdateRecordPlugin implements IUpdatePlugin {
      public PageReference doUpdate(SObject record, zqu.PropertyComponentController.ParentController pcc){
        // Add your saving logic here
      }
    }

    public class CancelRecordPlugin implements ICancelPlugin {
      public PageReference doCancel(SObject record, zqu.PropertyComponentController.ParentController pcc){
        // Add your cancel logic here
      }
    }
   
    // Action function for custom rendering field
    public void onChangeCustomPicklist() {
      System.debug('selected picklist value : ' + selectedCustomPicklistValue);
      this.quote.Custom_Picklist_Field__c = selectedCustomPicklistValue;
      this.quote.Custom_Text_Field__c = selectedCustomPicklistValue;
    }
   
    public void setOpportunity(Id oppId) {
      String opp_query;
      if (UserInfo.isMultiCurrencyOrganization()) {
        opp_query = 'SELECT Id, Name,CurrencyISOCode, Account.Id, Account.Name FROM Opportunity WHERE Id = \'' + oppId + '\'';
      } else {
        opp_query = 'SELECT Id, Name, Account.Id, Account.Name FROM Opportunity WHERE Id = \'' + oppId + '\'';
      }
     
      this.opp = Database.query(opp_query);
    }
}

Implement the Visualforce Page

On your VisualForce page, embed the component and pass in the PropertyComponentOptions property from the controller as shown in the below sample code. Make sure the component is within the <apex:form/> tag.

<apex:page standardController="zqu__Quote__c" title="Property Component Sample" extensions="PropertyComponentSampleController" sidebar="true" showHeader="true">
 
  <apex:sectionHeader title="Property Compoment" subtitle="Sample" id="quoteTitle" />
  <apex:form id="quoteForm">
    <zqu:PropertyComponent options="{!theOptions}">     
      <!-- Custom Rendered Fields -->
      <apex:outputPanel styleClass="customRenderedFieldPanel" rendered="{!IF(field.name == 'Custom_Picklist_Field__c', true, false)}">
        <apex:outputPanel style="float: left; padding-top: 0px; width: {!IF(fieldSet.isSingleColumn, '17.1%','34.5%')};" styleClass="labelCol">
          <apex:outputLabel style="margin-right: 10px;">{!field.label}</apex:outputLabel>
        </apex:outputPanel>
        <apex:inputField value="{!quote.Custom_Picklist_Field__c}"
                         required="{!field.isRequired}"
                         onchange="displayStatusModal();changeCustomPicklist(this.options[this.selectedIndex].value);" />
      </apex:outputPanel>
     
      <apex:outputPanel id="customTextField" styleClass="customRenderedFieldPanel" rendered="{!IF(field.name == 'Custom_Text_Field__c', true, false)}">
        <apex:outputPanel style="float: left; padding-top: 0px; width:{!IF(fieldSet.isSingleColumn, '17.1%','34.5%')};" styleClass="labelCol">
          <apex:outputLabel style="margin-right: 10px;">{!field.label}</apex:outputLabel>
        </apex:outputPanel>
        <apex:inputField value="{!quote.Custom_Text_Field__c}" required="{!field.isRequired}"/>
      </apex:outputPanel>
     
    </zqu:PropertyComponent>
   
    <!-- Action Function for re-rendering custom fields -->
    <apex:actionFunction name="changeCustomPicklistValue" action="{!onChangeCustomPicklist}" rerender="notificationPanel,customTextField" immediate="true" oncomplete="javascript:closeStatusModal();">
      <apex:param assignTo="{!selectedCustomPicklistValue}" value="" name="val"/>
    </apex:actionFunction>
   
    <script>
      function changeCustomPicklist(val){
        changeCustomPicklistValue(val);
      }
    </script>
   
  </apex:form>
</apex:page>