Getting started with Adobe Forms

Before starting this tutorial, please ensure that Adobe life cycle designer is installed on your system and
Adobe designer is configured on your server.
In this tutorial, we would pass a parameter (CARRID) to the form and print the same with a page heading.
Go to transaction SFP.

For every form, an interface is mandatory. Enter the name of the interface and click on Create.

Click on Save. Enter the package and the workbench request no as per the requirements.
Following screen appears:

Double-click on Import.
Following screen, with a default parameter name, appears:

Click on Create.

Enter the parameter values as shown above.

Save and activate the interface.

Now go back to the main screen of the transaction SFP.

As shown above, select the radio-button Form and enter the name of the form. Click on
Create.
Enter the description for the Form and also enter the name of the interface created earlier.

Click on Save.
Now enter the package name and the workbench request.
Following screen appears:

Now drag and drop the import parameter Carrid from interface to Context on the right-hand side as shown
below:

Now click on the tab Layout

Now let us include a heading and display the value of the carrier id passed to this form.
Now click on Palettes Layout (see the screenshot below):

A small pop-up box appears.

Now in the tab Standard, drag and drop the element Text onto the page.

Now double-click on the object and enter the text required (Page heading here).

Now go to library again (click on Palettes Library) and drag and drop the object Text Field onto the
page.

Now select the object Text Field created just now. Right-click and select Palettes Object.

As shown above, change the caption to Carrier ID.

Now click on tab Value. In the list box for Type, select the value Read-only (as shown below)

Now go to tab Binding. Select the parameter CARRID as shown below:

Save and activate the form.

Now test run the form by clicking on Test (F8)

Enter the CARRID value and click on Execute.

Following is the output:

Working with Floating Field in Adobe Forms

By Kalyan Balabhadrapatruni, Yash Technologies

Go to Transaction SFP->

Select Interface Radio Button & Enter the name to create New Interface.
(Eg:- z_ft).

Click on Create & Enter the Description and Press Save:

Enter the Package, Transport and Press Save Button.

Creating a import parameter
Go to Form Interface->import ->Parameters name -> Enter the import parameter (ie:IV_NAME)

Save

Check

Activate the Interface.

Once the interface is activated.

Go back to transaction SFP.

Select Form Radio Button & Enter the name to create New Form.
(Eg:- z_ft).

Enter the Description & Interface name which we have created and press save button.

Enter the Package, Transport No and Press save.

Form Context is displayed as below.

Drag & drop the Global data form Interface to Context Level & Save the form.

Click on the Layout to design the layout.

Form layout is displayed.

Click on the Library, drag and drop the Text Field

.
Expand the Text Field.

Enter

the

Following

text

Select only Name Text (Which will be highlighted), Right click on it.

Select floating field from the popup.

in

field.

Name Field is converted to text field.

Go to object tab-> Binding Tab -> Select the Binding and Rename it from {TextField} to {Name}.

Save and activate the form.

Execute the form to see the below screen.

Here for output we will have two scenarios.

SCENARIO 1: Entering the First name and Last Name
SCENARIO 2: Enter the First Name

SCENARIO 2:

Adobe Forms - Create table

Step1: Go to Transaction SFP to create Adobe form. Provide the interface name and click on create button.

Step2: Provide the description. Click on Save button.

Step3: The following screen would appear.

Now click on create button to create parameter.

Save the interface.

Step4: Go to TYPES in the Global definitions to define the user define types as shown below.

Step5: In Global data,

Create an internal table with the same structure defined earlier in TYPES definition as shown below.

Step6: In Code Initialization,

Save and activate the interface.

Step7: Now go back to the initial screen. Provide the form name and click on create button as shown below.

Provide the description for the form and interface name created as shown below.

Click on save button.

Step8: Now, the following screen will appear.

Step9: Here, we have to drag and drop the contents, to be displayed in the layout, from interface to context
as shown below.

Step10: Here in the internal table PT_VBAP, we can de-activate the fields, which we dont want to display
in the layout. We can do this as shown below.
Place the cursor on the field and give a right click. Now select Deactivate.

