Double Tabs (Two-tier Tabs)

As of version 3.0, you can add a second set or tier of tabs to a top-level tab on a page. The Kitchen Sink samples that come with the SDK include a page definition spec that demonstrates a tab with one tier and a tab with a second tier of tabs.

The Kitchen Sink samples include an example of two-tier tabs.

To add a second tier of tabs, you can use the Tabs element within the Tab element that declares a top-level tab. As with top-tier tabs, second-tier tabs are uniquely identified and can contain sections. Here is a "Hello World" example that shows a second tier of tabs. Notice the Tabs element in the first Tab element. This example displays a web page on each tab.

<PageDefinitionSpec
    xmlns="bb_appfx_pagedefinition"
    xmlns:common="bb_appfx_commontypes"
    ID="96a2bb06-e909-4f4a-8f35-db160ae04311"
    Name="Double Tabs Hello World Page"
    Description="A page for displaying a double tabs hello world"
    Author="Technical Training"
    >
  <PageHeader Caption="Double Tabs Hello World" />
  <Tabs>
    <Tab ID="9c109995-2838-4173-b0ba-0b324c42fe3d" Caption="Blackbaud Developer Network" Visible="True">
      <Tabs>
        <Tab Caption="Home" ID="152AA6C0-6C63-46EB-9C08-99FDDFCE2EB4">
          <Sections>
            <Section ID="30655356-F37B-4B55-96EF-29558F12CB4A">
              <WebPage Url="http://www.bbdevnetwork.com/"></WebPage>
              <HelpKey>http://www.bbdevnetwork.com/</HelpKey>
            </Section>
          </Sections>
        </Tab>
        <Tab Caption="Q and A" ID="1C85E823-07B3-4FA0-B096-5A2FAE2C7DDA">
          <Sections>
            <Section ID="54C3EFC1-4F32-4AB4-A7D3-F4E8B3A597C2">
              <WebPage Url="http://www.bbdevnetwork.com/qa/"></WebPage>
              <HelpKey>http://www.bbdevnetwork.com/qa/</HelpKey>
            </Section>
          </Sections>
        </Tab>
      </Tabs>
    </Tab>
    <Tab ID="1298D15C-55A6-4A5D-83E1-C25AC5C1808A" Caption="Online Guides" Visible="True">
      <Sections>
        <Section ID="BB7FF46F-276E-49CA-930E-5AAD6815F5D3">
          <WebPage Url="https://www.blackbaud.com/files/support/guides/infinitydevguide/infsdk-developer-help.htm"></WebPage>
          <HelpKey>https://www.blackbaud.com/files/support/guides/infinitydevguide/infsdk-developer-help.htm</HelpKey>
        </Section>
      </Sections>
    </Tab>
  </Tabs>
</PageDefinitionSpec>

Tip: When you add a help key to a section, it appears as a link when you click the help button or press F1. But when you add a help key to a tab, no link is rendered. In the following image, the links are to help keys defined on sections and not tabs.