Tuesday, January 29, 2013

Webdynpro Application Help - Consolidated


Webdynpro Development is one of the hot topic/requirement in current market. One of the main reason for that is the usage of Application out of SAP logon, that is requirement for ability to access data, post transactions, view market analysis over web instead of traditional SAP logon is increasing day to day.

There are lot of blogs, websites where you can find tutorials, help, notes, demos etc but I felt that there isn't any place where we can find consolidated help for rookies to webdynpros. I tried to put some notes on few topics which are simple but are crucial when doing Webdynpro Development.

When Defining Views - When Defining views, if you are following an online demo you just proceed what he says but if you are doing on your own, you might get a doubt as where to start..

Starting Element of View - If your screen starts with input/output fields then you would need a GROUP UI element inside which you can put your variables.
Whereas, if your screen starting section itself is a Table, then you would need a ViweContainerUI Element to which you will bind a Table.

Above two are the most common starting points, apart from these you do have few other options which can be used as starting elements based on your requirement.

Properties of Elements -

  • Layout - This is one tricky property which I get confused whenever I start a new WD application development. Below is the list of available options in a Layout with simple explanation as what it does..
    • FormLayout - Left to Right, across the output screen. This layout will make the that group/element to spread across the complete screen.
    • Grid Layout - This helps us to arrange the output based on number of columns in output.
    • Matrix Layout - Number of columns not fixed. Each element can be specifies for which row and which column on the output. 
    • Rowlayout - Row by Row output.
Now, these layout types vary based on element type. The above ones are specifically for a Group Layout. When you select Formdata at the header UI element level, that gets copied to all the elements you create under it but you will have the option to change those after you create. Within Formlayout, there are more types..
      • Formdata - All the elements you add get aligned side by side.
      • FormHeaddata - All the elements act as Headdata so each element shows up one below the other.
      • FormTopdata - FormTopdata adds the field to the top row of the application.
    • Tip - When you are adding multiple input fields inside a GROUP UI element, then for the first input, we use Formdata, 2nd input will have FORMHEADDATA if you want it to show it below the first input field, if you put that as FORMTOP, then it shows next to first input field.
There is a blog/demo on SDN by Anurag Chopra which explains these layouts in more detail and below is the link for that..thanks for his detailed explanation. 


Remaining properties of the elements are mostly self-explanatory.

Notes regarding Coding:

SAP did provide us with Wizard feature which really helps a lot when doing the actual coding, but just a note as what it is creating when we do GET or SET of an attribute or table.

Case 1 - When I am trying to do SET operation on a Table element in the context node,

             Step 1:  It creates a instance of the Context Node(Complete Context node) as shown below,

    DATA lo_nd_spfli TYPE REF TO if_wd_context_node. - In my context node I have lot of nodes but in the initial step i tried to SET a single node, so it created an instance type of that context node.

           Step 2: It creates an instance for that element as,

 DATA lt_spfli TYPE wd_this->elements_spfli. - Here its creating an internal table based on the element you have selected.

           Step 3: In step 1, you have just created a Type of that Context node, now, you have to link the local instance to actual Component Controllers context node.

*   navigate from <CONTEXT> to <SPFLI> via lead selection
    lo_nd_spfliwd_context->get_child_nodename wd_this->wdctx_spfli ).

          Step 4: Add necessary logic to fill the data to be displayed in the output.
   
          Step 5: Link the internal table data to context node element. - In this step, you will map the internal table data to the actual context nodes element created above.

  lo_nd_spfli->bind_tablenew_items lt_spfli
                                         set_initial_elements abap_true ). - You are binding local internal table data to the node instance which is created in step 1.

 I will keep on adding notes about stuff which are simple but good to understand.