Then, the field will appear as shown below.

Step11: Now, go to layout. The following screen appears.

Step12: Now, Drag and drop the VBELN (Document Number) field to Master page.

Step13: Select the object VBELN. Go to palettes-object. You will get the following screen.

Select None instead of Sunken Box.

Step14: Now, drag and drop the internal table PT_VBAP from Data View to body page.

Step15: Now, go to hierarchy, place the cursor on bodypage1.

Go to palettesObject
The following screen appears.

Select Flowed instead of Position.

Save and activate the form.
Step16: Execute the form, the output is

Using Text Modules in Adobe Forms

By Nikunj Shah, YASH Technologies

In this demo we will create an adobe form which displays text in two different languages (English
or French) based on the given condition. This functionality is achieved by using TEXT MODULES
in adobe forms.
Step1: Go to transaction SFP and create an interface for the Adobe form.

Note: Maintain Interface type ABAP-Dictionary Base interface. (IN ECC6.0 Version)
Step2: Create an import parameter as shown below:

Step3: Save and Activate the interface.

Step4: Now go to transaction Smartforms to create Text Module for the Language Conversion, Select
Text
Module
and
Enter
Text
Module
Name
&
Click
on

create.
Here, we are converting English text to French text, so we have to enter the French conversion of the
English text.
Text 1: TEXT IN ENGLISH.

Click on Save.
Similarly create the text module for text French to English.
Text 2: TEXT IN FRENCH

Text 3: TEXT IN ITALIAN

STEP 5: Once the Text modules are created, Go to Transaction SFP to design form builder for the
interface ZTEXTMODULE_TEMPLATE.

STEP 6: Click on Create.

STEP 7:
After clicking on create, the system would prompt you for the Interface name and description.
In Interface Name tab : ZTEXTMODULE_TEMPLATE.
In Description

: Form for the Language Conversion.

Now the following screen appears:

STEP 8:
Right Click on Form name in the context area and create New Folder.

STEP 9:

Drag

&

Drop

Flag1

field

from

the

import

area.
STEP 10:
Right Click on New FOLDER, create three texts for the text modules.

part

in

to

the

Context

STEP 11:
Double
click
Condition

on

the

new

folder.

The

following

screen

appears.

STEP 12:
Double-Click on Text and maintain the properties as shown below.
Description as Convert TEXT INTO ENGLISH into FRENCH
Text Type

: Text Module

Text Name

: Text Module name (ztest_french)

Text Language : FR

Click

on

Repeat the above step for the other texts as well.

STEP 13:
Click on Layout.
On the left side platter, in data view, we can view all the fields that we defined in the context part. (In this
example, flag1 and three texts)

STEP 14:
In our layout, let us also include a logo and some text as well.
Go to Master Page. From Library Palette, insert image field and text into the master page.
Enter text in text field and Enter image in image field and check the checkbox Embedded image data.

STEP 15:
Go to Body Page.
Create following three text fields:

Text in English
Text in French
Text in Italian.

Now right click on the text field and select the option floating fields.

Now we need to do the binding for the text field. Select the text field Text in English, Click on palette click
on object go to binding tab. Please see the following screenshot for the binding.

Now repeat the above step for binding the other two text fields.
STEP 15 - 2:
Second way is Drag & Drop from the Data view.

Just below the text field drag & drop the text field from the data view, in this case you dont have to do the binding,
it will assign automatically.

STEP 16:
Click on Save and Activate it.
STEP 17:
Click on Execute. Assign Value X to Flag1. Otherwise it only display in English. If FLAG1 has value
X than test will display in English & French Both.

Output:

Value help in Adobe interactive forms

Introduction
Value help in application is useful to avoid typos and to check list of possible values when user dont know exact
value for the input field. We can incorporate these value helps in Adobe interactive forms both for online and
offline scenarios. This document explains step by step procedure for adding two types of value helps in Adobe
interactive forms. This document considering integrating adobe forms in WebDynpro ABAP with integrated
using Zero Client Installation (ZCI).

Standard Value help

Static Value help/Context based value help

Standard Value Help

