Skip to main content
Zuora Logo

QuickFilter Component

Zuora

QuickFilter Component

  1. Last updated
  2. Save as PDF

The QuickFilter component provides a UI-based filtering capability against the integrated QuickList. It searches the associated list and refreshes the list with the search result. The QuickFilter component supports the following features:

  • The component renders one or more filter fields based on the configuration options.
  • A QuickFilter can be bound to a QuickList component instance. 
  • A QuickFilter can optionally display a Breadcrumb component instance.  The QuickFilter component will automatically integrate with a Breadcrumb component instance using the name: Associated QuickList Name + "_breadCrumb". For example, the name of the Breadcrumb instance will be "MyList_breadCrumb" where the associated QuickList on the filter is named "MyList".
  • When you select a value in the QuickFilter, the associated QuickList and Breadcrum items are refreshed. 
  • When you remove a Breadcrumb item, the selected filter value is reset, and the list is refreshed.  
  • The component comes with an Admin configuration page to view and configure the following component settings that are stored in zqu__ZFilter__c object: 
    • Field set name for the filter layout
    • Filter name
    • Associated SObject
    • Associated QuickList
    • Single-column layout vs. Double-column layout
    • Whether the filter is system generated

The QuickFilter component is available in the Versions 6.2 and later of Zuora Quotes.

The QuickFilter component consists of:

  • QuickFilter.component: The component to be embedded on Visualforce pages
  • FilterItem.class: The Apex class that stores the configuration options for the QuickFilter component

QuickFilter Component Attributes

The QuickFilter component accepts the following attribute.

Attribute
Type
Required?
Description
filterItems List<zqu.FilterItem> Optional

The filter items to be displayed. Use this attribute when you want an extra control over filter items, such as for complex business logic.

If this attribute is not given, the fields of the Picklist type in the field set specified on the zqu__ZFilter__c object is used as select options. 
filterName String Required The name identifier of the Filter object

FilterItem Class Properties

Use the FilterItem class to apply complex business logic to filters. This is an optional attribute of the QuickFilter component. 

The FilterItem class has the following property options.

Property Type Required? Description
displayType Schema.DisplayType Optional

The display type of the filter item. Accepted values are:

  • Boolean to display as a checkbox
  • Picklist to display as a pull-down list
  • MultiPicklist to display as a list

The default value is Picklist.
filterFieldName String Required Name of the field this filter is on
label String Optional Label of the filter item
relatedObjectField String Optional

The API name of the field on the child object that references the parent object.

You must provide the values for both the relatedObjectName and relatedObjectField in order to filter on a child object.
relatedObjectName String Optional

The API name of the related child object that you want to filter on, for example, for filtering on attributes of the child ProductRatePlanCharges associated with selected ProductRatePlans.

You must provide the values for both the relatedObjectName and relatedObjectField in order to filter on a child object.
selectOptions LIST<SelectOptions> Required

The select options to be available in the filter. This is used for Picklist and MultiPicklist only. It is ignored for Boolean filters.
size Integer Optional

Number of filter options to be displayed. Default is 1.

This value is used for Picklist and MultiPicklist only. It is ignored for Boolean filters.

Sample Code

Use Case 1

The following example code shows how to create a QuickFilter on the Product Rate Plan object and integrate it with the QuickList and Breadcrumb components.

To run the QuickFilter sample code:

  1. Create a QuickList with the following field values:
    • List Name: MyList
    • Associated Field Set: zqu__GuidedSellingRatePlanFields
    • SObject Name: zqu__ProductRatePlan__c
  2. Create a Filter with the following field values:
    • ZFilter Name: MyFilter
    • Is Single Column: Checked
    • List: MyList
    • Field Set Name: zqu__GuidedSellingRatePlanFields
    • Object Name: zqu__ProductRatePlan__c
  3. Create the following custom fields on the Product Rate Plan object and populate the fields with values:
    • Active__c
    • Version__c
    • States__c
  4. Create a new class, TestQuickFilterController, with the code shown below.
  5. Create a new Visualforce page with the code shown below.
  6. When you open the Visualforce page, the following QuickFilter instance will appear:
    TestQuickFilter1.png

public with sharing class TestQuickFilterController {
 
    public String filterName {get; set;}
    public List < zqu.FilterItem > items {get; set;}
 
    public TestQuickFilterController() {
 
      filterName = 'MyFilter';
 
      // Initialize filter items
      items = new List < zqu.FilterItem >();
 
      // Checkbox type
      zqu.FilterItem checkbox1 = new zqu.FilterItem();
      checkbox1.label = 'Active (using Display Type of Boolean)';
      checkbox1.filterFieldName = 'Active__c';
      checkbox1.displayType = Schema.DisplayType.Boolean;
      checkbox1.size = 5;
      items.add(checkbox1);
 
      // Picklist type
      zqu.FilterItem picklist1 = new zqu.FilterItem();
      picklist1.label = 'Version (using Display Type of Picklist)';
      picklist1.filterFieldName = 'Version__c';
      picklist1.displayType = Schema.DisplayType.Picklist;
      picklist1.size = 1;
      picklist1.selectOptions = new List < SelectOption >{
        new SelectOption('', '--pick one--'),
        new SelectOption('Gold', 'Gold'),
        new SelectOption('Silver', 'Silver'),
        new SelectOption('Platinum', 'Platinum')
      };
      items.add(picklist1);
 
      // Multi picklist type
      zqu.FilterItem picklist2 = new zqu.FilterItem();
      picklist2.label = 'States (using Display Type of MultiPicklist)';
      picklist2.filterFieldName = 'States__c';
      picklist2.displayType = Schema.DisplayType.MultiPicklist;
      picklist2.size = 4;
      picklist2.selectOptions = new List < SelectOption >{
        new SelectOption('CA', 'California'),
        new SelectOption('NY', 'New York'),
        new SelectOption('GA', 'Georgia'),
        new SelectOption('WA', 'Washington'),
        new SelectOption('TX', 'Texas')
      };
      items.add(picklist2);
    }
}


<apex:page controller="TestQuickFilterController">
   <!-- Include the quickFilter component, identifying the filter object by name -->
   <zqu:QuickFilter filterName="MyFilter" filterItems="{!fiArr}"/>
   
   <!-- Include the quickList identified by the list name -->
   <zqu:QuickList contextIds="" listName="MyList"/>

   <!-- Include the breadcrumb component identified by the breadcrumb name -->
   <zqu:Breadcrumb name="MyList_breadCrumb" />
</apex:page>

Use Case 2

This sample code shows how to create a QuickFilter on a related child object.

The following code creates a sub filter item that filters Product Rate Plans based on the zqu__Type__c field of their child Product Rate Plan Charges:

zqu.FilterItem filterItem = new zqu.FilterItem();
filterItem.label = 'Type';
filterItem.filterFieldName = 'zqu__Type__c';
filterItem.relatedObjectField = 'zqu__ProductRatePlan__c';
filterItem.relatedObjectName = 'zqu__ProductRatePlanCharge__c';
filterItem.displayType = Schema.DisplayType.Picklist;
filterItem.size = 1;
filterItem.selectOptions = new List < SelectOption > {
    'One-Time',
    'Recurring',
    'Usage'
};