Show TOC

Procedure documentationCreating UIs Using Drag and Drop of Model Class Locate this document in the navigation structure

 

You use this procedure to create user interfaces using the drag and drop. The drag source is the Web Dynpro explorer and drop target is the view designer browser area. You can drag and drop the request and response model classes on view designer to create the required user interfaces.

Prerequisites

Procedure

Create Input UI (Model class with default property values)
  1. In the Web Dynpro Explorer, expand the Web Dynpro Development Component, Models and select the Request model class, which should be executable for successful UI creation.

  2. Drag the Request model class from the Web Dynpro Explorer and drop it on the view designer.

  3. In the Model Class Execution: Input Details wizard, select the input type to provide input parameters and choose Next.

  4. Follow the instructions in the Model Class Execution: Input Details wizard to execute the request model class.

    The system executes the request model class and creates an input UI element on the view designer with necessary bindings between existing context and the controllers.

Create an Input UI Element (Model class without default property values)
  1. Drag the Request model class from Web Dynpro explorer and drop it on the view designer.

  2. In the Model Class Execution wizard, select the source type such as U-Form, Table or Context and follow the instructions in the wizard, and choose Finish.

    Selection must be based on the model class property on which the model execution has to be triggered.

    In case the model class requires no input, then you have the following options:

    • If you select Button, system executes the request model class, which is triggered through a button, on the view designer.

    • If you select View Initialization, system executes the request model class, which is triggered when a view is initialized.

Create an Output UI Element
  1. Drag the Response model class from Web Dynpro Explorer and drop it on the view designer.

  2. In the wizard, select the output type to provide the output parameters and choose Next.

  3. Follow the instructions in the Model Class Execution: Output Details wizard to execute the request model class.

    The system executes the response model class and creates an output UI element on the view designer with necessary bindings between existing context and the controllers.

Result

System generates the UI and the necessary binding between models, components, and the view corresponding to the model class attributes and the input source type that you have selected in the wizard.