By G.K.

Akbar, The Washington Post

I have created a table ZDEPT with just three fields; I will be creating an Adobe form for these three fields
and will be updating this table using ABAP Web Dynpro framework.

Go to transaction SE80 and create a web dynpro component ZADOBE.

Enter the details in the popup window as shown below
Assign a package to the application or save as a local object

You can see Component controller, Interface controller and window being created
Create a View as shown below
Give the view name as MAIN_VIEW as show below
You can see the main view being created.
Go to the context tab of the MAIN_VIEW and create a empty node.
Click here to continue...

Demo scenario on Adobe Interactive Forms using ABAP WebDynpro -

Part1
...Previous

Give the name of the Node as Adobe and press enter as shown below.
You can see the node Adobe being created below.
Create another node under the node adobe as shown below.
Give the name of the node as ZDEPT and Dictionary structure as ZDEPT and press the button Add
Attribute from Structure.
Select the Fields as shown below and press enter.
You can see the node ZDEPT with three fields being created under the node ADOBE.
Now create an attribute PDF_SOURCE under the root node CONTEXT as shown below
Click here to continue...

Demo scenario on Adobe Interactive Forms using ABAP WebDynpro -

Part1
...Previous

Give the Attribute Name as PDF_SOURCE and the type XSTRING as shown below
You can see all the nodes that we have created; your screen should appear like the one shown below.
Go to the Layout tab of the MAIN VIEW and create a place holder for the adobe form, Right click on the
ROOTUIELEMENTCONTAINER select insert Element from the context window as shown below.
Enter the details in the POPUP window, give the name of the place holder as ADOBE and type
InteractiveForm as shown below.
You can see the placeholder ADOBE being created, check the CHEKBOX enabled in the property list,
this is a required entry for an interactive form, (an activex control Active Control Framework will be
automatically downloaded on to the client from the server when the web page is first called). Increase the
height to 500px and width to 500px as shown below.
Click on the button in the property list for the property pdfSource and select the node PDF_SOURCE
from the context window.
In the property List for template Source property give the name of the adobe form ZADOBE that we will
be creating during this session and double click on it.
Click here to continue...

Demo scenario on Adobe Interactive Forms using ABAP WebDynpro -

Part1
...Previous

In the POPUP window, give the adobe form interface name ZADOBE as shown below and press on the
Context button as shown below.
Select the Node Adobe from the context window as shown below.
Save the application as local object.
 Press
the button Save to save the main view.
You can see the Adobe form application with our web dynpro context node ZDEPT being mapped to the
context of the Adobe form in the Data view tab.
Just Drag and Drop the ZDEPT Node on to the form, in the subform tab of the object make the content
as Flowed as shown below
Drag and Drop Text from the Library pallet and enter the text as you wish
Drag and Drop the Submit button on the form as shown below
Click here to continue...

Demo scenario on Adobe Interactive Forms using ABAP WebDynpro -

Part1
...Previous

Just select the event click* and language JavaScript and run at client (No coding is required)
Now save and just activate the Form and the interface as shown below.

Go to the properties page of the form and double click on the interface ZADOBE you can see the XML
Schema
You can see the XML Schema interface (You can have three types of interfaces Abap dictionary
interface, Smart form compatible interface and XML interface) for interactive forms using WebDynpro you
have to use the XML Schema interface.

Press the back button to go back to our web dynpro application.

Now we are back to our web dynpro application.
Select the window ZADOBE as shown below
Drag and Drop the MAIN_VIEW on to the window
Go to the Main View layout tab and select the node ADOBE and in the property list Under Events click
on the create button for the event onsubmit as shown below
Click here to continue...

Demo scenario on Adobe Interactive Forms using ABAP WebDynpro -

Part1
...Previous

Give the name of the action as CLICK and press enter.

Go to the Actions tab of the MAIN_VIEW you can see the Action Click, double click on the action
CLICK.
You can see the Method ONACTIONCLICK. Here you can code your business logic, you can call a BAPI
or a function module based on the requirement. We are going to code for inserting the values into the
table zdept, the values will come from our adobe form.

Copy the below code and paste it in the method.

method ONACTIONCLICK .

data:
Node_Adobe type ref to If_Wd_Context_Node,
Node_Zdept type ref to If_Wd_Context_Node,
Elem_Zdept type ref to If_Wd_Context_Element,
Stru_Zdept type If_Main_View=>Element_Zdept .

data wa_zdept type zdept.

* navigate from <CONTEXT> to <ADOBE> via lead selection

Node_Adobe = wd_Context->get_Child_Node( Name = IF_MAIN_VIEW=>wdctx_Adobe ).

* navigate from <ADOBE> to <ZDEPT> via lead selection

Node_Zdept = Node_Adobe->get_Child_Node( Name = IF_MAIN_VIEW=>wdctx_Zdept ).

* get element via lead selection

Elem_Zdept = Node_Zdept->get_Element( ).

* get all declared attributes

 Elem_Zdept->get_Static_Attributes(
importing
Static_Attributes = Stru_Zdept ).

wa_zdept-DEPTNO = Stru_Zdept-deptno.
wa_zdept-DNAME = Stru_Zdept-dname.
wa_zdept-LOC = Stru_Zdept-loc.

insert into zdept values wa_zdept.

endmethod.

Your Screen should look like the one shown below.

Now Save and Activate the Webdynpro.

Create a Web dynpro application as shown below. Just right click on the node ZADOBE and from the
context window select createWeb Dynpro Application.
Enter the Application name as zadobe as shown below.
Save the Web dynpro application as local object
Click here to continue...

Demo scenario on Adobe Interactive Forms using ABAP

WebDynpro - Part1
...Previous

Go to the MAIN_VIEW Actions tab and keep a session break point in the code, to just see if our
code is being executed when we submit the data from the adobe form.
Now we will test the application, right click on the node zadobe and select test from the context
window.
Logon with your credentials; give your username and password
You can see the Adobe form that we have designed, enter the data as shown below and press the
submit button. (As I said earlier an activex control will be installed on to the client machine, you
can see the activex control in the internet explore go to the menu: ToolsInternet optionsgo to
the programs tab Press button Manage add-ons.

You can see an activex control named SAP ACF, if you dont have this control you will not see
this page: Note you need to have adobe acrobat reader 7.1 installed, I have used version 9, the
activex control was not working properly so down graded my adobe reader to 7.1)
Press F8 to continue.
You can see the entry in the table ZDEPT being updated.