A tabbed UIBB consists of number of tabs. Each tab can, in turn, be configured to include other UIBBs.
In an SAP development system, you have created a Web Dynpro application and created an initial screen. For more information, see:
Creating and Configuring a Tabbed UIBB
Choose the UIBB pushbutton and select Tabbed Component.
Enter the following details for the tabbed GUIBB and choose Save.
Component: FPM_TABBED_UIBB
View: TABBED_WINDOW
Configuration Name: An appropriate configuration name
Choose Configure UIBB.
To create the configuration for your UIBB, in the Editor for the Web Dynpro ABAP Component Configuration screen, choose New.
In the Create Configuration dialog box, enter any required description and confirm your entry.
In the Select Package dialog box, enter your required package and confirm your entry.
Creating the Master UIBB
Choose Master UIBB.
Choose the Form Component and create a Form UIBB. For more information, see the Creating and Configuring a Form Component section of the topic Creating a Form UIBB.
Save your entries.
Return to the Tabbed UIBB Component Configuration screen by clicking the link that points to the tabbed UIBB component configuration.
Creating Tabs
Choose Tab under the Tabbed UIBB Schema tab.
Configure the form or list as per your requirement under the newly created Tab and add fields. For more information, see Creating and Configuring a Form UIBB and Creating and Configuring a List UIBB.
Save your entries.
Creating Wires
The wiring in the Tabbed UIBB configuration happens at two levels:
First level of wiring connects the Master UIBB and other UIBBs in the Main page
Second level of wiring happens within the tabbed UIBB
The basic concept of wiring is to link one UIBB to other UIBB. The data flows from the source UIBB to the target UIBB through the connector class /BOFU/CL_FBI_CONNECTOR. If the source UIBB is a Form UIBB, the Collection arrow is used for connecting the UIBBs through the wire. If the source UIBB is a list UIBB, the Selection arrow is used to connect the UIBBs.
Follow these steps to perform the wiring that connects the Master UIBB and other UIBBs in the Main page:
To complete the wiring, on the Wire Schema tab, choose the Graphical Wire Editor.
Select the UIBBs under Available UIBBs.
Drag and drop the UIBBSs to the panel on the right-hand side. The configuration box, has two arrows, Selection and Collection, that you use to move data to other UIBBs.
Select the Collection/Selection arrow of any other UIBB and join it to the arrow head of the Master UIBB.
The Collection arrow of the Bootstrap is joined to the arrow head of the Master UIBB.
In the Connector Details dialog box, select /BOFU/CL_FBI_CONNECTOR as the connector class.
Choose Done. The configuration screen appears.
Save the component configuration.
Follow these steps to perform the wiring within the Tabbed UIBB.:
To complete the wiring, on the Wire Schema tab, choose Graphical Wire Editor .
Select the UIBBs under Available UIBBs.
Drag and drop the UIBBSs to the panel on the right-hand side. The configuration box, has two arrows, Selection and Collection , that you use to move data to other UIBBs.
Select the Collection arrow of the Master UIBB and join it to the arrow head of the first UIBB.
In the Connector Details dialog box, select /BOFU/CL_FBI_CONNECTOR as the connector class.
Similarly complete the wiring for other UIBBs if any.
Choose Done. The configuration screen appears.
Save the component configuration.
Using the Tabbed Exit
You use the Tabbed Exit feature to enable or disable certain tabs based on specific conditions.
Choose the Master UIBB pushbutton.
Choose the Form Component.
Enter the following details for the UIBB:
Component: /BOFU/WDC_FBI_TABBED_EXIT
View: W_MAIN
Configuration Name: An appropriate configuration name
Save your entries.
Return to the Tabbed UIBB Component Configuration window by selecting the link that points to the tabbed UIBB component configuration.
Select the Master UIBB.
Choose Configure UIBB.
To create the configuration for your UIBB, in the Editor for the Web Dynpro ABAP Component Configuration screen, choose New.
In the Create Configuration dialog box, enter any required description and confirm your entry.
In the Select Package dialog box, enter your required package and confirm your entry. The Configuration Context screen appears.
Configuring the Condition for Tab Control
Navigate to Elements.
underChoose tabControl. The Attributes of the Element tabControl section appears.
Enter the tab ID in the Tab ID field.
Select the Final checkbox.
Select the Hide if No Lead Sel checkbox.
Choose Check.
Select the tabControl row and choose Add.
Choose the Condition option. The Attributes of the Element Condition section appears.
Set the required condition using the following fields:
Component Name
Field Property
INCl/EXCL
Option
Selection Value
Selection Value
If you want to include only those entries for which the CURRENCY_FIELD value is INR, then enter the following values for the corresponding fields:
Component Name - CURRENCY_FIELD
Field Property -Visible
INCl/EXCL - I
Option - EQ
Selection Value - INR
Selection Value - 0
Save your entries.
Return to the Tabbed UIBB Component Configuration screen.