The original FPM Cookbook for SAP NetWeaver 7.00.
FPM Developer's Guide 7.00/7.10
Context-Based Adaptations (Basic)
Learn the basics of creating a Floorplan Manager context-based adaptation of an application.
Drag and Drop Functionality with Feeder class
To use Drag-and-Drop between GUIBBs and UIBBs, Drag-and-Drop must be enabled in the following areas:
- The feeder class that provides the GUIBB with data or in the Web Dynpro component view of a UIBB
Code for enabling drag and drop in feeder class.
whenever we inherit any form feeder class( IF_FPM_GUIBB_FORM) or list feeder class( IF_FPM_GUIBB_LIST ) interface in your classthere is interface method GET_DEFINATION
GET_DEFINATION offer a dedicated exporting parameter ET_DND_DEFINITION (of type FPMGB_T_DND_DEFINITION) in method GET_DEFINITION. Its line structure (of type FPMGB_S_DND_DEFINITION)
COMPONENT in structure FPMGB_S_DND_DEFINITION:-
TYPE - This field defines the type of the drag & drop definition entry, whether it is a drag source or a drop target. This attribute value cann’t be overwritten in the configuration or modified at runtime
ENABLED - This attribute defines whether a drag & drop definition entry is enabled or not. This attribute value can be overwritten in the configuration or modified at runtime.
Note:-
If a drag source is disabled dragging will be completely blocked.
If a drop target is disabled dropping on this target will be completely blocked.
TAGS - This attribute specifies the relevant tags of the drag & drop definition entry. If you have to drop some data than drag source tag must match with drop source tag. Tags can be overwritten in the configuration or modified at runtime.
Multiple tags can be separated by a space.
Note:-
Tags such as ‘JITU*’ or ‘TEST*’, are supported by system.
SCOPE - The scope defines whether dropping is possible on the drag source itself or on any other GUIBB.
If dropping is perform on drag source itself its local for example dragging row from list UIBB and dropping it on same list UIBB.
If dragging from list and dropping on form UIBB its scope must be global.
Default scope is ‘Global’. The scope can be overwritten in the configuration or later at runtime. .
NAME - A name is required for distinguish multiple drop definition entries of the same type. this attribute can neither be overwritten during configuration or modified at runtime.
OVERRIDE - This attribute defines whether other properties such as scope of the drag & drop definition entry can be modified at runtime or not.
This attribute value can be overwritten in the configuration
Code for setting diffrent attribute and making drag and drop sources:-
- The Enable Drag and Enable Drop checkboxes in the configuration editor
Drag-and-Drop is primarily enabled in the feeder class and its attributes are displayed as the Drag-and-Drop attributes in the configuration editor. You can edit these attributes. If no Drag-and-Drop attributes are defined in the feeder class, no Enable Drag and Enable Drop checkboxes are displayed in the configuration editor.
To display the Drag-and-Drop attributes in the configuration editor.
In List UIBB :-
Open FPM_LIST_UIBB component in diffent window.
Select general setting tab there on tool bar you will see GUIBB setting.
Selecting GUIBB setting will show DRAG and DROP setting click on it.
Explorer with popup window appear in which drag and drop properties defined in feeder class appear.
In Form GUIBB :-
Open form GUIBB in different window.
Select group fro making it drop source.
Whenever a drag source is dropped FPM event 'FPM_DROP_COMPLETED' is triggered.
if_fpm_guibb_list=>gc_guibb_list_on_drop constant have value 'FPM_DROP_COMPLETED'
after triggering 'FPM_DROP_COMPLETED' we have to call method get_value( ) of interface IF_FPM_PARAMETER
If you export drag source ( if_fpm_guibb_constants=>gc_guibb_dnd-drag_source ) in get_value( ) method.
Method will fill variable of type fpmgb_s_drag_and_drop this variable have all information about drag source.
DRAG_SOURCE_INDICES – holds table index
DROP_POSITION - holds at which drag data is dropped
DRAG_SOURCE_DATA – holds all drag source data
Code when 'FPM_DROP_COMPLETED' triggered.
IF iv_eventid->mv_event_id = if_fpm_guibb_list=>gc_guibb_list_on_drop.
iv_eventid->mo_event_data->get_value( exporting iv_key = if_fpm_guibb_constants=>gc_guibb_dnd-drag_source
importing ev_value = lt_drag_result ).
lo_result = lt_drag_result-drag_source_data.
if lo_result isnotinitial.
ASSIGN lo_result->* TO<lr_result>.
lt_drag_result_set = <lr_result>.
ct_selected_lines = lt_drag_result-drag_source_indices.
drop_position = lt_drag_result-drop_position.
if ct_selected_lines isnotinitial.
LOOPAT ct_selected_lines ASSIGNING<rstabix>.
ls_selected_lines = <rstabix>-tabix.
READTABLE lt_drag_result_set assigning<value_sflight> index ls_selected_lines.
ls_sflight-connid = <value_sflight>-connid.
ls_sflight-carrid = <value_sflight>-carrid.
ls_sflight-planetype = <value_sflight>-planetype.
ls_sflight-price = <value_sflight>-price.
ls_sflight-fldate = <value_sflight>-fldate.
ls_sflight-currency = <value_sflight>-currency.
if mv_drop_on_row eq abap_true.
insert ls_sflight into lt_change_result index drop_position.
else.
insert ls_sflight into lt_result index drop_position.
endif.
drop_position = drop_position + 1.
endloop.
endif.
endif.
A Step-by-Step guide to create a simple FPM application using Feeder Class for FORM GUIBB
Introduction:
In this article, we will create a simple FPM Application using FEEDER CLASS for FORM GUIBB (Generic User Interface Building Blocks). We will use OIF (Object Instance Floorplan) in this article.
We will take a simple example of getting the material number from user and displaying the description of it using FORM GUIBB. One needs to follow all the steps to avoid the runtime errors.
Prerequisite: Before following this document, one should have a basic knowledge of WebDynpro ABAP and ABAP Classes.
What is Feeder Class?
A class that implements the IF_FPM_GUIBB_FORM ABAP interface (for form components) or the IF_FPM_GUIBB_LIST ABAP interface (for list components). Business logic can be access through it. It is the link between the application and the GUIBB.
There are 2 ways which can be used to develop the FPM application. One is using Free Style UIBB and Generic UIBB. In this article we will use the GUIBB (FORM is one of the available GUIBB).
Steps to be followed:
1. Go to transaction code SE24 and create a FEEDER Class as follows.
2) Go to the “Interfaces” tab and enter the interface for FORM GUIBB “IF_FPM_GUIBB_FORM”.
And press Enter. It will automatically add the interface for the generic UIBB “IF_FPM_GUIBB
3) Now if you click on the Methods tab, you will see all the methods implemented by these two interfaces.Make Sure you go inside each and every Method and activate them so it won’t give short dump.
4) Now, go to method “GET_DEFINITION” enter the following code.
* This method is for building Field catalog and actions required in the form
* Local Varibale declarations
DATA: li_action_line TYPE fpmgb_s_actiondef.
* Prepare Field catalog
eo_field_catalog ?= cl_abap_tabledescr=>describe_by_name( 'MAKT' ). " Here we can use any flat strutures or local types
* Prepare actions
li_action_line-id = 'GET_MAT'. " You can give wahtever name you want to the action ID
li_action_line-visible = cl_wd_uielement=>e_visible-visible.
li_action_line-enabled = abap_true.
li_action_line-imagesrc = 'ICON_ADDRESS'. " Image for actions
APPEND li_action_line TO et_action_definition.
5) Go to method “GET_DATA” enter the following code.
DATA : li_makt_line TYPE makt.
li_makt_line = cs_data. "cs_data contains the data
IF li_makt_line-matnr IS NOT INITIAL.
SELECT SINGLE * FROM makt INTO cs_data WHERE matnr = li_makt_line-matnr .
ev_data_changed = abap_true.
ENDIF.
* Check if the "Start Over" Button in clicked ; If yes clear the contents
if io_event->MV_EVENT_ID = 'FPM_GOTO_START'.
CLEAR cs_data.
ENDIF.
6) Now go to SE80 and create a WebDynpro component as follows.
7) Enter the Interface““IF_FPM_UI_BUILDING_BLOCK” in Implemented Interface tab. Note the RED signal. It means you need to reimplement this interface in this WD component.
8) Click on “Reimplement".
9) Create the WebDynpro Application by right clicking on component as follows.
10) Change the component and View in the properties of WD Application. In this example we are using OIF and hence the component is as follows. In case of other floorplans like GAF and OVP write FPM_GAF* and do the F4 and you will get the list.
Component : FPM_OIF_COMPONENT
Interface view: FPM_WINDOW
11) Now go to the package where you have saved the WebDynpro Application and right click on the Application and click “Create/Change Configuration”.
12) It will open the browser. Enter the Configuration ID. This is the FIRST CONFIGURATION of your FPM application. This is called as APPLICATION CONFIGURATION. Press Enter so it will give the following ERROR.
This is expected because till this point your APPLICATION CONFIGURATION does not exist. Click on Create button. You will receive the success message.
13) After Application Configuration, it’s time to create the Component Configuration for your OIF floorplan.
Enter the name component configuration name and click on “Go to Component Configuration”.
This is again expected error and same as above (Step 12). Click on Create and give your package and it will open the next screen with the success message.
14) Click on the “Attributes” button and enter Component as “FPM_FORM_UIBB”.
Now as mentioned in the informational message on screen, go to View and click on F4 help and select the View as FORM_WINDOW.
Click OK
15) Now let’s create the GUIBB Configuration and hence enter the Configuration Name and click Enter. It will appear above the “Configure UIBB” button.
16) You will receive the same error and that is expected error. Click on Create.
17) Enter your package name and then it will ask for the FEEDER CLASS name. Enter the Feeder Class name and click on Edit Parameters.
18) You will receive the warning message and that can be ignored.
Just click OK.
19) On this screen, Click on the “Add Group”. It will add the group1 under Form and you can name it.
20) After adding group, we need to configure that as follows. Select the MATNR as we want to display it as Input field and then add “Button Row”. Click OK.
21) From Enhancement pack 5, we have some very good options like Value Suggestion while entering the material number. In order to view all the options available; just click on the “Element: Material” link under FORM-> Group1.
22) After that let’s configure the button we have added and add the action to it.
23) To display the material details, lets add one more group and configure it by selecting the fields we want to display as follows.
24) Click on the individual elements and set the property as follows :
Do it for all the fields and click on SAVE.
25) Finally, TEST the application. There are 2 ways to test the application as follows.
a) Click on the Application Configuration link and then click on TEST.
It will take you to the Application Configuration. Just click on TEST.
b) From SE80; enter your package name and select the application and click on Application Configuration and execute.
26) The Result screen looks like as follows, Enter the material and the click on Get Details it will populate the data.
Leveraging Org Chart Functionality in custom applications
Introduction
My earlier blog( http://scn.sap.com/community/erp/hcm/blog/2012/12/29/new-org-chart-functionality) gives a decent introduction on the new features of NAKISA based Org Chart in EHP6 which was purely a "Functional " blog. This document demonstrates the steps to create a custom application leveraging this Standard Org Chart functionality.
Quick Background
SAP has provided a Standard SAP Component - HIER_VIS_UI_WRAPPER which renders the Org Chart based on the data passed. The Org Chart i.e. Adobe Flash file is attached to this component as MIME Object -
We are going to use the SAP delivered hierarchy - PAO_HIER which has the following definition -
Steps
- Create a Web Dynpro Component with the used component as HIER_VIS_UI_WRAPPER(SAP delivered NAKISA Org Chart Rendering component).
- Being a new generation WD ABAP Developer
, I started using the FPM Framework in most of my new components. So went ahead implementing the following FPM Interfaces -
- Create Component Controller Attributes for MO_FPM of type IF_FPM and MO_MESSAGE_MANAGER of type IF_FPM_MESSAGE_MANAGER.
- Implement the Interface method FPM_INITIALIZE of the Component Interface - IF_FPM_MULTI_INSTANTIABLE to set the component controller attributes -
wd_this->mo_fpm = io_fpm.
wd_this->mo_message_manager = io_fpm->mo_message_manager.
- Implement the Interface method FPM_IS_MULTI_INSTANTIABLE of the Component Interface - IF_FPM_MULTI_INSTANTIABLE to enable Multiple instantiate option -
rv_is_multi_instantiable = abap_true.
- Implement the Interface method - PROCESS_BEFORE_OUTPUT of the Component Interface - IF_FPM_UI_BUILDING_BLOCK to pass data to the HIER_* Component by calling the interface component -
* Hard code the Object ID for now -
lv_object_key = '01 P 10002408'.
* Instantiate the Used Component and call the Interface method to start the render the hierarchy -
lo_cmp_usage = wd_this->wd_cpuse_ui_dataprovider( ).
if lo_cmp_usage->has_active_component( ) is initial.
lo_cmp_usage->create_component( ).
endif.
WD_THIS->lo_INTERFACECONTROLLER = wd_this->wd_cpifc_ui_dataprovider( ).
WD_THIS->lo_interfacecontroller->reset_application(
EXPORTING
iv_hier_vis_app = 'PAO_HIER' "Hierarchy name iv_object_key = lv_object_key " hier_vis_obj_key
iv_search_relevant = abap_True " boole_d
iv_selection_required = abap_true " boole_d
IMPORTING
e_ui_on = lv_nakisa_switch " boole_d).
- Create a View Container "VCU1"(with Height and Width set as 100%) in the default view created(Make sure you set the Layout of the ROOTUIELEMENTCONTAINER as Grid Layout with height as 700 pixels, "Stretched Horizontally" and "Stretched Vertically" enabled) -
- Embed the Interface View - HRPDV_UI_WRAPPER in the VCU1 in the window definition -
- Create the FPM based application and embed this component as a Freestyle UIBB. Test the application to view the below Org Chart -
Step by Step guide to create a simple FPM Tree UIBB application
Introduction:
This is a generic design template for displaying data in a hierarchical list or tree that is implemented using the Web Dynpro component FPM_TREE_UIBB. we use this design template in application specific views (UIBB) where we want to display data in a hierarchical list or tree.
Structure
A hierarchical list is structured as follows:
Master Column: The master column displays all the items in a list. When the system first displays a table, each top-level, parent item in the master column is preceded by an Expand or Collapse icon, which allows you to see the child (sub) items contained within it. A top-level item in the master column without child items has no Expand or Collapse icon preceding it.
Non-master columns: These columns display the details of each list item.
Rows: Each item in a list is displayed in a separate row.
Toolbar: A toolbar displays the Collapse All and Expand All buttons (if selected) and other buttons that you have created.
Step 1: Create a database table as below or use existing data base table.
Sample Data in Database:
Step 2: Creating Feeder class:
Create a class with interface IF_FPM_GUIBB_TREE.
Create structure and table type in types tab
PRIVATE SECTION.
DATA ls_wa TYPE fpmgb_s_tree_master_column.
TYPES: BEGIN OF t_st.
INCLUDE STRUCTURE ls_wa.
TYPES: emp_id(10) TYPE c ,
name(20) TYPE c,
contact_no(10) TYPE n,
mang_id(10) TYPE c,
is_leaf1(1) TYPE c,
END OF t_st.
TYPES: tt_st TYPE TABLE OF t_st.
Implementation of get_defination method
METHOD if_fpm_guibb_tree~get_definition.
DATA: lt_itab TYPE tt_st,
ls_field_descr TYPE fpmgb_s_treefield_descr.
*** add structure
eo_field_catalog ?= cl_abap_tabledescr=>describe_by_data( p_data = lt_itab ).
****set property of fields
CLEAR ls_field_descr.
ls_field_descr-name = 'PARENT_KEY'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-parent_key.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'ROW_KEY'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-row_key.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'TEXT'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-text.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'EXPANDED'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-expanded.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'IS_LEAF'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-is_leaf.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'CHILDREN_LOADED'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-child_load.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'IMAGE_SRC'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-img_src.
APPEND ls_field_descr TO et_field_description.
ENDMETHOD.
Implementing of get_data method
METHOD if_fpm_guibb_tree~get_data.
DATA : lt_data TYPE tt_st,
ls_data TYPE t_st,
lt_db TYPE TABLE OF zrt_test ,
ls_db TYPE zrt_test.
IF io_event->mv_event_id = 'FPM_START'.
**** fecthing data from DB
SELECT * FROM zrt_test INTO TABLE lt_db.
**** addigning to internal table
LOOP AT lt_db INTO ls_db.
ls_data-parent_key = ls_db-mang_id.
ls_data-is_leaf = ls_db-is_leaf1.
ls_data-text = ls_db-name.
ls_data-name = ls_db-name.
ls_data-row_key = ls_db-emp_id.
ls_data-mang_id = ls_db-mang_id.
ls_data-emp_id = ls_db-emp_id.
ls_data-contact_no = ls_db-contact_no.
APPEND ls_data TO lt_data.
ENDLOOP.
**** assign value to ct_data
ct_data = lt_data.
ENDIF.
ENDMETHOD.
Steps 3: Involve in creating a FPM Application
- Goto Tcode SE80 and select your Package to create FPM Application.
- Right click on WebDynpro Application and Create Web Dynpro Application.
- Provide Name of Application and description and click on ok.
- Provide Name of FPM Standard Component (Here We are creating and FPM_OVP_COMPONENT).
- Interface view FPM_WINDOW and plug name is DEFAULT.
- Right click On Application created and choose Create/Change configuration.
- Provide Application Configuration ID and click on New button to create.
- Provide description and click on OK.
- Click on Assign Configuration Name and enter the configuration ID and click on OK.
- Click on newly create configuration name to configure.
- Provide description and Save the configuration.
- To create Tree UIBB click in UIBB button choice and select Tree component.
- Provide Name of Configuration and click on Configure UIBB.
- Enter description and click on OK
- In the Next step It will ask for Feeder class provide name of feeder class and click on Edit Parameter
- Click on OK
- To add column use Column button under Tree UIBB Schema tab and select the column which have to added to UI and click on OK.
- Save the application.
- To Run the application right click on the application create and select test.
Featured Content for Floorplan Manager
NO LIMIT - New Ways to Navigate Data with SAP HANA
ALV and FPM on SAP HANA
See and feel the Difference
Read that article by Thea Hillenbrand
Check out the latest blogs from the FPM team. We’ve already started a whole blog series with the tag name **TEAM FPM** - so keep tuned-in.
See what the development manager of FPM has to say:
"... generation and configuration of user interfaces has never been as easy as it is today with FPM ...".
- ** TEAM FPM ** - How to use a Java Script Chart Library in Floorplan Manager Applications
- ** TEAM FPM ** - Analyzing your FPM Application (in general, customizing, enhancements, ...)
Learn about drag&drop options
Learn about melting groups within forms
FPM Developer's Guide 7.03/7.31 SP7
Updates include: CBA Enabler, and Simplification of CBA Wrapper Component, Asynchronous Callback, FPM Workbench, Search GUIBB Special Groups.
FPM Developer's Guide 7.4 SP2
Updated version of the FPM Cookbook; updates include List ATS with Integrated Data Access GUIBB, FPM Workbench, CBA Enabler, Simplification of CBA Wrapper Component,Dynamic Calling of Quickviews.
Floorplan Manager - Learning Material
Standard Classroom Training
A 4-day classroom training course on Floorplan Manager (FPM) for Web Dynpro ABAP is available (Code NET 313); follow this link for more details http://www.sap.com/education/
Other Learning Material
No opportunity to attend the classroom training? Then use the material in the table below to further your knowledge of FPM. The material is produced by members of the FPM team.
Where do you stand? | What's available to you? |
---|---|
I want an overview of FPM |
|
I want a better understanding of the topics in FPM |
|
I want to know about adapting FPM applications |
|
I want to develop applications using FPM |
|
I want to take things even further! |
|
FPM Developer's Guide (FPM Cookbook):
Cookbook Version | Release Notes (What's New) (From SAP Help Portal/SAP NetWeaver Library) |
---|---|
RN 7.4 SP2 | |
RN 7.03/7.31 SP7 | |
RN 7.03/7.31 SP4 | |
RN 7.03 | |
How to Multi Copy/Paste from Excel to GUIBB’s List ATS in FPM Application
Overview :
This document describe how to multi copy/paste from excel to GUIBB’s List ATS works as of NW 7.31 SP05 and how it can be used in FPM applications.
In the earlier version of NW 7.02 SP12, it doesn’t support the copied clipboard data into list GUIBB directly. From NW releases 7.31 SP05, you can paste the copied clipboard data at any position of the selected cell (In beginning, In between , At Last) in the list.
Prerequisites:
SAP NetWeaver 7.31 SP05.
Step By Step Guide:
Step 1: Creation of feeder class for the GUIBB’s List ATS.
Go to SE24 transaction and create a usual ABAP class.
Choose the interface tab and implement the Generic User Interface BuildingBlock for list UIBB “IF_FPM_GUIBB_LIST “(Which is given by FPM framework for the LIST) and press Enter.It will automatically implement the interface for the Generic UIBB “IF_FPM_GUIBB”.
Now if you will go to the methods tab you will see some default methods implemented by these two interfaces.
Make sure you go inside each and every method and activate all the them so it will not give any short dump.
Because each implemented method is participate in event loop.
Create a structure by taking some field from sflight table and some fields to make all the displayed column in a list as input enabled.
Choose Attributes tab and define the private attribute MT_LIST of table type of structure ZTS_SFLIGHT.
Choose methods tab and double click on IF_FPM_GUIBB_LIST~GET_DEFINITION method of feeder class and paste below code for defining the field catalogue of list.
******************************* Data Declaration ***************************************
DATA: lo_field_catalog TYPE REF TO cl_abap_tabledescr,
lt_field_description TYPE fpmgb_t_listfield_descr,
lt_sflight TYPE TABLE OF ZTS_SFLIGHT.
FIELD-SYMBOLS: <fs_field_description> TYPE fpmgb_s_listfield_descr.
**-- Define Field Catalogue
lo_field_catalog ?= cl_abap_tabledescr=>describe_by_data( lt_sflight ).
**-- Define field description for the field catalogue
**--Adding all the refrence field into the field description
APPEND INITIAL LINE TO lt_field_description ASSIGNING <fs_field_description>.
<fs_field_description>-name = 'CARRID'.
<fs_field_description>-read_only = abap_true.
<fs_field_description>-read_only_ref = 'CARRID_READONLY'.
UNASSIGN <fs_field_description>.
APPEND INITIAL LINE TO lt_field_description ASSIGNING <fs_field_description>.
<fs_field_description>-name = 'CONNID'.
<fs_field_description>-read_only = abap_true.
<fs_field_description>-read_only_ref = 'CONNID_READONLY'.
UNASSIGN <fs_field_description>.
APPEND INITIAL LINE TO lt_field_description ASSIGNING <fs_field_description>.
<fs_field_description>-name = 'FLDATE'.
<fs_field_description>-read_only = abap_true.
<fs_field_description>-read_only_ref = 'FLDATE_READONLY'.
UNASSIGN <fs_field_description>.
APPEND INITIAL LINE TO lt_field_description ASSIGNING <fs_field_description>.
<fs_field_description>-name = 'PRICE'.
<fs_field_description>-read_only = abap_true.
<fs_field_description>-read_only_ref = 'PRICE_READONLY'.
UNASSIGN <fs_field_description>.
APPEND INITIAL LINE TO lt_field_description ASSIGNING <fs_field_description>.
<fs_field_description>-name = 'CARRID_READONLY'.
<fs_field_description>-technical_field = abap_true.
UNASSIGN <fs_field_description>.
APPEND INITIAL LINE TO lt_field_description ASSIGNING <fs_field_description>.
<fs_field_description>-name = 'CONNID_READONLY'.
<fs_field_description>-technical_field = abap_true.
UNASSIGN <fs_field_description>.
APPEND INITIAL LINE TO lt_field_description ASSIGNING <fs_field_description>.
<fs_field_description>-name = 'FLDATE_READONLY'.
<fs_field_description>-technical_field = abap_true.
UNASSIGN <fs_field_description>.
APPEND INITIAL LINE TO lt_field_description ASSIGNING <fs_field_description>.
<fs_field_description>-name = 'PRICE_READONLY'.
<fs_field_description>-technical_field = abap_true.
UNASSIGN <fs_field_description>.
**--Fill exporting parameter
eo_field_catalog = lo_field_catalog.
et_field_description = lt_field_description.
Put the below code into the GET_DATA method of list feeder.
***************************** Data Declaration **************************
DATA: lt_list TYPE ztt_sflight,
lt_param_list TYPE wdr_event_parameter_list,
lt_table TYPE wdui_table_paste_data,
lv_cur_col TYPE i,
lv_tol_row TYPE i,
lv_row TYPE i VALUE 1,
lv_col_name TYPE string,
lr_rtti TYPE REF TO cl_abap_typedescr,
lv_paste_index TYPE sytabix,
lv_paste_rows TYPE i,
lv_add_row TYPE i.
FIELD-SYMBOLS: <fs_list> LIKE LINE OF mt_list,
<fs_param_list> LIKE LINE OF lt_param_list,
<ft_table> TYPE wdui_table_paste_data,
<fs_table> TYPE wdui_table_line_paste_data,
<table_col> TYPE any,
<fs_field_usage> TYPE fpmgb_s_fieldusage.
**--Which event raise
CASE iv_eventid->mv_event_id.
WHEN cl_fpm_event=>gc_event_start.
DO iv_visible_rows TIMES.
APPEND INITIAL LINE TO lt_list.
ENDDO.
WHEN if_fpm_guibb_list=>gc_event_multi_value_paste.
**--Get event parameter
iv_eventid->mo_event_data->get_value( EXPORTING iv_key = 'WDEVENT_PARAMS'
IMPORTING ev_value = lt_param_list ).
READ TABLE lt_param_list ASSIGNING <fs_param_list> WITH KEY name = 'TABLE'.
IF sy-subrc EQ 0.
**--Adding extra row to the table (If user have copied rows more than the visible rows)
ASSIGN <fs_param_list>-value->* TO <ft_table>.
lt_list = mt_list.
lv_paste_index = lines( <ft_table> ).
READ TABLE <ft_table> ASSIGNING <fs_table> INDEX lv_paste_index.
IF sy-subrc EQ 0.
lv_paste_rows = <fs_table>-row.
ENDIF.
IF lv_paste_rows GT lines( lt_list ) AND cv_lead_index LE 1.
lv_add_row = lv_paste_rows - lines( lt_list ).
DO lv_add_row TIMES.
APPEND INITIAL LINE TO lt_list.
ENDDO.
ELSEIF cv_lead_index GT 1.
READ TABLE lt_list ASSIGNING <fs_list> INDEX cv_lead_index.
IF sy-subrc EQ 0 AND <fs_list> IS ASSIGNED AND NOT <fs_list> IS INITIAL.
cv_lead_index = cv_lead_index + 1.
DO lv_paste_rows TIMES.
APPEND INITIAL LINE TO lt_list.
ENDDO.
ELSE.
lv_tol_row = cv_lead_index + lv_paste_rows - 1.
lv_add_row = lv_tol_row - lines( lt_list ).
IF lv_tol_row GT lines( lt_list ).
DO lv_add_row TIMES.
APPEND INITIAL LINE TO lt_list.
ENDDO.
ENDIF.
ENDIF.
ENDIF.
LOOP AT lt_list ASSIGNING <fs_list> FROM cv_lead_index.
lv_cur_col = 1.
LOOP AT <ft_table> ASSIGNING <fs_table> WHERE row = lv_row.
READ TABLE ct_field_usage ASSIGNING <fs_field_usage> INDEX lv_cur_col.
ASSERT sy-subrc = 0.
lv_col_name = <fs_field_usage>-name.
ASSIGN COMPONENT lv_col_name OF STRUCTURE <fs_list> TO <table_col>.
lr_rtti = cl_abap_typedescr=>describe_by_data( <table_col> ).
CASE lr_rtti->type_kind.
WHEN cl_abap_typedescr=>TYPEKIND_PACKED.
REPLACE ALL OCCURRENCES OF '.' IN <fs_table>-data WITH ''.
REPLACE ALL OCCURRENCES OF ',' IN <fs_table>-data WITH '.'.
<table_col> = <fs_table>-data.
WHEN cl_abap_typedescr=>typekind_date.
CALL FUNCTION 'CONVERT_DATE_TO_INTERNAL' " Convert date to internal
EXPORTING
date_external = <fs_table>-data
IMPORTING
date_internal = <fs_table>-data
EXCEPTIONS
date_external_is_invalid = 1
OTHERS = 2.
<table_col> = <fs_table>-data.
WHEN OTHERS.
<table_col> = <fs_table>-data.
ENDCASE.
ADD 1 TO lv_cur_col.
ENDLOOP.
ADD 1 TO lv_row.
ENDLOOP.
ENDIF.
ENDCASE.
**--Filling exporting parameter
ct_data = lt_list.
mt_list = lt_list.
ev_data_changed = abap_true.
Step 2. Create FPM Application.
Go to transaction SE80 and create Webdynpro Application as follows.
Change the component and View in the properties of WD Application. In this application we use are using OVP,
so that we use component name “FPM_OVP_COMPONENT” and interface view “FPM_WINDOW”. Then save the application.
Right click on application and choose create/change configuration to configure the application through FPM configuration editor.
It will open the browser window, Enter the application configuration name for your application and press enter,
It will give you a error because application configuration for the application doesn’t exist.
So click on Create New. A new pop up will open, enter the description and click on ok ,
application configuration is created.
Now you have to create component configuration for your application, click on Assign Configuration Name button for the above selected application configuration and enter the configuration id in popup and click on ok.
It will display a error message same like previously we got for application configuration. So click on Create New.
A new pop up will open, enter the description and click on ok.
Now you will be redirect to the Main Screen of the OVP application. In this page you have to define your Main page in the Navigation panel.After that choose the list component from the UIBB choose button with in the Overview Page Schema.
After that, enter the component configuration id for the list and configure the UIBB by clicking on the Configure UIBB button in the right side of the Overview Page Schema tab. Savethe component configuration.
Again one another popup will ask you to give the feeder class name for configuring the GUIBB’s List.Enter the feeder class name and click on edit parameter list and now you can configure your list with the defined field catalogue structure in feeder class.
Now configure the list column by clicking on column button in the List UIBB Schema.
A pop will open with all the available field, select all and click on ok.
Set the display type property of elements as input field in List GUIBB Schema tab and also set the initial rows count 10 in the General Settings Group of list GUIBB.
Step 3: Run Application
Go to transaction SE80 and enter your package name and choose your application configuration with in webdynpro.Click on execute button.
A browser window will open with result screen like as below snapshot. Initially List will be empty with 10 Visible Rows which we had configured in list component configuration.
Place the cursor in the first row and first column of the list and then copy the records from the excel sheet, it will copy the data into clipboard and then press Ctrl + V. All the copied data will be pasted in appropriate cell.
You can paste the clipboard data into the selected row for example (2nd Row, Last row, In between Rows).
In below snap shot you can see 1st row is remain blank and data is pasted on 2nd row.
If copied data is greater than the visible row then it will add that many rows which you copied from excel sheet.
For achiving this functionality coding has been done in GET_DATA method. You can change this logic as per your business requirement.
Multiple list uibb using parameter value
Introduction
This document explains how to use parameter value to show multiple list uibb .
Step by step process
Step 1 : Go to se11 and create data element ZLIST_VALUE using domain .
Maintain Domain value for the data element .
Step 2 : Go to transaction se24 , Create a class and add the interface IF_FPM_GUIBB_LIST , Go to method tab and activate each and every method one by one.
Step 3 : Go to Public section and create Internal tables for each list uibb.
class ZMULTIPLE_LIST_UIBB definition
public
final
create public .
public section.
*"* public components of class ZMULTIPLE_LIST_UIBB
*"* do not include other source files here!!!
interfaces IF_FPM_GUIBB .
interfaces IF_FPM_GUIBB_LIST .
TYPES:
BEGIN OF ty_kna1,
kunnr TYPE kna1-kunnr,
land1 TYPE kna1-land1,
name1 TYPE kna1-name1,
ort01 TYPE kna1-ort01,
pstlz TYPE kna1-pstlz,
regio TYPE kna1-regio,
END OF ty_kna1 ,
BEGIN OF ty_likp,
vbeln TYPE likp-vbeln,
ernam TYPE likp-ernam,
erzet TYPE likp-erzet,
erdat TYPE likp-erdat,
END OF ty_likp,
BEGIN OF ty_lips,
vbeln TYPE lips-vbeln,
posnr TYPE lips-posnr,
pstyv TYPE lips-pstyv,
ernam TYPE lips-ernam,
erzet TYPE lips-erzet,
END OF ty_lips.
DATA:
t_kna1 TYPE STANDARD TABLE OF ty_kna1 ,
t_likp TYPE STANDARD TABLE OF ty_likp ,
t_lips TYPE STANDARD TABLE OF ty_lips .
Step 4 : Go to attribute tab and create attribute PARAMETER of type ZLIST_VALUE.
Step 5 : Go to GET_PARAMETER_LIST method and write the below code .
Step 6 : Go to INITIALIZE method and write the code to get parameter value .
Step 7 : Go to GET_DEFINITION and write the code to assign structure for list uibb .
Step 8 : Go to GET_DATA method and write the code to show data on each list uibb .
method IF_FPM_GUIBB_LIST~GET_DATA.
SELECT KUNNR
LAND1
NAME1
ORT01
PSTLZ
REGIO FROM KNA1 INTO TABLE T_KNA1 UP TO 20 ROWS .
SELECT VBELN
ERNAM
ERZET
ERDAT FROM LIKP INTO TABLE T_LIKP UP TO 20 ROWS.
SELECT VBELN
POSNR
PSTYV
ERNAM
ERZET FROM LIPS INTO TABLE T_LIPS UP TO 20 ROWS .
CASE PARAMETER.
WHEN 'LIST1'.
CT_DATA = T_KNA1 .
WHEN 'LIST2'.
CT_DATA = T_LIKP .
WHEN 'LIST3'.
CT_DATA = T_LIPS .
ENDCASE.
EV_DATA_CHANGED = ABAP_TRUE.
endmethod.
Step 9 : Go to se80 and create the application configuration for the component FPM_OIF_COMPONENT and add the list uibb as shown below .
Step 10 : Create configuration for each List Uibb .
Give the feeder class name .
Give parameter value for the list .
configure columns to show list
Repeat Step 10 for each list uibb.
Step 11 : Test the application configuration .
FPM Navigation between Views
What I am trying to explain:
1.Navigation between views in OIF Application .
2.How to change UIBB at run time (hide)
3.How to change FPM toolbar at run time (This is different case,will explain later in this document)
What I have done:
I have developed very simple FPM application with 2 main views,4 sub views, with 2 webdynpro components and and custom button 'Next'.I used same webbdynpro component interface view for 3 UIBB with different configuration . The first screen we have to enter name,education,job.If person is illiterate and working and click on Next it should skip eduction details sub view and directly go to job details screen.If he is illiterate and not working it go to last conformation screen and Next button should not be there in that screen.So when we click on Next button navigation depends on person entered details.
Navigation:
What we should do.?
Create event object with ID CL_FPM_EVENT=>GC_EVENT_VIEW_SWITCH and parameters
IV_KEY = CL_FPM_EVENT=>GC_EVENT_PARAM_VIEW_ID ,
IV_VALUE = <main view ID to navigate>;
IV_KEY = CL_FPM_EVENT=> GC_EVENT_PARAM_SUBVIEW_ID,
V_VALUE = <sub view ID to navigate >,then raise the event
Where we have to create event object and raise?
Generally we can create event object any where in FPM application,But for this event to work we should create in class or webdynpro component which implemented application specific configuration controller for OIF interface IF_FPM_OIF_CONF_EXIT. It has only one method IF_FPM_OIF_CONF_EXIT~OVERRIDE_EVENT_OIF so we should write our code in that.
So I Created new class and implemented Interface .
If we create event with main view parameter and not assigned sub view parameter then we can navigate to particular sub view by calling SET_SELECTED_SUBVIEW method like below
What else?
Let be known the Implemented class or webdynpro to fpm application.
How?
Go to component connfiguration of your fpm application click on Change ,Global setting and assign your class or webdynpro component to Webdynpro component field as below
My application.
If user click on Next button I read the user entered values in Process_event method of component controller and raise FPM event depend on entered values
Suppose user is illiterate and notworking then we raising event 'CON'.
Then depend on event we filling navigation details in IF_FPM_OIF_CONF_EXIT implemented class.
In the above case so we setting parameters main view as MAIN and subview as CONV. So it goes to subview of CONV in Main view of MAIN2 that is Conformation or last screen .So if user entered illiterate , notworking and click on the Next button fpm navigate to conformation screen
If you observe Conformation screen Next button is missing.
Toolbar modification.
We can use methods of IF_FPM_CNR_OIF to change the toolbar at runtime.Gena rally we write the code in WDDOMODIFYVIEW of interface view. I used same webdynpro interface view for three subviews education,job and conformation. So if I hide Next button WDDOMODIFYVIEW then it applies to all three subviews. I need more information to hide only on last screen only.I can get that information as below and hide on last screen as below.
Hide subview
We can change the configuration at run time in IF_FPM_OIF_CONF_EXIT~OVERRIDE_EVENT_OIF.
In my application if user entered literate and notworking I can hide the job subview as below.
We can do similarly in GAF also with event id CL_FPM_EVENT=>GC_EVENT_CHANGE_STEP and parameters
iv_key CL_FPM_EVENT=>GC_EVENT_PARAM_MAINSTEP_ID and CL_FPM_EVENT=>GC_EVENT_PARAM_SUBSTEP_ID
You can watch http://youtu.be/atyBwN-dMZA
FPM beginner tutorial. List GUIBB
Please watch video tutorial for rapid creating of FPM list GUIBB application.
File contains video though is too big for scn storing.
https://docs.google.com/file/d/0B895ysUwp1p7LXVYeVJoa1RBTGs/edit?usp=sharing
Featured Content for Floorplan Manager
NO LIMIT - New Ways to Navigate Data with SAP HANA
ALV and FPM on SAP HANA
See and feel the Difference
Read that article by Thea Hillenbrand
Check out the latest blogs from the FPM team. We’ve already started a whole blog series with the tag name **TEAM FPM** - so keep tuned-in.
See what the development manager of FPM has to say:
"... generation and configuration of user interfaces has never been as easy as it is today with FPM ...".
- ** TEAM FPM ** - How to use a Java Script Chart Library in Floorplan Manager Applications
- ** TEAM FPM ** - Analyzing your FPM Application (in general, customizing, enhancements, ...)
Learn about drag&drop options
Learn about melting groups within forms
Floorplan Manager - Learning Material
Standard Classroom Training
A 4-day classroom training course on Floorplan Manager (FPM) for Web Dynpro ABAP is available (Code NET 313); follow this link for more details http://www.sap.com/education/
Other Learning Material
No opportunity to attend the classroom training? Then use the material in the table below to further your knowledge of FPM. The material is produced by members of the FPM team.
Where do you stand? | What's available to you? |
---|---|
I want an overview of FPM |
|
I want a better understanding of the topics in FPM |
|
I want to know about adapting FPM applications |
|
I want to develop applications using FPM |
|
I want to take things even further! |
|
FPM Developer's Guide (FPM Cookbook):
Cookbook Version | Release Notes (What's New) (From SAP Help Portal/SAP NetWeaver Library) |
---|---|
(now available in the SAP NetWeaver library) | |
RN 7.4 SP2 | |
RN 7.03/7.31 SP7 | |
RN 7.03/7.31 SP4 | |
RN 7.03 | |
Search Component with OVS (IF_FPM_SEARCH)
Search GUIBB with OVS:-
If you need ovs on search GUIBB this can be possible by implementing interface IF_FPM_GUIBB_OVS .
Step to create search GUIBB with OVS.
- create search GUIBB .
use below link for how to create simple search GUIBB
.
- interface tab enter IF_FPM_GUIBB_OVS interface it will implement method
- in order to assign fields OVS . go in method IF_FPM_GUIBB_SEARCH~GET_DEFINITION assign class name in attribute ovs_name .
Code :-
ls_descr_attr-name = 'CARRID'.
ls_descr_attr-text = 'the carrier id'.
ls_descr_attr-ovs_name = 'ZSEARCH_WITH_OVS'.
APPEND ls_descr_attr TO et_field_description_attr.
- Implement PHASE_0.
Code: -
DATA: l_text TYPE wdr_name_value,
l_label_texts TYPE wdr_name_value_list,
l_column_texts TYPE wdr_name_value_list,
l_window_title TYPE string,
l_group_header TYPE string,
l_table_header TYPE string.
l_text-name = 'CARRID'.
l_text-value = 'carrier id'.
APPEND l_text TO l_label_texts.
append l_text TO l_column_texts.
l_text-name = 'CONNID'.
l_text-value = 'connid id'.
APPEND l_text TO l_label_texts.
append l_text TO l_column_texts.
l_window_title = 'ovs in search GUIBB'.
l_group_header = 'ovs in search GUIBB'.
l_table_header = 'ovs in search GUIBB'.
io_ovs_callback->set_configuration(
label_texts = l_label_texts
column_texts = l_column_texts
group_header = l_group_header
window_title = l_window_title
table_header = l_table_header
col_count = 1
row_count = 5 ).
- Implement PHASE_1.
Code :-
BEGINOF t_stru_input,* add fields for the display of your search input here
carrid TYPE s_carr_id,
connid type s_conn_id,
ENDOF t_stru_input .data: l_search_input TYPE t_stru_input.
io_ovs_callback->context_element->get_static_attributes(
IMPORTING static_attributes = l_search_input ).* pass the values to the OVS component
io_ovs_callback->set_input_structure(
input = l_search_input ).
- Implement PHASE_2.
Code :-
beginof t_stru_list,* add fields for the selection list here
carrid type s_carr_id,
connid type s_conn_id,
endof t_stru_list .
FIELD-SYMBOLS: <query_params> TYPE t_stru_input.
DATA: l_select_list TYPESTANDARDTABLEOF t_stru_list,
ls_list TYPE t_stru_list,
ls_select_list TYPE t_stru_list.
ASSIGN io_ovs_callback->query_parameters->*
TO<query_params>.
IF <query_params> ISASSIGNED.
SELECT carrid connid FROM sflight INTO CORRESPONDING FIELDSOFTABLE l_select_list WHERE carrid = <query_params>-carrid.
ENDIF.
io_ovs_callback->set_output_table( output = l_select_list ).
- Implement PHASE_3.
Code :-
FIELD-SYMBOLS: <selection> TYPE t_stru_list.
ASSIGN io_ovs_callback->selection->* TO<selection>.
IF<selection> ISASSIGNED.
io_ovs_callback->context_element->set_attribute(
name = IV_WD_CONTEXT_ATTR_NAME
value = <selection>-carrid ).
ENDIF.
Result will be :-
ACCESSING THE PERSONALIZATION IN FPM_LIST_UIBB_ATS: An Enhancement
Hello friends and fellow members, It is been quite a while I'm working in SAP Webdynpro and floor plan manager or FPM as we call it. Needless to say we all face challenges and solve problems every day. This time I thought to share one of problem and it's solutions with my colleagues and members here at SCN.
So let me start explaining the problem first. We were working to develop a web based reporting tool for a client and part of requirement was to be able to save selection screen variant and list view (FPM_LIST_UIBB_ATS) as part of same variant in our ztable so that based on user preference we can get the variant and list view back once required. Let me explain this using few screen shots to make it easy. We have implemented FPM_OVP_COMPONENT to put in all our free style selection UIBBs and FPM_LIST_UIBB_ATS
So here is the screen shot for a typical report screen with bunch of selection screen trays and an output list which is an FPM_LIST_UIBB_ATS component.
Now hit the personalization button on top right side of list and "save as" a new view after removing few fields from the standard view.
Now select something from the selection screen.
Then hit the save button on top left of the main screen that should save the selection screen values and list view both in out ztable so that it can be retrieve later based on requirement. please see below screen shots for details
To achieve this we have no problem getting the selection screen values but for list view we need some kind of reference to personalization API like we get in classic Webdynpro ALV (why we are not using classic Webdynpro ALV? I'll save that answer for my next blog). I tried to find the personalization api reference with no success. So I debugged and found a solution which is not simple but we achieved what we wanted to.'
First thing I did was implemented the IF_F PM_APP_CONTROLLER in one of the UIBBs (Webdynpro component) . This interface makes that's component as main component or UIBB and you can catch all the events with in BEFORE_PROCESS_EVENT method of the interface.
Next thing I did was to put the break point in the method BEFORE_PROCESS_EVENT to see what I get there. if you see the "locals" tab in the debugger you will find an internal table name IT_UIBBS just like one below.
double click the "IT_UIBBS" and we will get the what's inside of table. If we look inside the table we will find that one of the row belongs to our LIST_UIBB_ATS component. Just double click and see what we have.
We get a reference to a local class CLF_COMPONENTCONTROLLER_CTR which obviously is not accessible to us in our program but if we click it to see what is inside we find something interesting there.
So we get a reference to the assistance class for LIST_UIBB_ATS. "Yummy"... If we click it we will find more meat in there. just look at it now.
an attribute in red means private name mo_personalization is what we need and it's a reference to a class name "CL_FPM_LIST_SETTING_CONTROL".
That's all we need and we will achieve what we want. but work is not over yet. we still need to access that reference to CL_FPM_LIST_SETTING_CONTROL that mo_personalization.
1) Up till now whatever we have debugged we found two hurdles. There is a local class that we cannot reach CLF_COMPONENTCONTROLLER_CTR
2) Even after we get to local class and fetch the public attribute which refer us to assistance class of LIST_UIBB_ATS, personalization api that is reference to CL_FPM_LIST_SETTING_CONTROL is still a private attribute.
So Here is what we are going to do.
1) Try to get access to the local class using the technique describe in this blog :
As mentioned earlier we need to implement IF_FPM_APP_CONTROLLER in our main webdynpro component so that we get the method BEFORE_PROCESS_EVENT where we will implement our code to get the personalization object.
Here is our piece of code to access the using the type casting process describe here.
DATA:
lk_uibb type FPM_S_UIBB_COMPONENT,
lr_list_assist type ref to CL_FPM_LIST_UIBB_ASSIST_ATS,
lr_personalization type ref to IF_FPM_LIST_SETTINGS_CONTROL,
lr_current_variant type ref to IF_FPM_LIST_SETTINGS_VARIANT,
lv_variant_key type string,
lr_super_assist type ref to CL_FPM_GUIBB_ASSIST,
lr_render type ref to CL_FPM_LIST_UIBB_RENDERER_ATS,
lo_obj type ref to object,
ld_attr type string.
FIELD-SYMBOLS:
<lfs_lcl> type any.
*Read the LIST UIBB Instance
if io_event->mv_event_id = 'FPM_SAVE' .
read table it_uibbs into lk_uibb with key instance_key-COMPONENT =
zci_cfr_constants=>c_ats_comp .
if sy-subrc = 0.
*There is no way we can use local class' public attribute. The technique we are
*Using here will help us get access to the local class and eventually to its attrbute
lo_obj ?= lk_uibb-INTERFACE_CONTROLLER.
ld_attr = 'F_ASSIST'.
ASSIGN lo_obj->(ld_attr) TO <lfs_lcl>.
lr_list_assist = <lfs_lcl>.
*Once we get the reference to the Assistance class for ATS we can get the personalization
lr_personalization = lr_list_assist->GET_PERSONALIZATION( ).
lv_variant_key = lr_personalization->GET_CURRENT_VARIANT( )->GET_VARIANT_KEY( ).
er_variant = lv_variant_key.
endif.
endif.
that's it we can now set variant in similar way and do lot of things available in the class CL_FPM_LIST_SETTINGS_CONTROL
But wait a minute we still need to cross the next hurdle and enhanced the class CL_FPM_LIST_UIBB_ASSIST_ATS to make the above code work.
2) Just enhance the class and write the new method.
METHOD GET_PERSONALIZATION .
ro_personalization = mo_personalization_api.
ENDMETHOD.
Summary:
FPM_LIST_UIBB_ATS does not give you access to personalization in the FEEDER class and I came up with this solution to access the personalization and achieve the required functionality.
Please share your comments or any questions.
Laeeq A Siddique.
Creating Context-Based Adaptations: Step-By-Step Guide
CBA is an adaptation concept that allows you to have adaptations based on the runtime environment. With CBA you have the option to create multiple adaptations of a single application and, at runtime, the adaptation chosen is based on the current launch or runtime conditions. CBA is most suitable for large, global, role-based projects. This guide, complete with screenshots based on an existing system demo, shows you how to create CBAs step by step.
Step by Step guide to create a simple FPM Tree UIBB application
Introduction:
This is a generic design template for displaying data in a hierarchical list or tree that is implemented using the Web Dynpro component FPM_TREE_UIBB. we use this design template in application specific views (UIBB) where we want to display data in a hierarchical list or tree.
Structure
A hierarchical list is structured as follows:
Master Column: The master column displays all the items in a list. When the system first displays a table, each top-level, parent item in the master column is preceded by an Expand or Collapse icon, which allows you to see the child (sub) items contained within it. A top-level item in the master column without child items has no Expand or Collapse icon preceding it.
Non-master columns: These columns display the details of each list item.
Rows: Each item in a list is displayed in a separate row.
Toolbar: A toolbar displays the Collapse All and Expand All buttons (if selected) and other buttons that you have created.
Step 1: Create a database table as below or use existing data base table.
Sample Data in Database:
Step 2: Creating Feeder class:
Create a class with interface IF_FPM_GUIBB_TREE.
Create structure and table type in types tab
PRIVATE SECTION.
DATA ls_wa TYPE fpmgb_s_tree_master_column.
TYPES: BEGIN OF t_st.
INCLUDE STRUCTURE ls_wa.
TYPES: emp_id(10) TYPE c ,
name(20) TYPE c,
contact_no(10) TYPE n,
mang_id(10) TYPE c,
is_leaf1(1) TYPE c,
END OF t_st.
TYPES: tt_st TYPE TABLE OF t_st.
Implementation of get_defination method
METHOD if_fpm_guibb_tree~get_definition.
DATA: lt_itab TYPE tt_st,
ls_field_descr TYPE fpmgb_s_treefield_descr.
*** add structure
eo_field_catalog ?= cl_abap_tabledescr=>describe_by_data( p_data = lt_itab ).
****set property of fields
CLEAR ls_field_descr.
ls_field_descr-name = 'PARENT_KEY'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-parent_key.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'ROW_KEY'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-row_key.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'TEXT'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-text.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'EXPANDED'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-expanded.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'IS_LEAF'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-is_leaf.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'CHILDREN_LOADED'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-child_load.
APPEND ls_field_descr TO et_field_description.
CLEAR ls_field_descr.
ls_field_descr-name = 'IMAGE_SRC'.
ls_field_descr-column_type = if_fpm_guibb_constants=>gc_guibb_tree_columns-img_src.
APPEND ls_field_descr TO et_field_description.
ENDMETHOD.
Implementing of get_data method
METHOD if_fpm_guibb_tree~get_data.
DATA : lt_data TYPE tt_st,
ls_data TYPE t_st,
lt_db TYPE TABLE OF zrt_test ,
ls_db TYPE zrt_test.
IF io_event->mv_event_id = 'FPM_START'.
**** fecthing data from DB
SELECT * FROM zrt_test INTO TABLE lt_db.
**** addigning to internal table
LOOP AT lt_db INTO ls_db.
ls_data-parent_key = ls_db-mang_id.
ls_data-is_leaf = ls_db-is_leaf1.
ls_data-text = ls_db-name.
ls_data-name = ls_db-name.
ls_data-row_key = ls_db-emp_id.
ls_data-mang_id = ls_db-mang_id.
ls_data-emp_id = ls_db-emp_id.
ls_data-contact_no = ls_db-contact_no.
APPEND ls_data TO lt_data.
ENDLOOP.
**** assign value to ct_data
ct_data = lt_data.
ENDIF.
ENDMETHOD.
Steps 3: Involve in creating a FPM Application
- Goto Tcode SE80 and select your Package to create FPM Application.
- Right click on WebDynpro Application and Create Web Dynpro Application.
- Provide Name of Application and description and click on ok.
- Provide Name of FPM Standard Component (Here We are creating and FPM_OVP_COMPONENT).
- Interface view FPM_WINDOW and plug name is DEFAULT.
- Right click On Application created and choose Create/Change configuration.
- Provide Application Configuration ID and click on New button to create.
- Provide description and click on OK.
- Click on Assign Configuration Name and enter the configuration ID and click on OK.
- Click on newly create configuration name to configure.
- Provide description and Save the configuration.
- To create Tree UIBB click in UIBB button choice and select Tree component.
- Provide Name of Configuration and click on Configure UIBB.
- Enter description and click on OK
- In the Next step It will ask for Feeder class provide name of feeder class and click on Edit Parameter
- Click on OK
- To add column use Column button under Tree UIBB Schema tab and select the column which have to added to UI and click on OK.
- Save the application.
- To Run the application right click on the application create and select test.