Here Standard value help means F4 help available in SAP; we can add this feature in adobe interactive forms.
Once user clicks on drop down button it fetches value help form SAP and displays in the screen. Once user
chooses one of the suitable entries that input field will get updated with the selected entry.
Procedure:
Step1: In layout Choose UI element Value Help Drop-down List from WebDynpro Native Controls of Library
Palette.

Step2: Go to Object Palette and in Binding TAB update Default Binding with corresponding field by pressing
Arrow and choose form the Interactive From Context.

Step3: Pop-up screen will come to confirm the update of field properties. Click OK. If you do so all properties will
be updated at the same time the UI element will change to normal input Field. You need to change this to Dropdown list in Object Palette->Field Tab as shown below.

Step4: Now you are done with implementing Standard value help for you adobe interactive form. Save and
activate your form and test application. Now you can see Standard value help once you click drop-down link on
adobe form.
This is simple and Zero coding required in application.

Value help in Adobe interactive forms

...Previous

Static/Context based Value Help

Instead of standard value help we can add custom value help; this can be form context of Adobe form. In this
case there is need of coding. For this value help you need to have a context node with two fields one for value
and another for corresponding text. As we are proceeding with WebDynpro ABAP, we need to fill this node
WDINIT method of WebDynpro view or controller.
Step1: Create a context node with Value and Text. Text is optional here.

Step2: Select corresponding Values and texts into one internal table or populate internal table with possible
values and bind that internal table to context node.
Sample Coding:
* Create internal table
types:

data:
*

t_country

begin

type

of

STANDARD
Select
select
into

land1
end
TABLE

x_country
type
of
OF

from
table

,
t005-land1,
x_country.
x_country.
Data
land1
t005
t_country.

DATA
lo_nd_adobedata
TYPE
REF
TO
if_wd_context_node.
DATA
lo_nd_countrynode
TYPE
REF
TO
if_wd_context_node.
DATA
lo_el_countrynode
TYPE
REF
TO
if_wd_context_element.
DATA
ls_countrynode
TYPE
wd_this->element_countrynode.
*
navigate
from
<CONTEXT>
to
<ADOBEDATA>
via
lead
selection
lo_nd_adobedata =

navigate
from
lo_nd_countrynode =

*
CALL
new_items

Bind

wd_context->get_child_node(
name
=
wd_this->wdctx_adobedata
).
<ADOBEDATA>
to
<COUNTRYNODE>
via
lead
selection

lo_nd_adobedata->get_child_node(
internal
METHOD

name
table

wd_this->wdctx_countrynode
).
to
context
lo_nd_countrynode->bind_table
EXPORTING

= t_country.

Step3:
In Layout editor Choose field Enumerated Drop-down List form Library Palette and place on the layout

Step4: Go to Object Palette and in Field tab click List Item link as fallows.

Step5: One pop-up screen will come and there you need to set Binding properties Items, Item Text and
Item Value as shown below and Press OK.
Items-> Context node
Item Text-> Text field in Context node
Item Value-> Value field in Context node

Now you are done with implementing Static/Context based value help for you adobe interactive form. Save and
activate your form and test application. Now you can see Static/Context based value help once you click dropdown link on adobe form.

Comparison

Coding Required
Online
Offline

Standard
No
Yes
Not available

Static
Yes
Yes
Yes

Nested tables in Adobe Forms

This Tutorial demonstrates on using Nested Tables in Adobe Forms.
Step1: Go to SFP transaction and create interface for the Adobe form.

Note: Maintain Interface type ABAP-Dictionary Based interface. (IN ECC6.0 Version)

Step 2: Create Global Types as shown below by clicking on Types, here we are creating a Nested Table
type which consists of 2 Individual fields (carrid, carrname) and an Internal Table(spfli).

Step 3: Create Global Work Areas and Internal Tables as shown below.

WA_SCARR
IT_SCARR
WA_SPFLI
IT_SPFLI
WA_FLIGHT
IT_FLIGHT

TYPE
TYPE
TYPE
TYPE
TYPE
TYPE

