Conga Product Documentation

Welcome to the new doc site. Some of your old bookmarks will no longer work. Please use the search bar to find your desired topic.

Show Page Sections

Manually Updating a Grid VisualForce page

Grid Visualforce pages are created through the Grid Setup Page or the Conga Grid QuickStart as Single Tabs, MultiTabs, or Related Lists.

Single Tab Grid

<apex:page sidebar="false" showHeader="true" docType="html-4.01-strict">

<CRMC_PP:Grid ObjectName="Account" DelayLoad="false" ViewID="a1B1U000001q6wRUAQ"
EnableNewButton="true" EnableNewInline="true" EnableEdit="true" EnableActions="true" EnableFieldChooser="true"
EnableStickyViews="true" EnableToolbar="true" EnableViews="true" EnableFormatting="true" EnableReadingPane="true" />

<CRMC_PP:DrillUp />

</apex:page>

Above is an example of a Grid of Accounts that are set in a Salesforce Custom Tab.

The Components each have a value of True or False. This is the only value necessary to change in each component. The exception is the ViewID. See Hard-coding a View ID for more information.

Component

Definition

SideBar

  • Determines if the Salesforce Sidebar is displayed.
  • Value is either true or false.

ShowHeader

  • Determines if Salesforce Header is displayed.
  • Value is either true of false.

Grid ObjectName

  • Determines the Salesforce Object in the Grid via the Salesforce Object Name.

DelayLoad

  • Only effective in MultiTab Grids.
  • Determines if the Tab loads without being selected.
  • This value should be False if it is not the Active Tab.
  • More information about DelayLoad is located in the MultiTab Grid section.

ViewId

  • Sets the Default view for this Tab.
  • This behavior overrides the "Default" setting on the View itself and and will load if using Reset to Default in the view.
  • To get the ID of the View, see Hard-coding a View ID.

EnableNewButton

  • Determines if the New Record button can create a new record in a new window.
  • Value is either true or false.

EnableNewInline

  • Determines if the New Records button can create a new record inline.
  • Value is either true or false.

EnableEdit

  • Determines if the Grid has the Edit button in the Toolbar.
  • If this is set to false and the Grid is in Inline Edit mode, the Save button no longer appears on the Toolbar.
  • If the Grid is not in Edit mode, the button appears on the toolbar as Save View and Save View As, but does not have the ability to save data.
  • Value is either true or false.

EnableActions

  • Determines if Actions are invoked on the Grid.
  • Note: This does not remove the Actions button from the Grid, but disables clicking it and the ability to invoke the Actions menu by right-clicking on the View.
  • Value is either true or false.

EnableFieldChooser

  • Determines if the Field Chooser under the Configure menu is enabled for the Grid.
  • Value is either true or false.

EnableStickyViews

  • Determines if the Grid View is cached in a browser, so that if a user navigates away from the Tab the Grid lives on after making changes to the view, the changes are still there when the user comes back.
  • Value is either true or false.

EnableToolbar

  • Determines if the Toolbar is available for the Grid.
  • Value is either true or false.

EnableViews

  • Determines if the View selection dropdown is available.
  • Value is either true or false.

EnableFormatting

  • Determines if Conditional Formatting is available in the Configure menu.
  • Any existing Conditional Formatting Rules applied to your view is still active if this is set to false.
  • Value is either true or false.

EnableReadingPane

  • Determines if the ReadingPane is available.
  • Value is either true or false.

Related List Grid

<apex:page standardController="Account" showHeader="false" docType="html-4.01-strict">
<CRMC_PP:Grid
ObjectName="Contact" FKName="AccountId" FKValue="{!Account.Id}" DelayLoad="false" ViewID=""
EnableNewButton="true" EnableNewInline="true" EnableEdit="true" EnableActions="true" EnableFieldChooser="true"
EnableStickyViews="true" EnableToolbar="true" EnableViews="true" EnableFormatting="true"
EnableReadingPane="true" />
<CRMC_PP:DrillUp />
</apex:page>

Above is an example of a Related List Grid of Contacts on an Accounts Page Layout. It contains all the same elements as the Single Tab above, but has these components that are specifically different:

Component

Definition

standardController

  • Determines the Parent Object the Related List Grid is available for.

FKName

  • The name of the Foreign Key Field that filters the Grid Values.
  • Standard field name will be the ID of the Parent, ie "AccountID".
: This is created automatically and is rarely modified.

FKValue

  • The value of the FKName.
  • Standard value is the ID of the parent
  • Example: "{!Account.Id}"
: This is created automatically and is rarely modified.

DelayLoad

  • Only effective in MultiTab Grids.
  • Determines if the Tab loads without being selected.
  • This value should be False if it is not the Active Tab.
  • More information about that can be found below.

MultiTab Grid

