Skip to Content

We have seen designing the view constituent of the MVC application design that generates XSD in the blog Unleashing ABAP Webdynpro for generating XSD in SAP XI-Episode 1. Read through the blog if you haven’t yet. Here we can get a glimpse how we can control the Model and View in WebDynpro.

We have already seen the design of screen layout with a Textbox, TextEdit and Pushbutton in the previous episode. Now we have to control the user actions between Model and View for the same application i.e. the how data is passed back and forth between view and model when user enters the ABAP table name and presses FetchXSD button.

We can pass data forth and back to the model by creating data structures using the view. Controlling in its simplest terms is nothing but binding the UI elements to this data structures of the respective view which will be passed back and forth to the model.

Now lets comes to the context of WebDynpro, the term Context is confusing in message mapping and WebDynpro context as well. The context of context is confusing.AAAAAAH! Let me not confuse you too. In Webdynpro we use context to create the data structures of the view that binds the UI Elements of the views. Now lets the take the old grumpy illustration that is used for designing the view constituent of the MVC application.

Illustration: Let’s take a scenario where we have to generate an XSD depending on the table name that will be fed by the user. The application logic is described in the blog Generate XSD . We re-use this logic for the modelling and so it is required to have a through reading on this.
We have already completed the design of the view. Now let see how we control the view and the abstract model. We don’t discuss about the modelling of the application in this blog.

Create Context structure :The crucial part of the constituent control of the application design is the creation of context structure. In our illustration we need two data structures for output and input UI elements. (Note that using two data structure is not really required. I have taken it for simplicity).We call the data structure as the Node and element of the data structure as Attribute in WebDynpro terminology.
Now let’s create the Input Structure TABLE_DUMP and element DBTAB_NAME in the view INITIAL VIEW that is created in the previous episode.
Simultaneously Goto SE80, select the WebDynpro component that is created in the previous episode and click the INITIALVIEW and go to the CONTEXT tab on the right hand pane of the screen.Right Click the Context Node and say create node as shown below.
CreateNode
Now fill the name of the node as TABLE_DUMP and press ok. The node for the input structure is created.
Create TABLE_DUMP
Create the attribute DBTAB_NAME of type String by right clicking the node TABLE_DUMP.
image
image
Repeat the same procedure for creating the output structure XSD_DUMP and an String Attribute DBXSD_NAME. After creating both the structure the snapshot of the context on the INITIAL VIEW will be similar as shown below.
Context Structure
We created the context structures for input and output UI elements and let’s bind them to the respective UI elements.

Bind Context StructureGoto the Layout tab and click the UI element DBTAB_NAME and in the property window select the dropdown of value property which pops up a window for selecting an element from the context structure as shown below. Choose the DBTAB_NAME context attribute that is created earlier under TABLE_DUMP which binds the UI element to the context structure as shown below.
ValueProperty
Choose the Context
Bind DBTAB_NAME
Now click the UI Element XSD_DMP and in the property window select the dropdown of value property which pops up a window for selecting an element from the context structure as shown below. Choose the context attribute that XSD_DUMP is created earlier under XSD_DUMP which binds the UI element to the context structure as shown below.
ValueProperty
Choose the Context
Bind XSD_DMP
Final UI element FetchXSD button is the actual controller between the user and model. Let’s see the mechanism for the controlling the event. Click the UI element FETCH_DATA and create an event method ACTION2FETCH_XSD in the property window for controlling the action between user and model.
Click Create Event” /><BR><img src=
With this we have finished the controller constituent template of the application design. We have to now model how database table name is converted to the XSD Format.
Let me take a break now! Wait for the last episode that completes the most crucial design of the application! Don’t curse me if I don’t write in the next week.

To report this post you need to login first.

Be the first to leave a comment

You must be Logged on to comment or reply to a post.

Leave a Reply