SCARR
SCARR_TAB
SPFLI
SPFLI_TAB
TYPE_FLIGHT
TABLE_TYPE_FLIGHT

Step 4: Code for fetching the data is written in the code

initialization part of interface.
In code initialization the variables whose values are being passed to the code to fetch the details of the output
should be declared in the Input parameters and the variables to which the results are assigned needs to be
declared in the Output parameters.
Input Parameters:

WA_SCARR
IT_SCARR
WA_SPFLI
IT_SPFLI
WA_FLIGHT
Output Parameters:

IT_FLIGHT

Step 5: Write the below code in code initialization part. Check for errors and activate the interface.

* Fetching Flight Details from SCARR Table.

SELECT *
INTO TABLE it_scarr
FROM scarr
UP TO 10 ROWS.
* Fetching Data from SPFLI Table for corresponding Entries in SCARR.
SELECT *
INTO TABLE it_spfli
FROM spfli
FOR ALL ENTRIES IN it_scarr
WHERE carrid EQ it_scarr-carrid.
* Looping at SCARR Internal Table.
LOOP AT it_scarr INTO wa_scarr.
wa_flight-carrid
= wa_scarr-carrid.
wa_flight-carrname = wa_scarr-carrname.
* Looping at SPFLI Internal Table.
LOOP AT it_spfli INTO wa_spfli WHERE carrid EQ wa_scarr-carrid.
* Appending SPFLI Records into the SPFLI part of FLIGHT Table.
APPEND wa_spfli TO wa_flight-spfli.
ENDLOOP.
* Appending SCARR Records into the SCARR part of FLIGHT Table.
APPEND wa_flight TO it_flight.
CLEAR wa_flight.
ENDLOOP.
Step 6: After the interface part is done, create Form by going to SFP transaction.
Step 7: In the creation of the Form, we need to give the name of the interface for which we are creating the
Form. This is the additional functionality in Adobe forms. One interface can be used for many Forms if it is
suitable.

Give the Description to the Form as shown below.

Step 8: In the Context tab of the Form we will find two sections Interface and Context.
In Interface we will find the data that was created in the interface. We need to drag the elements that need to be
displayed in output into the content area.

Deactivate the Unwanted Fields as shown below.

Rename Content Area to ContentArea1.

Then Right-Click on the Content Area and click on Insert SubForm and Resize it accordingly.

After that Click on Master Pages and then Drag and Drop a Text and Enter any suitable Text.

Then Right-Click on data and create one more Sub Form and align it as shown below.

Nested tables in Adobe Forms

Reduce the size of Content Area as shown in figure below.

Step 9: Click on Subform and then in Right-click on the Subform and then in Palettes click on Object and
then under Objects Tab click on Subform and make the Content as Flowed as shown below.

Then Create one more Subform and Rename it as Table and then Right-click on this Form and in Palettes
click on Accessibility make the Subform role as Table and make its Subform content as Flowed as in above
case.

Step 10: Then Insert two Sub Forms in the Table Sub
Form, rename it as Header and Body, make sure to
make them as Flowed too, and make the Accessibility of the two Subforms as Header Row and Body Row
respectively.
Then Insert a Static Text in Header and insert the Field names as shown below.

Step 11: Then under Data View, individually Drag and Drop the Fields from the table it_flight in Body Sub
Form.
Fields are CARRID,
CARRNAME,
SPFLI.

Step 12: Then under Hierarchy tab Select the 3 Fields (i.e. Carrid, Carrname, and SPFLI) and then drag
drop them in Body Sub Form as shown below.

Then make the Body Sub Form as Flowed as well as make its Flow Direction as Western Text as shown
below.

Step 13: Delete the Table Header of SPFLI as shown.

Select the all Fields and make their Appearance as None.

Insert a column to the left of connid as shown below.

Finally arrange the Fields as shown below.

Step 14: Under the Pagination Tab of Body Subform in Overflow choose the Go To Content Areavalue as
ContentArea1.

Step 15: Change the Binding of the Body Subform as shown below.

Step 16: Give the binding for CARRID.

Follow the same for CARRNAME.

