Entering content frame

Procedure documentation Defining the View of the Start Application Locate the document in its SAP Library structure

Two input fields and one pushbutton are shown in the view of the Web Dynpro component PageNavigationStartComp (see screenshot).

This graphic is explained in the accompanying text

Users can enter their first and last names in the two input fields. By pressing the pushbutton labeled „Click here...“, users navigate to the target application TargetNavigationApp. The entries for the first and last name are passed as parameters to the target application. The required developmental steps are described below:

·        Build the view StartView

·        Build the context of the view.

·        Bind the data of the user interface element properties to the context structure defined at design time.

Prerequisites

To edit the view, you must have created the described parts in the Project Structure. This includes creating

·        Web Dynpro project PageNavigationProject

·        Web Dynpro component PageNavigationStartComp

·        view StartView.

You then navigate to directory Views in the project structure in the Web Dynpro Explorer and perform the steps described below.

For a detailed description of the procedure for creating Web Dynpro projects, Web Dynpro components, the context structure, and the layout of the view, see Creating Your First Web Dynpro Application.

Procedure

Creating a Layout

You navigate to directory Views in the project structure in the Web Dynpro Explorer. With the secondary mouse button, you select the view StartView you created for editing.

For a detailed description of how to create the layout of a view, see Structure linkCreating and Designing a View.

       1.      Delete the UI element DefaultTextView that was automatically generated with the view.

       2.      Add group UI element Group1.

       3.      Add label UI element Label1 for labeling the input field InputField1.

       4.      Add input field InputField1.

       5.      Add label UI element Label2 for labeling the input field InputField2.

       6.      Add input field InputField2.

       7.      Add pushbutton Button1.

 

Bildschirmkopie zum Aufbau der View:

This graphic is explained in the accompanying text

...

 

Creating the Context Structure

You must define the corresponding context attributes in order to store input field entries in the context of the view. If you bind the property value of the input fields to these context attributes, the data is retained as long as the view is needed. This is the only way in which the entries can be passed to the target application as URL parameters.

For a detailed description of how to create a context structure at design time, see the tutorial for Context Programming and Data Binding and Declaring the Controller Context of a View.

 

       1.      Create context attribute FirstName of type String as the root node attribute

       2.      Create context attribute LastName of type String as the root node attribute

This graphic is explained in the accompanying text

 

Defining Action NavigationToNextPage

 

This graphic is explained in the accompanying text

Defining Data Binding of the User Interface Element Properties

Property value of UI element InputField1 is bound to context attribute FirstName.

This graphic is explained in the accompanying text

Property value of UI element InputField2 is bound to context attribute LastName.

This graphic is explained in the accompanying text

The OnAction event of pushbutton Button1 is bound to action NavigationToNextPage.

This graphic is explained in the accompanying text

 

Implementing a Controller

The following source text contains the implementation part of action NavigationToNextPage.

The navigateAbsolute method of Web Dynpro class WDPortalNavigationsupports navigation between two Web Dynpro applications in the portal. The first parameter java.lang.String navigationTarget of method navigateAbsolute describes the portal content path of the page where you added the Web Dynpro iView and that refers to target application TargetNavigationApp.

You get the path from the ID of the page. The ID is displayed in the quick info window of the portal (see screenshot). To get the ID, you must normally create the iView and page after creating the start and target applications in the portal. Otherwise you cannot define these parameters.

This graphic is explained in the accompanying text

 

This graphic is explained in the accompanying text

You must replace the prefix pcd in the ID of the page with „ROLES://“. If for example the ID of the page in the quick info is pcd:portal_content/com.sap.PageNavigationProject/com.sap.TargetPage, the definition for the parameter is ROLES://portal_content/com.sap.PageNavigationProject/com.sap.TargetPage.

 

Before you implement the action, you should look at the descriptions for

·        Structure linkUse of  Portal Navigation

·        Running a Web Dynpro Application in the Portal.

.

 

 

public void onActionNavigationToNextPage(com.sap.tc.webdynpro.progmodel.api.IWDCustomEvent wdEvent )

  {

    //@@begin onActionNavigationToNextPage(ServerEvent)

   WDPortalNavigation.navigateAbsolute(

         "ROLES://portal_content/com.sap.PageNavigationProject/com.sap.TargetPage",

            WDPortalNavigationMode.SHOW_INPLACE,

            (String) null,

            (String) null,

            WDPortalNavigationHistoryMode.NO_DUPLICATIONS,

            (String) null,

            (String) null,

            "firstName=" + wdContext.currentContextElement().getFirstName() + "&lastName=" + wdContext.currentContextElement().getLastName());

 

    //@@end

  }

 

This graphic is explained in the accompanying text

If you define the parameter names with app.<parametername>, they are automatically passed to the startup plugs of the Web Dynpro application used as navigation target if these parameters are defined in this application as startup parameters.

Result

You created a view with which a user can navigate to another Web Dynpro application by pressing a pushbutton.

This graphic is explained in the accompanying text Next step:

Defining the View of the Target Application

 

 

Leaving content frame