Documenti di Didattica
Documenti di Professioni
Documenti di Cultura
Attachments:43 Added by Sravanthi, last edited by John peter on Feb 10, 2009 (view change) This scenario demonstrates the usage of two BAPI's (i.e. BAPI_FLIGHT_GETLIST & BAPI_FLIGHT_GETDETAIL) and displays the data into the flight detail View using UI element tab strip. STEP 1: Creating a service call
Create a Web Dynpro Component called Z_BAPI_GET_DETAIL. Create a service call to access the BAPI. Select the Function module option & specify the function module name. Give the function module name: BAPI_FLIGHT_GETLIST.
Select the required parameter & continue .Here select Destination_From & Destination_To,Flight_List.
STEP 2: Dragging and dropping the nodes from Component controller to Main View.
Now on the context tab of the Main view drag and drop the nodes from the component controller. Drag and drop the destination_from and destination_to.
Create two group UI elements One for the Destination_From and another for Destination_To and create a button for the main view.
STEP 3: Dragging and dropping the nodes from Component controller to 'Flight_detail' view
Create another view name it as Flight_detail view. Drag and drop Flight_data, Additional_Info & Availability from the component controller to the Flight_detail View as shown below.
Now Design the Layout as shown below:* In the layout ROOTUIELEMENT CONTAINER, Create the tab strip as shown below.
In the tab strip right click insert tab and name it as Flight_data. Create the tab strips for the Additional_Info and Availability
After that the tabs trip element layout looks like this
Add the element to tab to the tab strip of the flight_data. Create the transparent container as shown below.
Bind this transparent container UI element with the context node FLIGHT_DATA.
Observe the layout after the binding between 'flight_data' node and the transparent container
Repeat the steps for the other two tab strip i.e. for Additional_info and Availability. Create the button to navigate to the main view.
Now the layout looks like this with the tab strip and button.
To navigate between the views i.e. from Main view to the Flight_detail View ' IB1_Flight_Detail' Inbound Plug from Flight_Detail View to Main.
'IB_Main' Inbound plug from the Main view to the Flight_Detail View.
In Button property click on 'OnAction' Create the action as 'on_back'. Create the Outbound plug 'ob1_flight_detail'.
On Actions of the Main View 'on_getflightdetails', generate the code using the code wizard. Select the Method calls in used controller. Use the Method name 'Execute_bapi_flight_getlist'.
STEP 5: Including attributes in the component controller In the component controller of the attributes, I_Carrid: s_carr_id. I_Connid:s_conn_id. I_Date:s_date.
STEP 6: Coding the methods 'execute_bapi_flight_getdetail' and 'execute_bapi_flight_getlist' of the component controller.
STEP 7: Dragging and dropping the 'flight_detail' view and creating navigation links.
Create the navigation link for the 'main view' as shown below.
Create the application for the webdynpro component controller and save it.
After clicking the button 'Get Flight Details' the details are displayed as per, 1. 2. 3. Flight_data. Additional_info. Availability.