This example shows an Account Multi-Tabular related list. We want to view the Opportunity Products (in a separate tab) related to a given Account record.

Here is the Visualforce Markup code for the Opp Products tab. You can pass any value from the Account page to any object. This matches the FKValue to the FKName. Here, we pass in the AccountId to the matching Opportunity.AccountId.

The example is essentially running the following query:

SELECT CourseRegistrationsWHERE CourseRegistration.Contact.AccountId = @AccountId

This example shows an Account Multi-Tabular related list that displays Course Registrations (a custom object) linked to an Account.

The following diagram shows the object hierarchy:

Below is the Visualforce Markup code for the Course Registrations tab. With custom objects, you must use the __r syntax to traverse upward in the hierarchy to match a field from the parent object. Here, we use the __r syntax with Contact to traverse to the parent object, Account.

The example is essentially running the following query:

SELECT CourseRegistrationsWHERE CourseRegistration.Contact.AccountId = @AccountId

This example shows an Account Multi-Tabular related list. The Sibling Teams tab displays all other teams in the AFC-West division. It shows how you can pass in any field other than an Id field, to find matching records.

Here, we pass in the Account. Division field from the current page to a matching Account object for the same division.

You could use a similar approach, for example, to match Leads to Contacts using the Lead.Email = Contact.Email match.

This example shows a related list of completely disconnected objects, where the objects do not match by any field or key. The list appears to look like a related list, but it actually just a list of active Price Book entries that you can batch-add to Opportunity Line Items.

Here is the markup code for the PriceBook Products tab:

This example shows how to pass in the AccountId for the record you are viewing while matching it to the Account.ParentId to obtain all the grandchild records of the parent (such as Contacts and Opportunities) of all the subsidiary accounts.

• Each <div>...</div> tag set corresponds to a tab, in a specific order.
• Use the FKName parameter (the foreign key name) to set the related objectName and its relationship to the primary object. Then pass in the ID of the primary object using the FKValue parameter.
• You can also pass in other ID fields to objects that may not be directly related to the primary object.
• Refer to the Add New Tabs topic for instructions on hard-coding a specific view to the list. You can do this instead of inheriting the default view or the last view used.
• Setting the DelayLoad parameter to False will not load the data in the grid until a user clicks the tab. This improves the page-loading performance.

  <apex:page standardController="Account" showHeader="false" DocType="html-4.01-strict"> <div id="tabstrip" style="display:none;"> <!--- Define the actual tabs and their order ---> <ul> <li class="k-state-active">Sub Accounts</li> <li>Contacts in Account Hierarchy</li> <li>Opportunities in Account Hierarchy</li> <li>Activity in Account Hierarchy</li> </ul> <!--- Sub-Accounts (child accounts) ---> <div style="overflow:hidden;"> <CRMC_PP:Grid objectName="Account" FKName="ParentId" FKValue="{!Account.Id}" ViewId="" EnableNewButton="true" EnableNewInline="true" EnableEdit="true" EnableActions="true" EnableFieldChooser="true" EnableStickyViews="true" EnableToolbar="true" EnableViews="true" EnableFormatting="true" EnableReadingPane="true" DelayLoad="true" /> </div> <!--- CONTACTS - pass in Account.Id to the Contact.Account.ParentId to get all the contacts at all the child Accounts ---> <div style="overflow:hidden;"> <CRMC_PP:Grid objectName="Contact" FKName="Account.ParentId" FKValue="{!Account.Id}" ViewId="a06o000000Ix3PDAAZ" EnableNewButton="false" EnableNewInline="true" EnableEdit="true" EnableActions="true" EnableFieldChooser="true" EnableStickyViews="true" EnableToolbar="true" EnableViews="false" EnableFormatting="true" EnableReadingPane="true" DelayLoad="true" /> </div> <!--- OPPORTUNITIES - pass in Account.Id to the Opportunity.Account.ParentId to get all the Opportunities at all the child Accounts ---> <div style="overflow:hidden;"> <CRMC_PP:Grid objectName="Opportunity" FKName="Account.ParentId" FKValue="{!Account.Id}" ViewId="a06o000000Ix3QaAAJ" EnableNewButton="false" EnableNewInline="true" EnableEdit="true" EnableActions="true" EnableFieldChooser="true" EnableStickyViews="true" EnableToolbar="true" EnableViews="false" EnableFormatting="true" EnableReadingPane="true" DelayLoad="true" /> </div> <!--- TASKS - pass in Account.Id to the Task.Account.ParentId to get all the Tasks at all the child Accounts ---> <div style="overflow:hidden;"> <CRMC_PP:Grid objectName="Task" FKName="Account.ParentId" FKValue="{!Account.Id}" ViewId="a06o000000Ix3Q1AAJ" EnableNewButton="true" EnableNewInline="true" EnableEdit="true" EnableActions="true" EnableFieldChooser="true" EnableStickyViews="true" EnableToolbar="true" EnableViews="true" EnableFormatting="true" EnableReadingPane="true" DelayLoad="true" /> </div> </div> <script> $(document).ready(function() { $("#tabstrip").kendoTabStrip({ }); $("#tabstrip").css("display", "block"); }); </script> </apex:page>