Change the binding for SPFLI as shown below.

Change binding for CONNID and fields related to SPFLI as shown below.

Step 17:
Save and Activate the form.
Step 18:
Execute the form. The following output will be displayed.

Scenario on displaying logo, background image and fetching data

from multiple tables
By Venkateswara Rao Appikonda, Intelligroup

Go to the transaction code SFP.

Let us first create an interface for the form. Say the name of the interface is ZTABLES.

Chose Create (f5) and provide the necessary description for the same.

Save the object either as local object or any package.

Double Click on import in the form interface and choose Create button over there.
Provide the import parameter: PERNR as shown below.

In the types, provide the following code:.

types: begin of ty_final ,
pernr like pa0002-pernr,
begda like pa0002-begda,
endda like pa0002-endda,
vorna like pa0002-vorna,
nachn like pa0002-nachn,
ansal like pa0008-ansal,
lga01 like pa0008-lga01,
bet01 like pa0008-bet01,
end of ty_final.
TYPES: it_final type table of ty_final,
itab type table of pa0002 ,
itab1 type table of pa0008 .

Provide the following code in the initialization .

select * from pa0002
into table itab
where pernr = pernr .
select * from pa0008
into table itab1
for all entries in itab
where pernr = itab-pernr .
loop at itab into wa_itab .
wa_final-pernr = wa_itab-pernr.
wa_final-begda = wa_itab-begda.
wa_final-endda = wa_itab-endda .
wa_final-vorna = wa_itab-vorna.
wa_final-nachn = wa_itab-nachn .
read table itab1 into wa_itab1 with key pernr = wa_itab-pernr.
wa_final-ansal = wa_itab1-ansal.
wa_final-lga01 = wa_itab1-lga01.
wa_final-bet01 = wa_itab1-bet01.
append wa_final to it_final .
endloop.

Define the import and output parameters as shown above.

Declare the following variables in the global declarations:

Save and Activate it .

Now create the form as shown.

Enter the description and provide the interface name as ZTABLES, which is created earlier.

Save the object either as local object or under a package .

Drag the import parameter PERNR and output tables and system fields( if needed) onto the context area

First deactivate all the fields in the table itab and then select the fields to be visible in the output (right
click on the field and choose activate) as shown below. Repeat the same for the internal tables itab1 and
it_final as well .

Click on layout tab.

Now drag the fields from the data view to the design view...and arrange them in a specific order in which
you want and create a text element for the header. Here you can change the font and size for the text
element in the right side pane.

Inserting logo on the form

Go to pallets -> object then a new window will opens as shown below. (Compare the above and below
diagrams)

Double-click on the image dragged from the library (here it is shown below) then it will show a F4 help for
selection of the image like this..

Click on the image and choose open then it will be on the body page and you can select the image and
increase the size of the image also

For the image to be displayed on the form, it is important to do this. Right Click on the image and click
on object and check the EMBED IMAGE DATA checkbox.

How to put the background image on the form

To put the image as a background, select the image into the body page and right click on the image and
choose send backward then it will become the back ground like this..

(You need to check the checkbox EMBED IMAGE FIELD for the background image here as well)
Save, Activate and execute it .

Provide a personnel number (input)

Choose execute. Give the input device as LP01 or LOCL

Choose print preview.

How to call this in a program

REPORT Zadobeforms .
data:/1BCDWB/FORMOUTPUT type FPFORMOUTPUT ,
/1BCDWB/DOCPARAMS type SFPDOCPARAMS ,
ie_outputparams
type SFPOUTPUTPARAMS .
CALL FUNCTION 'FP_JOB_OPEN'
CHANGING
ie_outputparams
= ie_outputparams .
.
*---here get the function module name from the form
CALL FUNCTION '/1BCDWB/SM00000220'
EXPORTING
/1BCDWB/DOCPARAMS
= /1BCDWB/DOCPARAMS
pernr
= '00001000'
IMPORTING
/1BCDWB/FORMOUTPUT
= /1BCDWB/FORMOUTPUT .
CALL FUNCTION 'FP_JOB_CLOSE' .