<apex:page sidebar="false" showHeader="true" docType="html-4.01-strict">
<div id="tabstrip" style="display:none;">
<ul> 
<li class="k-state-active">Pending Orders</li>
<li>This Month</li>
<li>Last Month</li>
<li>This Year</li>

<li><All/li>
<li>Order Detail (This Year)</li>
</ul>
<!-- Pending Orders -->
<div style="overflow:hidden;">
<CRMC_PP:Grid ObjectName="Order" DelayLoad="false" ViewID="a1B1U000001q6wM" 
EnableNewButton="true"
EnableNewInline="true" EnableEdit="true" EnableActions="true" EnableFieldChooser="true"
EnableStickyViews="true" EnableToolbar="true" EnableViews="true" EnableFormatting="true"
EnableReadingPane="true" />
 <CRMC_PP:DrillUp /> 
 </div>

<!-- This Month -->
<div
style="overflow:hidden;"> 
<CRMC_PP:Grid ObjectName="Order" DelayLoad="true" ViewID="a1B1U000001q6wN"
EnableNewButton="true" EnableNewInline="true" EnableEdit="true" EnableActions="true"
EnableFieldChooser="true" 
 EnableStickyViews="true" EnableToolbar="true" EnableViews="true"
EnableFormatting="true" EnableReadingPane="true" />
 <CRMC_PP:DrillUp /> 
 </div>

<!-- Last Month -->

<div style="overflow:hidden;"> 
<CRMC_PP:Grid ObjectName="Order" DelayLoad="true"
ViewID="a1B1U000001q6xTMAM" 
 EnableNewButton="true" EnableNewInline="true" EnableEdit="true"
EnableActions="true" EnableFieldChooser="true" 
 EnableStickyViews="true" EnableToolbar="true"
EnableViews="true" EnableFormatting="true" EnableReadingPane="true" />
 <CRMC_PP:DrillUp /> 
</div>

<!--
This Year -->
<div style="overflow:hidden;"> 
<CRMC_PP:Grid ObjectName="Order" DelayLoad="true"
ViewID="a1B1U000001q6xU" 
 EnableNewButton="true" EnableNewInline="true" EnableEdit="true"
EnableActions="true" EnableFieldChooser="true" 
 EnableStickyViews="true" EnableToolbar="true"
EnableViews="true" EnableFormatting="true" EnableReadingPane="true" />
 <CRMC_PP:DrillUp /> 
</div>

<!--
All -->
<div style="overflow:hidden;"> 
<CRMC_PP:Grid ObjectName="Order" DelayLoad="true"
ViewID="a1B1U000001q6xY" 
 EnableNewButton="true" EnableNewInline="true" EnableEdit="true"
EnableActions="true" EnableFieldChooser="true" 
 EnableStickyViews="true" EnableToolbar="true"
EnableViews="true" EnableFormatting="true" EnableReadingPane="true" />
 <CRMC_PP:DrillUp /> 
</div>
 
 <!--
Order Detail - This Year -->
<div style="overflow:hidden;"> 
 <CRMC_PP:Grid ObjectName="OrderItem"
DelayLoad="true" ViewID="a1B1U000001q6yY" 
 EnableNewButton="true" EnableNewInline="true"
EnableEdit="true" EnableActions="true" EnableFieldChooser="true" 
 EnableStickyViews="true"
EnableToolbar="true" EnableViews="true" EnableFormatting="true" EnableReadingPane="true" />

<CRMC_PP:DrillUp /> 
</div>

</div>
<script>
$(document).ready(function() {

$("#tabstrip").kendoTabStrip({
 activate: function(e){
 setTimeout(function(){ $(window).resize(); });
 }
 });

$("#tabstrip").css("display", "block");
});
 </script>
</apex:page>

In the example above, Grid has several Tabs all based on the Order object and each with its own View ID. Each Grid is listed out by the Tab Strip labels. The MultiTab allows for a Grid Visualforce page to have multiple objects, or the same Object with different views loading by default, as exemplified above. This is also available as a Tab, or as a Related List. The components to be mindful are listed below:

Component

Definition

div Id Tabstrip

  • This sets up the list of Tabs for each Grid instance.
  • Each individual tab is determined by their related List option, designated by <li>Name</li>.
  • The label between this appears in the actual Grid tab itself.

li class = "k state active"

  • This determines what Grid Tab loads first.
  • It is typically the first List Option, but can be manually changed to a different one.
  • Note: the List option selected to be the k-state-active should have DelayLoad set to False.

DelayLoad

  • Determines if the Grid needs to be clicked on to load.
  • Default is False.
  • If set to True, the Grid tab must be clicked before it will load.
  • If the Grid section is the one that corresponds with the K-state-active setting in the tab list, it should be set to False and all others should be set to True. This will cause the other Grid tabs to wait to load until the tab is clicked on, which will help with loading times.

If a user creates a MultiTab Grid and wants to either remove or add a new section, it must be done manually. To add a section, copy an existing segment and update the Object and View Id section, then update the List Options in the position to match.