Sei sulla pagina 1di 420

Adobe Interactive Forms Tutorials

Step-by-Step Tutorials

Getting started with Adobe Forms with a simple exercise (More details) Create table (More details) Create table using subform (More details) Using Alternative in Adobe Forms (More details) Using Text Modules in Adobe Forms (More details) Value help in Adobe interactive forms (More details) Making subform behave as table and data part as body row (More details) Using Where conditions to relate header and item tables in Adobe forms (More details) Demo on Nested tables (More details) Achieving Control levels functionality in Adobe Forms (More details) Calculating Page-wise Sub-Totals and Grand Total in Adobe forms (More details) Including the Standard Texts (SO10) and any other Long Texts in the Adobe Forms (More details) Scenario on displaying logo, background image and fetching data from multiple tables ( More details) Printing Address using Business Address Services (BAS) (More details) Printing Address without using Business Address Services (BAS) (More details) Configuring the Adobe Forms / Smart forms / SAP Script to the output type in NACE ( More details) Demo on Adobe interactive forms using WebDynpro for ABAP Part 1 (More details) Demo on Adobe forms using WebDynpro for ABAP Part 2 (More details) Printing labels using Adobe Forms (More details) Migration of an SAP Smart form to Adobe Form (More details) Using Multiple Master and Body pages (More details) Sending an Adobe form as an attachment in an email (More details) Uploading a PDF file in an Adobe Form offline scenario (More details) Offline scenario to download an adobe form using Web Dynpro for ABAP (More details) Offline scenario to upload a filled-in adobe form using Web Dynpro for ABAP (More details) Using Web Services in Adobe Forms (More details) Achieving Conditional-breaks in Adobe Forms (More details) Online Scenario - Travel Request Form (More details) Steps for creating a Web Dynpro Component for Adobe interactive Forms using the Enumerated Drop Down Box (More details) Upload Photos/images into custom table & Print in Adobe form (More details) Adding rows dynamically in a table using interactive Adobe Forms (More details) Hiding a Field Using Javascript in Adobe Form based on the condition (More details) Sending Adobe forms as PDF attachment using Email Submit Button (More details) Custom Dialog Box Message while Saving the Adobe Form without filling the Mandatory Fields (More details) Digital signature in Adobe forms (More details) Validation of date and calculation of the number of days between two dates using Java Script ( More details) NEW Quick testing for Adobe Forms (More details) NEW Date validation in interactive adobe forms (More details) NEW

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). Network Plants (More details)

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:

Adobe Forms - Create table


By Venkat

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

Adobe Forms - Create table (using subform)


By Venkat

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

Step2: Provide the short description and click on Save button.

Step3: The following screen will appear.

Now click on create button to enter the parameters.

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 types_vbap 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 fields 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 require to display in the layout. We can do this as shown below. Place the cursor on the field, right click and 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) to Master page and create text fields as shown below.

Step13: Now, create sub form in HIERARCHY as shown below in the body page.

Place the cursor on bodypage1 and right click on it. Now select Insert Subform to create the sub form in the body page.

Step14: Now, from the Data View, drag and drop the fields in the internal table into the sub form as shown.

Step15: Now, go to hierarchy, place the cursor on bodypage1. Go to palettesObject The following screen appears.

Select Flowed instead of Positioned. Save and activate the form. Step16: Execute the form, the output would be similar to the following:

Adobe Forms - Using Alternative


By Jayachandra Nagaram, YASH Technologies

In this demo we will create adobe form, which displays two different table data in different scenarios based on the given input. This functionality is achieved by using Alternative in adobe forms. Step1: Go to SFP transaction and create interface for the Adobe form.

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

Step2: In interface you will find import, export and Exceptions. Create import parameters by clicking on below shown create button.

Step3: Create import parameters IT_SPFLI and FLAG. The import parameter IT_SPFLI is used to input data and FLAG is used to select the table that should be displayed in the Output. Here the details of either SPFLI or SFLIGHT are displayed depending on the FLAG.

Step4: Create two global tables SPFLI and SFLIGHT to hold the data that needs to be displayed in the output.

Step5: 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.

Step6: Write the below code in code initialization part. Check for errors and activate the interface. select from into for where * spfli table gt_spfli all entries in it_spfli carrid eq it_spfli-carrid

and select from into for where and

connid eq it_spfli-connid. * sflight table gt_sflight all entries in it_spfli carrid eq it_spfli-carrid connid eq it_spfli-connid.

Step7: After the interface part is done, create Form by going to SFP transaction.

Step8: 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.

Step9: 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. Content area will be blank initially. We need to drag the elements that need to be displayed in output into the content area.

Step10: Drag and drop element FLAG into context area.

Step11: Select folder YDEMO_ALTERNATIVE in context and create an ALTERNATIVE. Right-clicking on the folder go to create--> Alternative.

Step 12: In Alternative will find two nodes TRUE and FALSE. Initially both are blank.

Step13: Drag and drop table GT_SPFLI from Global data to TRUE node and de-activate fields which we don't need.

Step14: Drag and drop table GT_SFLIGHT from Global data to FALSE node and de-activate fields which we don't need.

Step15: Select the Alternative conditions tab and create condition for alternative. Create condition as FLAG = INITIAL. Means subform TRUE will be triggered when the flag is initial and subform FALSE will be triggered when there is some value in flag variable (NOT INITIAL).

Step16: Select tab page LAYOUT for going to Adobe layout.

In Layout, go to MASTER page decrease the page area and create the boiler plate elements, such as text and image elements. We can create these from dragging the elements from library.

Step17: In data view we will find subform ALERNATIVE, with in it tables will be placed in TRUE and FALSE subforms using choice subformset.

Step18: Drag and drop complete ALTERNATIVE subform into body page from data view.

Step19: Select body page and go to the object view from the pallets.

Step20: Go to SUBFORM tab; make the body page content FLOWED, Flow direction TOP TO BOTTOM.

Step21: Go to Pagination, set over flow to Go To Page "Page1". This should be done in order to flow the content to the next page when first page is filled completely.

Step22: Set subforms ALTERNATIVE, TRUE, FALSE content also to be flowed.

Step23: Select the elements in table data and set the appearance to None.

Step24: Save and activate the form. Execute the form to see the below screen. Here for output we will have two scenarios. Step25:

SCENARIO 1: When the FLAG is INITIAL, SPFLI data will be displayed in output. SCENARIO 2: When the FLAG is NOT INITIAL, SFLIGHT data will be displayed in output.

Step26: Select the table IT_SPFLI to give the input data. Give inputs to the table.

Step27: Now there are three entries in the table IT_SPFLI and the FLAG is BLANK.

Step28: Subform TRUE will be triggered when FLAG is INITIAL. And SPFLI table data will be displayed in output.

Step29: Maintain same data in IT_SPFLI and give 'X' in FLAG. Scenario 2 will be triggered.

Step30: Output screen displays SFLIGHT table data;

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 part in to the Context area.

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

STEP 11: Double click on the new folder. The following screen appears. Click on Condition

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

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


By Sanjeeva Reddy Gujjula, YASH Technologies

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 Drop-down 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 dropdown link on adobe form. This is simple and Zero coding required in application.
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: begin of x_country , land1 type t005-land1, end of x_country. data: t_country type STANDARD TABLE OF x_country. * Select Data select land1 from t005 into table 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 = wd_context->get_child_node( name = wd_this->wdctx_adobedata ). * navigate from <ADOBEDATA> to <COUNTRYNODE> via lead selection lo_nd_countrynode = lo_nd_adobedata->get_child_node( name = wd_this->wdctx_countrynode ). * Bind internal table to context CALL METHOD lo_nd_countrynode->bind_table EXPORTING new_items = 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 drop-down link on adobe form.
Comparison

Coding Required Online

Standard No Yes

Static Yes Yes

Offline

Not available

Yes

Making subform behave as table and data part as body row


By Nisrin Pindwarawala, YASH Technologies Whenever we use a table in an adobe form using drag & drop, following are the common problems faced: Whenever the column fields are rearranged randomly into many rows, the data is displayed in a improper fashion. In debugging, if we delete any row, and the data that is displayed becomes improper.

Solution: This demo will help us rectify the problem by making the subform behave as table and the data part as body row. This is achieved by assigning binding to the subform. Step1: Go to SFP transaction and create interface for the Adobe form.

Step2: Passing the table as import parameters, which will be passed through driver program.

Step3: Activate the interface. Step4: Create Form by going to SFP transaction.

Step5: The form contains the context area, which will display the contents of interface. Drag and drop the table 'IT_SFLIGHT' from context area under the folder 'YDEMO_SUBFORMS'.

Step6: Deactivate the fields of the table, which will not be used in the layout, it adds to the performance.

Step7: Go to layout tab, under the layout change the content area adding a static text to the top of master page. Name the content area. Click on the tab body pages. For the body page the subform content has to be positioned. Move the fields, which you want to view from data view on to the body page individually. Note: When we try to move the individual fields of the table the binding with the table is affected and the data that is displayed becomes inconsistent, this demo will help you retain the binding with the table by making the subform act as a table.

Step8: The field 'FLDATE' can be displayed in different formats as per the requirements, which will be explained by below snapshots.

Step9: Select all the fields being displayed on the layout and wrap them in subform. The Accessibility of the form should be bodyrow. Create another subform for ex: Sflight details and wrap the fields in this subform and give the subform content as positioned and for the bodyrow subform give the subform contents as flowed. The check box "Allow page breaks within content" has to be marked for the data which is being flowed.

Step10: If the data is flowing to multiple pages then we direct the over flown data. Move to pagination tab under object tab, under that if dataset is paginated under overflow give the name of content area and overflow leader as header row. By adding this whenever an overflow occurs the header will be displayed in all the pages.

We need to create two subforms, the reason is that the body of the table can be flowed to multiple pages and if we make the subform as flowed all the elements will be aligned either top to bottom or western text (left to right). So as we need to display the table contents in two rows we created two subforms, first one will be flowed and the second one under first one which will be positioned. Step11: Creating Header row for the table. Drag a static text element from the library and drop it above the body row. Wrap the text in a subform giving the accessibility as header row.

Step12: Creating a table subform. The content of the subform should be flowed and the accessibility should be table. Name the untitled subform (Page 1) as "Bodypage1". After doing this change the content of the body page as flowed then click on pagination tab, under that if dataset is paginated under overflow give the name of content area same as what we performed for body row. (In body page we gave overflow leader as header row but in body page pagination do not use that)

Step13: Giving borders to the table and header.

Step14: Giving bindings to each of the subforms. Table Binding: YDEMO_SUBFORMS->IT_SFLIGHT.

Bodyrow Binding: YDEMO_SUBFORMS->IT_SFLIGHT->DATA. The checkbox repeat subform for each data item has to be checked giving Min.Count = 1.

Step15: Save and activate the form. Step16: Creating a Driver Program which will call the form and on execution will display the adobe form.

*&---------------------------------------------------------------------*

*& Report yh_demo * *&---------------------------------------------------------------------* *&Purpose: Demonstrating driver program to display adobe form * *&---------------------------------------------------------------------* REPORT yh_demo. *Data Declarations DATA : it_sflight TYPE sflight_tab1. DATA : w_doc_param TYPE sfpdocparams,"Doc Parameters w_output_param TYPE sfpoutputparams, "Output Parameters result TYPE sfpjoboutput. "Joboutput DATA : fm_name TYPE rs38l_fnam. "Function Module name * Determine print data, Data which will be displayed on the form SELECT * FROM sflight INTO TABLE it_sflight UP TO 20 ROWS. IF sy-subrc NE 0 . ENDIF. * Determine the function module which is generated at the runtime for * the pdf form used CALL FUNCTION 'FP_FUNCTION_MODULE_NAME' EXPORTING i_name = 'YDEMO_SUBFORMS' IMPORTING e_funcname = fm_name. * This function module is used to specify settings for the form output. * To specify whether you want the form to be printed, archived, or sent * back to the application program as a PDF. * The form output is controlled using the parameters (w_ouput_param) * with the type SFPOUTPUTPARAMS. CALL FUNCTION 'FP_JOB_OPEN' CHANGING ie_outputparams = w_output_param EXCEPTIONS cancel = 1 usage_error = 2 system_error = 3 internal_error = 4 OTHERS = 5. IF sy-subrc <> 0. MESSAGE ID sy-msgid TYPE sy-msgty NUMBER sy-msgno WITH sy-msgv1 sy-msgv2 sy-msgv3 sy-msgv4. ENDIF. * Set the language field the component of structure /1bcdwb/docparams w_doc_param-langu = 'EN'. * Call the function module and passing the form interface values CALL FUNCTION fm_name EXPORTING /1bcdwb/docparams = w_doc_param it_sflight = it_sflight * IMPORTING * /1BCDWB/FORMOUTPUT = EXCEPTIONS usage_error = 1 system_error = 2

internal_error = 3 OTHERS = 4 . IF sy-subrc <> 0. MESSAGE ID sy-msgid TYPE sy-msgty NUMBER sy-msgno WITH sy-msgv1 sy-msgv2 sy-msgv3 sy-msgv4. ENDIF. * To complete the processing of the form CALL FUNCTION 'FP_JOB_CLOSE' * IMPORTING * E_RESULT = result EXCEPTIONS usage_error = 1 system_error = 2 internal_error = 3 OTHERS = 4 . IF sy-subrc <> 0. MESSAGE ID sy-msgid TYPE sy-msgty NUMBER sy-msgno WITH sy-msgv1 sy-msgv2 sy-msgv3 sy-msgv4. ENDIF. Step17: Activating the report and executing it would pop a window.

Give the device name which is configured for ADS. Click on Print Preview to see the preview of the form. The form output Page 1:

Page2:

Using Where conditions to relate header and item tables in Adobe forms
By Jayachandra Nagaram, YASH Technologies In this demo we will create an Adobe form, which displays relating data from two tables (Header and Item) by using Where conditions in Form context. Step1: Go to transaction SFP and create interface for the form. In this demo we can use the interface YDEMO_ALTERNATIVE which is used in previous tutorial using alternatives. Step2: Create Form YDEMO_TABLELEVEL

Note: Maintain Interface type ABAP-Dictionary Base interface. (IN ECC6.0 Version) You will see two parts in screen Interface and context.

Step3: Drag and drop Global table GT_SPFLI from interface to context area.

Step4: Select all fields which are not required to display and deactivate the fields. (right click)

Step5: Select DATA under table GT_SPFLI and right click. Go to create--> Loop This will create a table i.e., a sub loop under the main loop. Note: when you drag a table in to context it will internally create a loop processing in the form.

Step6: A dialog box will open asking for table which you want to loop inside main loop.

Step7: Click the F4 help button, it shows the tables that exists in the interface.

Step8: Select the table GT_SFLIGHT (item details)

It will internally create a sub loop i.e, a table GT_SFLIGHT under the table SPFLI data. Step9: Select the fields which are not required to display and deactivate.

Step10: Double click table GT_SFLIGHT and go to the where conditions tab available in lower part of the window. Create the where condition for the table loop. This internally creates below code.

Loop at GT_SPFLI. Loop at GT_SFLIGHT where CARRID eq GT_SPFLI-CARRID and CONNID eq GT_SPFLI-CONNID. .............................. .............................. Endloop. Endloop. } -----> code processing

Step11: Go to Layout: in data view a nested loop (table) will be displayed. SFLIGHT under SPFLI. Create the boiler plate objects if needed.

Step12: Drag and drop all the fields under GT_SPFLI table into body page. Note: Do not drag the entire table into body page. We need to follow creating table using sub forms concept. Go to hierarchy view; Select all fields of spfli, Wrap the fields into sub form by right clicking. Again wrap the sub form in to another sub form. Sub form properties are maintained latter.

Step13: Drag and drop the fields from sflight into body page and create sub forms as showed in below snap. Keep note that the subforms created for sflight fields should be place inside the spflidata subform.

Maintain names as spflitable '-->spflidata '-->sflighttable ---> Sflightdata

Step14: Content of body page should be flowed.

Step15: Maintain the subforms properties as showed in the below snaps. Subform: spflitable

Subform: spflidata

Subform: sflighttable

Subform: sflightdata

Step16: Now your FORM is ready, check for syntax and activate it. Execute the form and follow the below to get the data in hierarchy level. Header and its corresponding item details.

Output: Page1

Page2

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 TYPE TYPE TYPE TYPE TYPE SCARR SCARR_TAB SPFLI SPFLI_TAB TYPE_FLIGHT

IT_FLIGHT

TYPE

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.

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 Area value 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.

Achieving Control Levels functionality in Adobe Forms


By Phani Diwakar Marepalli, YASH Technologies In this document we discuss the how to achieve the control levels in the Adobe Form (both using Table and Subform). Step1: Go to transaction SFP and create interface by providing interface name.

A pop up window appears where we need to provide the description of the interface and save it.

Step2: Define the user defined data types Types definition under Global Definitions as shown below.

Step3: Define Global data under Global Definitions,

Step4: In the code initialization,

Save and activate the interface. Come back to the initial screen of adobe form. Step5: Now create the form as shown below.

A pop up window would appear where we need to assign the interface name to form and also the description of the form. Press Save button.

The following screen appears.

In the above screen, we have internal table IT_VBAP under Global Data, which is under Interface. Context area is a bridge between Interface and form. Whatever the information (data) we need to place in the form is to be placed in the context area. Step6: Now drag and drop this internal table IT_VBAP into context area. Then only we can use the internal table in the form.

Provide the description of the internal table under properties tab below the context area. Step7: Now go to Control Levels tab as shown in above screenshot and provide the field name on which sort to be done. Control levels were introduced in SAP Net weaver 2004s.

Now the internal table splits into two parts where sorted fields are in one part and remaining all fields are grouped under GROUP internal table.

Step8: Drag the static text from the library into the form and provide the descriptions of the fields (Acts as a header). And also drag the internal table into the form (Here I deleted the default heading).

Save and activate the form. Step9: Execute the form. The output is as shown below:

We can also create the table using subforms if we need the output alignment differently. In the above scenario, we directly drag and dropped the internal table into the form. But in this scenario, we use subforms to achieve the same. Step10: Now, create a subform as shown below.

Renamed it as Body. Step11: From the Data View, drag and drop the fields individually into the form as shown below.

Step12: Wrap the field VBELN into the form as shown below.

And similarly wrap the remaining two fields into another subform DATA which intern wrap into the subform Group. The final view of the Hierarchy is as shown below.

All the pink shades are subforms.

Step13: Place the cursor on sub form Body and Go to palettes-- Object. There select Subform tab. Here, Initially Content is Position.

Change the Content field in the all sub forms Body, Vbeln, Data from Position to Flowed under subform tab as shown below.

Now, select the Binding tab. Here, Default binding is Normal for sub form Body But select the Default binding as shown.

Now, default binding for subform Body becomes as shown below:

And the binding of subform Vbeln is

The binding of the sub form Group is

The binding of the sub form Data is

The binding of field VBELN is

The binding of field POSNR is

Step14: The final layout looks as shown below

Step15: Execute the form, the output is

You can observe that there is no page header when there is a page overflow. Now let us extend the scenario to have the page header whenever there is a page overflow. Step16: We can achieve this as shown below. Place the cursor on the subform Body. Go to Palettes-Object.

Here, in the Pagination tab under Object, select Overflow leader as Header subform.

Activate the form. Step17: Execute the form and the output of the second page is as shown below.

Calculating Page-wise Sub-Totals and Grand Total in Adobe forms


By Nisrin Pindwarawala, YASH Technologies

This Tutorial focuses on how to calculate Page-wise Sub-Totals and Grand Total in Adobe forms using JavaScript. In this demo, we will work with table 'SFLIGHT' and calculate Sub-totals and Grand total for the field 'PRICE'. Step 1: Go to Transaction SFP and Create an Interface.

Step 2: Add the internal table it_sflight in global data

Step 3: In the Code Initialization part, fetch records from sflight into internal table it_sflight. SELECT * FROM SFLIGHT INTO TABLE IT_SFLIGHT UP TO 50 ROWS.

Step 4: Save and activate the interface. Step 5: Go to transaction SFP and create a form.

Step 6: In the context part of the form drag and drop the table sflight from global data of interface area to the context area and deactivate the field which we don't require in the layout.

Step 7: Create a table by drag n drop from library on to the layout. Include one header row and footer row in the table.

Enter the name of the field you want to display in the header row of the table.

Move the table fields from the table by drag n drop from Data View Palette on to the body row of the table, which we have created. In the footer row insert a text field in the last column from the library as shown below.

Step 8: Calculating Sub-Total for field price. Firstly enable JavaScript for the text field, which we created in footer row. We can achieve this by selecting, Select "Events with Scripts" in the Show drop down list Select "JavaScript" in the Language drop down list Run at: "Client" as shown below.

Write this code in the area provided under these selection boxes. var fields = xfa.layout.pageContent(xfa.layout.page(this)-1, "field", 0); var total = 0; for (var i=0; i <= fields.length-1; i++) { if (fields.item(i).name == "PRICE") { total = total + fields.item(i).rawValue; } } this.rawValue = total; Click Enter Script Source Changes + to add the script to your form.

The value tab of the text field has to be set as below.

Step 9: Calculating Grand Total. Group the elements of the body row, and then insert subform by right clicking on data.

Move the table under the subform and Insert a new subform with a text field under it.

After following these steps, From the drop down list "Show" select Calculate Enable FormCalc for the text field "Grand Total" as shown below.

Step 10: Code for Grand-Total Write the code under the area provided for the text field sum(Data.Table1.Group1.Row1[*].PRICE[*])

Click Enter Script Source Changes + to add the script to your form.

Step 11: Save and activate the form. Execute the form . The output appears like this: Page1:

Page2:

Including the Standard Texts (SO10) and any other Long Texts in the Adobe Forms
By Chandra Mohan Reddy Piminty, YASH Technologies

First Step: Creating the Interface (Ex: ZCHANDU) Transaction code SFP Creating an Import parameter VALUE of type ZTEST_S. Structure of ZTEST_S is in the next slide. Activate the Interface.

Second Step: Form Design Transaction code SFP Create a form (Ex: ZCHANDU) and provide the interface name created above Creating a Text node by right clicking on the top node ZCHANDU and then CREATE -> TEXT. In the properties of the TEXT node select Text type Include Text and then provide the Text Name, Text Object, Text ID and Text Language values as shown below. Drag the VALUE structure from the interface into the Context.

We can pass the Text node properties values dynamically as well. An example is shown below:

Next go to the Layout Tab: The Data view Palette screen shot is shown below.

Drag the TEXT node into the BODY subform at the desired location. The Hierarchy Palette and the Body pages screen shot is shown below.

Activate the Form. Testing: Provide the values for the structure VALUE as below.

Output:

The screen shot of the Standard text created in Transaction SO10 is as below:

Limitations of Include Texts in Adobe Forms:


If the values of the Text Symbols are coming into the Form in an internal table then we would not be able to use the Include text, as in Adobe Forms between the internal table name and the field names a DATA node is inserted due to the XML naming conventions and this DATA node is the one that creates the problem. Even though we have the table name and the field names same as in the Standard text, the error would be that the field is not found. The Text Symbols values must be coming from the Interface. If we are using Script (Formcalc or JavaScript) and filling the Field values, then those values would not be passed to the standard text, even though we have the calculated value in the Field and be able to print it.

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.

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' .

Printing Address using Business Address Services (BAS)


By Syed Abdul Adil, YASH Technologies

Instead of using custom tables for address information, many applications access Business Address Services (BAS). In the Business Address Services, addresses are identified by means of numbers. The addresses that you integrate in form's layout will be formatted in accordance with country-specific conventions. Step 1: Go to Transaction SFP and Create an Interface.

Step 2: Define Import parameter under Form Interface. IS_ADDRESS_TYPE TYPE IS_ADDRESS_NUMBER IS_PERSON_NUMBER IS_COUNTRY CHAR1 TYPE TYPE TYPE

ADRC-ADDRNUMBER ADRP-PERSNUMBER LAND1

Step 3: Save and activate the interface. Step 4: Now create the form as shown below. .

Step 5: A pop up window would appear where we need to assign the interface name to form and also the description of the form. Press Save button.

Step 6: In the context part of the form Create Address Node as shown below.

Step 7: Click on the Address node and set the properties as shown below.

Step 8: In the Layout part of the form, Drag and drop the Address Field.

Step 9: Set the Object properties of Address text field as shown below.

Step 10: Set the Border properties of Address text field as shown below.

Step 11: Drag the static text from the library into the form and provide the descriptions of the fields.

Step 12: Save and activate the form. Step13: Test form, by entering Address type, Address Number and Sending Country. Note: Person Number is optional; it is applicable for Address type 2 and 3.

Step 14: Execute the form. The output is as shown below:

Printing Address without using Business Address Services (BAS)


By Syed Abdul Adil, YASH Technologies If our application makes no use of the Business Address Services but you still want to have country-specific addresses, we must use ABAP coding to achieve this. It is possible to do this in the application program or in the initialization coding of the interface. Step 1: Go to Transaction SFP and Create an Interface.

Step 2: Define Import parameter under Form Interface. IS_CUSTOMER_ID TYPE IS_COUNTRY S_CUSTOMER TYPE LAND1

Step 3: Define Global Types under Global definition as shown below. TYPES: BEGIN OF ty_adr_printform_table_line, line_type TYPE ad_line_tp, address_line LIKE adrs-line0, END OF ty_adr_printform_table_line. TYPES: ty_adr_printform_table TYPE TABLE OF ty_adr_printform_table_line.

Step 4: Define Global Work Areas and Internal Tables under Global definition as shown below. IS_ADDRESS IT_ADDRESS_LINES IS_ADDRESS_LINE TYPE IS_SCUSTOM TYPE ADRS1. TYPE TY_ADR_PRINTFORM_TABLE. TY_ADR_PRINTFORM_TABLE_LINE. TYPE SCUSTOM.

Step 5: Write the below code in code initialization part. Check for errors and activate the interface. SELECT SINGLE * FROM scustom INTO is_scustom WHERE id EQ is_customer_id. is_address-title_text = is_scustom-form. is_address-name1 = is_scustom-name. is_address-street = is_scustom-street. is_address-po_box = is_scustom-postbox. is_address-post_code1 = is_scustom-postcode. is_address-city1 = is_scustom-city. is_address-region = is_scustom-region. is_address-country = is_scustom-country.

* Address Format According to Post Office Guidelines * Note : Refer Function module documentation for more information. CALL FUNCTION 'ADDRESS_INTO_PRINTFORM' EXPORTING address_1 = is_address address_type = '1' "normal/company sender_country = is_country number_of_lines = 8 IMPORTING address_printform_table = it_address_lines.

Step 6: Save and activate the interface. Step 7: Now create the form as shown below.

Step 8: A pop up window would appear where we need to assign the interface name to form and also the description of the form. Press Save button.

Step 9: 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.

Step 10: In the Layout part of the form, Drag and drop the Address Field.

Step 11: Drag the static text from the library into the form and provide the descriptions of the fields.

Step 12: Set the Border properties of Address text field as shown below.

Step 13: Set the Object properties of Address text field as shown below.

Step 14: Wrap the address field into Subform as shown below.

Step 15: Set Body page Object properties as shown below.

Step 16: Set Subform Object properties as shown below.

Step 17: Set Subform Object properties as shown below.

Step 18: Save and activate the form. Step 19: Test form, by entering Customer id and Country.

Step 20: Execute the form. The output is as shown below:

Configuring the Adobe Forms / Smart forms / SAP Script to the output type in NACE
By Nikunj Shah, YASH Technologies Go to transaction NACE. Choose the required application from the list and click on output types.

Chose one of the Output types from the right pane and click on processing routines.

Following screen appears:

If an SAP Script to be attached, fill-in the driver program name, Form routine and SAP Script name in the field Form (shown below)

If an Smart Form / Adobe Form are to be attached, enter the form nam e in the field PDF/SmartForm Form and select one of the types PDF or SmartForm. (See the screenshot below)

Demo scenario on Adobe Interactive Forms using ABAP WebDynpro Part1


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

package

to

the

application

or

save

as

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.

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

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 cl ick 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.

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

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

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 Node_Zdept Elem_Zdept Stru_Zdept

type ref to If_Wd_Context_Node, type ref to If_Wd_Context_Node, type ref to If_Wd_Context_Element, 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

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: Tools Internet 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.

Demo scenario on Adobe Forms using ABAP WebDynpro - Part 2


By G.K.Akbar, The Washington Post In the earlier example, we have created a WebDynpro application to populate the data into the custom table ZDEPT. In this, we would display the data from the ZDEPT using ABAP WebDynpro.

Following are the contents of the table:

Create a table type ZDEPTTBL for table ZDEPT

Go to transaction SFP and create a from interface ZDEPTINF as shown below

Select the Interface type as ABAP Dictionary-Based Interface, this time we are not going to use the XML schema based interface, this is to demonstrate that we can make use of any of the existing forms inside the Web Dynpro.

Save the Interface

Create Transport for the Interface

Enter the Import parameter ZDEPT and type ZDEPTTBL. Save and activate the interface

Create the form ZDEPFRM

Enter the Interface Name as ZDEPTINF

Save the form

Drag and drop the Node ZDEPT onto the context

Go to the Layout tab and Drag & Drop the ZDEPT node on to the form layout, Save and Activate the form

You can also create a Report program (Print Program) and call the above mentioned form, but we are going to write the print program logic in the Web Dynpro. Go to transaction SE80 and create a Web Dynpro component Z_NON_INT_FRM.

Press Yes to create the object

Enter the details as show below and press enter

Save and enter a workbench request

You can see the Component Controller, Interface controller and window being created

Create a view as shown below:

Give the Name of the View as MAIN_VIEW

Go to the layout tab of the MAIN_VIEW and create a place holder for the adobe form as shown below

Give the name of the node as adobe and type Interactive form

In the properties list set the Height and width and the template source as ZDEPFRM this is the actual name of the adobe form which we have created earlier, you can see the interface context is automatically mapped to the data source.

You can see the mapped data source in the context tab of the MAIN_VIEW

Go to the Methods table of the MAIN_VIEW and double click on the WDDOINIT method,

We are going to write the print programs logic in this method, we are not going to use the standard function modules that we use normally in the Report print program such as FP_JOB_OPEN, FP_FUNCTION_MODULE_NAME, FP_JOB_CLOSE.

Copy and Paste the below given code in the method.

method WDDOINIT . data: Node_Zdepfrm type ref to If_Wd_Context_Node, Elem_Zdepfrm type ref to If_Wd_Context_Element, Stru_Zdepfrm type If_Main_View=>Element_Zdepfrm , Item_ZDEPT like Stru_Zdepfrm-ZDEPT, i_dept type zdepttbl. * navigate from <CONTEXT> to <ZDEPFRM> via lead selection Node_Zdepfrm = wd_Context->get_Child_Node ( Name = IF_MAIN_VIEW=>wdctx_Zdepfrm ). * @TODO handle not set lead selection if ( Node_Zdepfrm is initial ). endif. * get element via lead selection Elem_Zdepfrm = Node_Zdepfrm->get_Element( ). * @TODO handle not set lead selection if ( Elem_Zdepfrm is initial ). Elem_Zdepfrm = Node_Zdepfrm->create_element( ). endif. select * from zdept into table i_dept. Item_Zdept = i_dept. * get single attribute Elem_Zdepfrm->set_Attribute( exporting Value = Item_Zdept Name = `ZDEPT` ). Node_Zdepfrm->bind_element( Elem_Zdepfrm ). endmethod. Go to the window Z_NON_INT_FRM and select the window tab as shown below

Drag and Drop the MAIN_VIEW on to the window

Save and activate the Web Dynpro

...Previous

Create a Web Dynpro application as show below

Enter the name of the application Z_NON_INT_FRM and save the application

Test the Web Dynpro application

Logon with you credentials enter the username and password.

You can see the output in the form below.

Printing labels using Adobe Forms


By Sri lakshmi Lavanya Koduganti, CSC India Go to transaction SFP. Create an interface

Save it. Go to Import parameters, click on create.

Enter the following details

Double click on TYPES. Enter the following code. types: begin of ty_vbak, vbeln type vbak-vbeln, audat type vbak-audat, vbtyp type vbak-vbtyp, auart type vbak-auart, end of ty_vbak, t_vbak type table of ty_vbak.

Now go to GLOBAL DATA and click on create. Enter the following values.

Now go to INITIALIZATION and enter the following code.

Activate the interface. Now go and create a form.

Enter the interface name and press SAVE.

Drag and drop GT_VBAK into Context .

Go to Layout tab. It appears as follows.

Drag and drop Content area from Library into the layout. Name it as Cont1

Go to Master Page tab and reduce the size of the Content Area.

Drag and Drop all the fields from GT_VBAK into the Design vew..

Create 3 more Content areas as below and name them as Cont2,Cont3 and Cont4.

Select all the fields from GT_VBAK and wrap them in a subform.

Name them as Subform1 and Subform2.

Select Subform1 and goto Palettes->Object. Make the content as Flowed.

Go to Binding tab and select the check Box Repeat Subform.

Go to the Pagination Tab. Select After Go to Next Content Area.

Save and Activate the form.Execute the form for the following Sales orders. 4969

4970 4971 4972 4973 The output appears as below. Page1

Page 2

Migrating SAP Smart forms to Adobe Forms


By Phani Diwakar, YASH Technologies This document gives an idea about migration of a smart form to an interactive form. Step1: Go to transaction code SMARTFORMS and select the smart form to be converted into print adobe form.

Here the form name is ZTEST1. Step2: Go to the next screen by clicking display button.

A text element and table are defined in this existing smart form. Step3: Output of the smart form ZTEST1 is:

Step4: Now go to Utilities-Migration--Interactive Form-Export in the initial screen of the smart form as shown below.

You will get popup. Step5: Provide form name and interface name and click enter.

Step6: You will get settings window as shown below.

Select the necessary check boxes.

Select OK button. It asks for package and provides the package. Save it. Step7: Now go adobe form initial screen. Provide the interface name as mentioned above.

Step8: Go to properties tab. You get the default interface type is Smart forms-Compatible Interface as shown.

Activate the interface and come out to initial screen. Step9: Now provide the form name mentioned above in the initial screen.

Step10: Click on change button and following screen appears.

Delete the unnecessary empty folder from the context menu. Now,

Step11: Go to layout tab,

Step12: Now go to properties tab,

When you try to activate the form, it gives some error message as Unknown Layout Type. Change the layout type to Standard Layout as shown.

Activate the form and execute it Step13: The output would be

Using Multiple Master and Body pages in the SAP Adobe Forms
By Phani Diwakar M, YASH Technologies In general, the boiler plate objects placed on the master page will reflect in all remaining pages. Now consider the scenario where the boiler plate objects placed on the master page reflects only on first page but not on the subsequent pages. We can achieve the above scenario by creating another master page and body page. This document shows the steps to achieve the same. Step1: Go to SFP transaction to create adobe form. Provide the interface name and click on create button.

Provide the description. Step2: Define the carrid in IMPORT parameters of form interface.

Step3: Now go to TYPES options in the GLABAL DEFINITION to define user define declarations.

Step4: Now go to Global Data,

Step5: In Code Initialization,

Save and activate the interface. Come back to initial screen of adobe form. Step6: Provide the form name and give the interface face name and description in the appearing subsequent dialog box.

Press save button. Step7: Drag and drop the IMPORT parameter carrid and GLOBAL DATA parameter t_sflight to context.

Step8: Now go to Layout tab, In master page, drag the content area little bit down from the top to place logo and import parameter carrid. Also resize the content area as shown below.

Step9: Drag and drop the internal table into body page as shown below.

Step10: Now rename the Untitled Sub Form to Bodypage1 and make the sub form type asflowed as shown.

Active the form and when execute at this point of time, you would observe logo and carrid on every page of output as shown.

And also in all remaining 3 pages logo and carrid is printed. But our objective of this document is of restricting these TWO, carrid and logo. For that, proceed as follows Step11: To create new master page, right click on page1 and select New Master Page as shown.

Step12: New master page is created.

Step13: Now create new body page. Right click on Bodypage1 and select New Body Page.

Rename it to Bodypage2.

Step14: Drag and drop the internal table into Bodypage2. Step15: Now place the cursor at Bodypage1 and go to object palette. Go to pagination tab.

Now select Page1 in place of Following Pervious as shown below.

And also, select the Page2 instead of None in the Overflow column.

Step16: Now, select Bodypage2. Go to pagination tab in the object palette. Select Page2 in place of Following Pervious as shown below

Step17: Change the sub form type for Bodypage2 as Flowed. Step17: Activate it and execute the form. The output would be

Now from the second page onwards, we dont get the logo and carrid. We get these only on first page.

Sending an SAP Adobe form as an attachment in an email


By Phani Diwakar, YASH Technologies

Consider the offline scenario where the candidate gets the appointment letter along with personnel information form as an attachment to his/her email after he/she has been completed final round of interview. He/She fills the form and sends it back. The data from the PDF is then retrieved and updated in SAP by HR. For this we dont require Web Dynpro Development. In this document we discuss how to send PDF file as an E-mail attachment to respective candidate. Step1: Go to transaction SFP to create form interface. Provide the interface name ZPERSONNEL_INT.

Click on create button and provide the description.

Click on Save. Provide the package name in the following screen and press enter. Step2: Define the IMPORT parameter as shown.

Now save and active the interface. Come back to initial screen of form.

Step3: Now create form. Provide the form name ZPERSONNEL.

Click on create button and provide the description and interface name.

Click on save and provide the package. Step4: Drag the IMPORT parameter EMP_INFO from interface to context tab.

Step5: Now go to layout tab. Drag the drop the each field from data view to layout editor as shown.

Save and activate it. We can provide the tool tip text using Accessibility tab as shown.

Step6: Now create an ABAP program which will create a form and email to selected candidate so that it can be filled offline. (Click here for the program used for this demo purpose) The program will have the following steps A. Obtain the name of the generated function module of the form using FP_FUNCTION_MODULE_NAME by pass the form name to it. B. Set the output parameter and open the spool job. Fill the value X to NODIALOG andGETPDF parameter of the structure SFPOUTPUTPARAMS. Pass this structure to function module FP_JOB_OPEN C. Call the generated function module. Pass the value X to parameter FILLABLE of the structure SFPDOCPARAMS (Form parameters for Form Processing) which is standard

parameter. By default this FILLABLE parameter is assigned with space. When X is passing to this parameter then form acts as interactive form, otherwise it is print form. D. Now the PDF file generated is available in the parameter PDF of structure/1BCDWB/FORMOUTPUT. Convert the generated PDF file data to binary format using the function module SCMS_XSTRING_TO_BINARY. E. Send this form to mail as a PDF attachment using Business Communication Service (BCS). Step7: Now execute the ABAP program.

Click on OK button. Now check the email.

Sending Adobe forms as PDF attachment using Email Submit Button


By Siddharth Samal, Capgemini Canada Prerequisite: It is assumed that the reader of this article has basic knowledge in WebDynpro and adobe forms. Requirement:

The Requirement is to send the adobe forms as a PDF attachment using the standard button Email Submit Button. The standard property of the button is to send the attachment as XML. Procedure: We have to alert the xml coding of the ADS to achieve this requirement. 1. Create a WebDynpro Component in SE80

2.

Go to the Context Tab of the View V_SENDEMAIL_DEMO

3.

Create a NODE with LFA1 as DDIC Reference

4.

Select the Attributes for the Node LFA1

5.

Create an Attribute as PDFSOURCE

6.

The Context of the View would look as below.

7. Create an Element Interactive Form by Drag Drop in the Layout tab

8.

The Property of the Interactive FORM would be as shown below.

9.

Create a Template source as below

10. Design the Form as required.

11. Drag and Drop the Button Email Submit Button from Object Library

12. Give the Email Address & Subject as required

13. Right Click on the Toll bar of the Form Designer as shown below and select XML Source

14. CLT + F on the XML Source Code and search for Format

Change XML to PDF in double quotes as shown below.

16. Create a Web Dynpro Application

17. Give a Description for the application

18. Test the Application

19. The Adobe would be as below and click on the Button.

20. A pop up would be generated as below

21. The Mail would be configured and the attachment would be in PDF not XML

Uploading a PDF file in an Adobe Form offline scenario


By Phani Diwakar, YASH Technologies This document provides the idea of how to upload the PDF file data into SAP. This document is extension to document how to send the PDF file as an attachment in interactive offline scenario. Once the selected candidate fills the personnel information form and sends it back to HR, they update the data in SAP. To extract the data from the PDF file we should do the following steps. 1. 2. Upload the PDF file using Function Module GUI_UPLOAD Instantiate the PDF object and assign the PDF file to this PDF object Get the reference to form processing (FP) class using the interface IF_FP. Get the reference of PDF object class using interface IF_FP_PDF_OBJECT.

Create the PDF object using the method CREATE_PDF_OBJECT defined in the interface IF_FP Set our PDF in the created PDF object using method SET_DOCUMENT of the interface IF_FP_PDF_OBJECT.
Extract the data from PDF object using the method SET_EXTRACTDATA of the interface IF_FP_PDF_OBJECT. Call the Adobe Document Service (ADS) using the method EXECUTE defined in the interface IF_FP_PDF_OBJECT.

3.

Extract the data from PDF Object by method called GET_DATA defined in the interface IF_FP_PDF_OBJECT. The extracted data is in XML format. We have to convert XML data to ABAP internal table using the Function Module SMUM_XML_PARSE.

4.

Write the following code: REPORT zpersonnel_02. SELECTION-SCREEN BEGIN OF BLOCK b1. PARAMETERS: p_file LIKE rlgrap-filename " File path OBLIGATORY. SELECTION-SCREEN END OF BLOCK b1. DATA: w_filename TYPE string, " File name w_length TYPE i, lt_file_table TYPE filetable, lv_filelength TYPE i, lv_rc TYPE i, lv_filename TYPE string, w_pdf_data TYPE xstring, lt_rawtab TYPE TABLE OF char255, w_pdf_file TYPE string, * Create PDF Object using destination 'ADS' (<-- this is how it is * defined in SM59)

lo_pdfobj TYPE REF TO if_fp_pdf_object VALUE IS INITIAL, xslt_message TYPE string, exc TYPE REF TO cx_root, fs_per_info TYPE ZWD_PER_INFO. AT SELECTION-SCREEN ON VALUE-REQUEST FOR p_file. PERFORM f4_help_for_file. START-OF-SELECTION. PERFORM get_pdf_data. PERFORM get_pdf_instantiate. PERFORM extract_data. *&----------------------------------------------------------------* *& Form F4_HELP_FOR_FILE *&----------------------------------------------------------------* FORM f4_help_for_file . CALL METHOD cl_gui_frontend_services=>file_open_dialog CHANGING file_table = lt_file_table rc = lv_rc * USER_ACTION = * FILE_ENCODING = EXCEPTIONS file_open_dialog_failed = 1 cntl_error = 2 error_no_gui = 3 not_supported_by_gui = 4 OTHERS = 5. IF sy-subrc <> 0. * MESSAGE ID SY-MSGID TYPE SY-MSGTY NUMBER SY-MSGNO * WITH SY-MSGV1 SY-MSGV2 SY-MSGV3 SY-MSGV4. ENDIF. * READ TABLE lt_file_table * INTO lv_filename * INDEX 1. READ TABLE lt_file_table INTO p_file INDEX 1. IF sy-subrc EQ 0. lv_filename = p_file. ENDIF. cl_gui_frontend_services=>gui_upload( EXPORTING filename = lv_filename filetype = 'BIN' "Binary IMPORTING filelength = lv_filelength CHANGING data_tab = lt_rawtab EXCEPTIONS file_open_error = 1 file_read_error = 2 no_batch = 3 gui_refuse_filetransfer = 4 invalid_type = 5 no_authority = 6 unknown_error = 7 bad_data_format = 8 header_not_allowed = 9

separator_not_allowed = 10 header_too_long = 11 unknown_dp_error = 12 access_denied = 13 dp_out_of_memory = 14 disk_full = 15 dp_timeout = 16 not_supported_by_gui = 17 error_no_gui = 18 OTHERS = 19 ). ENDFORM. " F4_HELP_FOR_FILE *&----------------------------------------------------------------* *& Form GET_PDF_INSTANTIATE *&----------------------------------------------------------------* form GET_PDF_INSTANTIATE . * Get FP reference DATA: lo_fp TYPE REF TO if_fp VALUE IS INITIAL. lo_fp = cl_fp=>get_reference( ). * For handling exceptions DATA: lo_fpex TYPE REF TO cx_fp_runtime VALUE IS INITIAL. TRY. lo_pdfobj = lo_fp->create_pdf_object( connection = 'ADS' ). * Set document lo_pdfobj->set_document( EXPORTING pdfdata = w_pdf_data ). * Tell PDF object to extract data lo_pdfobj->set_extractdata( ). * Execute the call to ADS lo_pdfobj->execute( ). CATCH cx_fp_runtime_system INTO exc. xslt_message = exc->get_text( ). ENDTRY. endform. " GET_PDF_INSTANTIATE *&----------------------------------------------------------------* *& Form EXTRACT_DATA *&----------------------------------------------------------------* form EXTRACT_DATA . DATA: xml_data TYPE xstring, t_return type standard table of bapiret2, t_per_info type standard table of smum_xmltb, lfs_per_info type smum_xmltb. lo_pdfobj->get_data( IMPORTING formdata = xml_data ). CALL FUNCTION 'SMUM_XML_PARSE' EXPORTING xml_input = xml_data tables xml_table = t_per_info return = t_return . LOOP AT t_per_info INTO lfs_per_info. CASE lfs_per_info-cname. WHEN 'FNAME'. fs_per_info-FNAME = lfs_per_info-cvalue.

WHEN 'LNAME'. fs_per_info-lname = lfs_per_info-cvalue. WHEN 'DOB'. REPLACE ALL OCCURRENCES OF '-' IN lfs_per_info-cvalue WITH space. CONDENSE lfs_per_info-cvalue. fs_per_info-DOB = lfs_per_info-cvalue. WHEN 'TEXP'. fs_per_info-TEXP = lfs_per_info-cvalue. WHEN 'CEMPLOYER'. fs_per_info-CEMPLOYER = lfs_per_info-cvalue. WHEN 'CSALARY'. fs_per_info-CSALARY = lfs_per_info-cvalue. WHEN 'ESALARY'. fs_per_info-ESALARY = lfs_per_info-cvalue. WHEN OTHERS. ENDCASE. ENDLOOP. fs_per_info-WAERS = 'INR'. INSERT INTO ZWD_PER_INFO VALUES fs_per_info. endform. " EXTRACT_DATA *&----------------------------------------------------------------* *& Form GET_PDF_DATA *&----------------------------------------------------------------* form GET_PDF_DATA . CALL FUNCTION 'SCMS_BINARY_TO_XSTRING' EXPORTING input_length = lv_filelength * FIRST_LINE = 0 * LAST_LINE = 0 IMPORTING BUFFER = w_pdf_data tables binary_tab = lt_rawtab * EXCEPTIONS * FAILED = 1 * OTHERS = 2 . IF sy-subrc <> 0. * MESSAGE ID SY-MSGID TYPE SY-MSGTY NUMBER SY-MSGNO * WITH SY-MSGV1 SY-MSGV2 SY-MSGV3 SY-MSGV4. ENDIF. endform. " GET_PDF_DATA Now execute the program.

Upload the PDF file.

Press execute button. Now the data will be stored in database table.

Note: Create table with above structure.

Offline scenario to download an Adobe Form using Web Dynpro for ABAP
By Phani Diwakar MV, YASH Technologies This is the offline interactive scenario where in user downloads the file from the browser and save it on desk top. After the filling the form by user then that form will be uploaded into SAP. Now here we will see how to download the file from the browser. To upload the filled-in PDF file, click here. Step1: Go to SE80 and create Web Dynpro component ZDOWNLOAD_FORM as shown.

Press enter. Then following screen will appear.

Press Yes and provide the description.

Step2: Now go to context tab in Main view. Create attribute PDF_SOURCE of type XSTRING as shown below.

Step3: Select Insert element from ROOTUIELEMENTCONTAINER.

Select the element FileDownload as shown.

Click on Enter. Step4: Now in the FileDownload properties window,

Map the DATA property as shown below. Click on create binding tab against DATA property.

Select PDF_SOURCE from the CONTEXT. Step5: Provide the filename which is either already exists in the MIME repository or place the file in the MIME repository which you want to be down loaded. Placing the file in the MIME repository: Select the MIME repository tab in the transaction SE80.

In SAP folder, select the folder WDR_TEST_ADOBE and place the file as shown below.

The following screen will appears. Select the file from desk top that you want to be down loaded from browser.

Click on Open button. The following screen will appear.

Provide the description and save it.

Offline scenario to upload a filled-in adobe form using Web Dynpro for ABAP
By Phani Diwakar MV, YASH Technologies The requirement is to upload the filled PDF data file into SAP from browser. FILE UPLOAD element is used in Web Dynro to upload the file. This document is extension to how to down the file from the browser. Step1: Go to SE80 and create Web Dynpro component ZUPLOAD_FORM as shown.

Press enter. Then following screen will appear.

Press Yes and provide the description.

Step2: Now go to context tab in Main view. Create attribute PDF_SOURCE of type XSTRING as shown below.

Step3: Select Insert element from ROOTUIELEMENTCONTAINER.

Select the element FileUpload as shown.

Click on Enter. And also create button. The properties of the buttons are as shown below.

Step4: Now select the binding tab against DATA property of the FileUpload element. Bind this DATA property with PDF_SOURCE attribute defined in context. The property tab of the FileUpload is as shown below.

Step5: Go to Method tab, Click on the method ONACTIONUPLOAD from the METHOD tab or double click on Action property UPLOAD defined in the button property which takes you to the method ONACTIONUPLOAD. Enter the code provided here. Step6: Create the Web Dynpro application and execute it.

Browse the file and click on upload button. If you check the data base, the PDF data is uploaded into database table.

The screen shot of the Web Dynpro component is

Using Web Services in Adobe Forms


By ArunKumar.C & Gurunath.P, Kaavian Systems Scenario: Fetching the Material Description for a Material in Adobe Form using Web Service. Consider a Scenario User enters a Material Number in a Adobe Form and the Material Description has to be fetched from the Material master table , for this we use web service to fetch the description. I. Create a Web Service: Step 1: we need to create a Remote enable function module

Step 2 : Define one Import parameter material number(MATNR) and Two Export parameter material Description (MAKTX) and BAPIRETURN (Mandatory)

Step 3: Write the code for to fetch the material description in source code.

Then activate and check the function module Step 4: Goto the Utilities->More utilities->Create web service->From the function module

Step 5: A Web Service Wizard will be displayed Give the Service name and Description Press continue

Press continue

Press continue ..Previous

Check local object or package name Press continue

Press complete

Step 6: Now go to Transaction SOAMANAGER

The browser will start Go to Tab Business Administration ->Web Service Administration

To find your web service, type your Service name in the Search Pattern and then select your service then click

Step 7: Click Open WSDL Document for selected binding

A Window opens with XML code Copy the URL, This URL is the generated WSDL Link.

Step 1 : Then go to the transaction SFP and create a empty interface then create a form Go to the layout tab Edit ->New data connections

Enter a New Data Connection Name Select WSDL File and click next

Paste your URL and press next

Step 2: Select your web service and press finish The web service is added to the form. Step 3: In layout to create a new button and change its control type to Execute

In execute tab select your Data connection name

Step 4: Drag and drop the MATNR and MAKTX fields to the Form.

Activate the form Step 5: Create a print program for the form. In the '####' place, enter your form name data: ie_outputparams type sfpoutputparams. data: i_name type fpname, i_funcname type funcname. data: fp_docparams type sfpdocparams. data: fp_formoutput type fpformoutput. data: data_tab type SOLIX_TAB. ie_outputparams-getpdf = 'X'. ie_outputparams-nodialog = 'X'. " suppress printer dialog popup call function 'FP_JOB_OPEN' changing ie_outputparams = ie_outputparams. try. i_name = '######################'. "Your Form Name call function 'FP_FUNCTION_MODULE_NAME' exporting i_name = i_name

importing e_funcname = i_funcname. catch cx_fp_api_repository. catch cx_fp_api_usage. catch cx_fp_api_internal. endtry. fp_docparams-langu = 'E'. fp_docparams-country = 'US'. fp_docparams-FILLABLE = 'X'. call function i_funcname exporting /1bcdwb/docparams = fp_docparams importing /1bcdwb/formoutput = fp_formoutput exceptions usage_error = 1 system_error = 2 internal_error = 3. call function 'FP_JOB_CLOSE' exceptions usage_error = 1 system_error = 2 internal_error = 3 others = 4. data: filename type string, path type string, fullpath type string, default_extension type string value 'PDF'. cl_gui_frontend_services=>file_save_dialog( exporting default_extension = default_extension changing filename = filename path = path fullpath = fullpath ). check fullpath is not initial. call function 'SCMS_XSTRING_TO_BINARY' exporting buffer = fp_formoutput-pdf tables binary_tab = data_tab. cl_gui_frontend_services=>gui_download( exporting filename = filename filetype = 'BIN' changing data_tab = data_tab ). cl_gui_frontend_services=>execute( exporting document = filename ). Output: Step 6: Run the print program and then save the pdf form in your drive or desktop, then open the form using the Adobe Reader (7.0 or above).

Give the material number and press description Button; it fetches the description of the Material entered.

Achieving Conditional-breaks in Adobe Forms


By Phani Diwakar Marepalli, YASH Technologies This is one of the scenarios where we need to trigger page breaks based on some condition. For example, we need to trigger page break for each change of CONNID. For that we use CONDITIONAL BREAKS in PAGINATION of OBJECT palette. Step1: Create interface ZTEST_CONDITION_INTERFACE using the transaction SFP. Step2: Now define global parameter as shown.

In Code Initialization, write the following code.

Save and activate the interface. Step3: Come back to initial screen of Form builder and create form ZTEST_CONDITION_FORM. Step4: In layout tab, Drag and drop the internal table to layout editor. Change the body page Body from position to flow as shown.

Step5: Now go to DATA-- Object -- Pagination

Click on Edit button. It opens a window as shown below.

Now click on plus button.

Now click on Insert Sample Expression button as shown above with pink color, it shows fields.

Select CONNID field then the following code would be appearing on the space provided on the text editor automatically.

Now select the radio button before and for To field select TOP OF NEXT PAGE.

Click on OK button. Save and activate the form. Step6: Execute the form.

Adobe Forms Online Scenario - Travel Request Form


By Phani Diwakar Marepalli, YASH Technologies This document discusses how to create online interactive travel request form. The lay out of the travel request would be in the given format.

1.

The values in the drop down list for department are SAP Java Oracle Apps

2.

The values in the drop down list for destination country are

US UK India

Step1: Go to the t-code SE80 to create Web Dynpro application. Provide the web dynpro component name as ZTEST_TRAVEL_REQUEST.

Press enter. The following screen appears.

Click on Yes to create component and provide the description for the component. Step2: Now go to view--Context where define the node as shown below.

Provide the name of node is ADOBE.

Create sub node TRAVEL as shown below.

Select Add Attribute from Structure. Note: Create the table ZWD_TRAVEL with the following structure bef ore creating webdynpro component.

Now travel node contains the following fields,

Step3: Create pdf_source attribute of type XSTRING that holds the PDF document.

Step4: Now go to Layout tab. Insert Element by right click on ROOTUIELEMENTCONTAINER.

Select INTERACTIVE FORM as shown below.

Click on Ok button. Now the layout looks like this.

Step5: Click on pdfSource property as shown in the Interactive form properties tab as shown below.

A popup will appear where you select PDF_SOURCE.

Step6: Provide template source name ZTRAVEL_REQUEST_FORM.

Now double click on it then the following popup will appears. Provide the interface name and click on CONTEXT button to bind the node ADOBE to form.

The following popup will appears. Select ADOBE node and click on OK button.

Then press Yes.

Now adobe form screen would appear. The fields defined in the node TRAVEL is mapped to Data View of the layout. Drag and drop the every field onto the BODY PAGE.

Now we need to make the field DEPARTMENT as drop down list box. For that we need to change the field type from TEXT FIELD to DROP DOWN LIST BOX as shown below.

Now click the + button as shown above and add texts.

Now go to BINDING tab,

Select the check box Specify Item Values. Initially it is unchecked. After checking the check box then it shows values and corresponding texts as shown above. Change the values from 0, 1, and 2 to corresponding text as shown below.

Step7: Drag the static text and write Travel by text in it. Now drag and drop the radio button from LIBRARY as shown below.

Rename the Radio Button to Private Car and press enter. Then

Again drag and drop the radio button from LIBRARY.

Again rename the Radio Button to Company Car and press enter. Then

Repeat the same process for remaining 3 radio buttons. Now go to binding tab,

Now, change the values from 1, 2, 3, 4 and 5 to corresponding text as shown.

Step7: Now go to properties tab,

Change the layout type UNKNOW LAYOUT TYPE to ZCI LAYOUT as shown below.

Step8: Now activate both the form and interface. Step9: Now come back to Web dynpro application.

Now click on create button. Provide the action name and description.

Now double click on SAVE. The following screen appears.

Step10: Now go to Web dynpro code wizard (

). Select the node ADOBE.

And press enter. The following code will be generated.

Save and active the component. Step11: Create the Web dynpro application as shown below.

Give the description and save the application. Step12: Now execute the application.

Enter the details.

Press Save button. You get the successful message after the record is inserted in the data base.

Check the data in the table.

Steps for creating a Web Dynpro Component for Adobe interactive Forms using the Enumerated Drop Down Box(Web Dynpro for ABAP)
By Vani Prasanna M, TCS

1.

Go to transaction SE80 and create a web Dynpro component.

2.

Enter the View Name , Main_View in the pop up window and press Enter .

3.

Assign a package and save it.

4.

Go to context tab of the Main view and create an empty node.

5.

Give the name ROOT_NODE to the node and press Enter .

6.

Create Attribute ZUSER under node ROOT_NODE .

7.

Create an attribute under the Root_Node.

8.

Give the Attribute name as PDF_SOURCE and Type as XSTRING . At the time of form submit, the form is stored in PdfSource in Binary mode. So, when once user fills the form and submits it, the same form will be generated with data.

9.

Create an attribute under the Root_Node.

10. Give the name ZUSERNAME to the node and press Enter .

11. Save and Activate the web Dynpro component.

12. Go to Layout tab of MAIN_VIEW and right click on ROOTUIELEMENTCONTAINER to insert element.

13. Enter the details in the pop up window. Give the name of the element , zuser_element' and select the Type as Interactive Form.

14. Enabled field is a required entry for an Interactive form.

15. Click the button in the property list for the property dataSource and select the node ZROOTNODE from the context window .

16. Click the button in the property list for the property pdfSource and select the node PDF_SOURCE from the context window. Click the button in the property list for the property pdfSource and select the node PDF_SOURCE from the context window.

17. For the property templateSource give the name of the adobe form ZDDLB_DEMO_FORM in the value tab . Double click on the adobe form name. Enter the Interface name ZDDLB_DEMO_INF and click on context button to create interface from context node .

18. Select the node ROOT_NODE from the context window and press Enter .

19. Save the Form and Interface .

20. Save the Main_View.

21. The elements in form context can be seen in the Data view of the form Layout .

22. Drag and drop the Enumerated Drop Down List button from WebDynpro Native category under Library palette.Drag and drop the ZUSER node on the list box. Dont Update any related Properties.

23. Drag and drop the Submit button from WebDynpro Native category under Library palette.

24. Select the event click* and language JavaScript .

25. Change the form layout type to ZCI layout in the properties tab of the form builder.

26. Insert the Webdynpro Script.

27. Drag and drop the Text Box from WebDynpro Native category under Library palette.

28. Bind the Text Box with the element ZuserSelected.

29. Save and activate both form and interface

30. In the property list under Events, click on the create button for the event onSubmit and create an action CLICKME

31. Go to the Actions tab of MAIN_VIEW. Action CLICKME will appear.

32. Copy Paste the code in the method ONACTIONCLICKME. data lo_nd_root_node type ref to if_wd_context_node. data lo_el_root_node type ref to if_wd_context_element. data ls_root_node type wd_this->element_root_node. data lv_zuser type wd_this->element_root_node-zuser. DATA: NODE_INFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO, it_dropdown TYPE WDR_CONTEXT_ATTR_VALUE_LIST, WA type WDR_CONTEXT_ATTR_VALUE, * wa_zpsfins02 type zpsfins02, IT_ZPSCAT type STANDARD TABLE OF USER_ADDR , WA_ZPSCAT type USER_ADDR . * navigate from <CONTEXT> to <ROOT_NODE> via lead selection lo_nd_root_node = wd_context->get_child_node( name = wd_this->wdctx_root_node ). * @TODO handle non existant child * IF lo_nd_root_node IS INITIAL. * ENDIF. * get element via lead selection lo_el_root_node = lo_nd_root_node->get_element( ). * @TODO handle not set lead selection if lo_el_root_node is initial. endif. select * from USER_ADDR into table it_zpscat up to 10 rows. * LOOP AT it_zpscat INTO WA_zpscat.

WA-text = SY-tabix. CONCATENATE WA-text WA_zpscat-bname inTO WA-text. move WA_zpscat-bname TO WA-VALUE. insert WA inTO table it_dropdown. *append WA TO it_dropdown. clear WA_zpscat. clear wa. ENDLOOP. NODE_INFO = lo_nd_root_node->GET_NODE_INFO( ). * Set Value_sets to node_info NODE_INFO->SET_ATTRIBUTE_VALUE_SET( NAME = 'ZUSER' VALUE_SET = it_dropdown ). 33. Double Click on the WDDOINIT method to add the Code.

34. Click on the Code Wizard.

method ONACTIONCLICKME . data lo_nd_root_node type ref to if_wd_context_node. data lo_el_root_node type ref to if_wd_context_element. data ls_root_node type wd_this->element_root_node. data lv_zuser type wd_this->element_root_node-zuser. data lv_zusername type wd_this->element_root_node-zuser.

* navigate from <CONTEXT> to <ROOT_NODE> via lead selection lo_nd_root_node = wd_context->get_child_node( name = wd_this->wdctx_root_node ). * @TODO handle non existant child * IF lo_nd_root_node IS INITIAL. * ENDIF. * get element via lead selection lo_el_root_node = lo_nd_root_node->get_element( ). * @TODO handle not set lead selection if lo_el_root_node is initial. endif. * get single attribute lo_el_root_node->get_attribute( exporting name = `ZUSER` importing value = lv_zuser ). select single NAME_TEXTC from USER_ADDR into lv_zusername where bname = lv_zuser. * set single attribute lo_el_root_node->set_attribute( name = `ZUSERNAME` value = lv_zusername ).

endmethod. 35. Web Dynpro Application.Right click on the Web Dynpro component and select Create

36. Enter the application name and save the application.

37. Save the Application .

38. Right click on the Web Dynpro application that we created and select Test .

39. Browser opens with the form. The Form Displays the Data fetched from the database. Select the USER and Click on the Submit button.

40. The User Selected is fetched from Database Populated.

Upload Photos/images into custom table & Print in Adobe form


By Saikumar B, HCL Technologies This document explains how to upload images into custom tables and display the images in adobe form. Create a Table with two fields

Create a Structure.

Create a table type..

Type the transaction code SFP in your command box. Select the radio button Interface enter the name of the interface starting with Z (here as creating as Z_IF_TEST_CV) Click on create button

Enter description and let the interface type be as it is. (Default interface type)

Save the interface and assign it a transport request. Create table Import parameters as for employee photograph and data as it_photo Save and activate the interface and come back on the main screen Create Form: select the radio button form

Click on create button and Enter description, specify the interface that you have create above in step

Enter save assign to the transport request (here we have assigned it to local package) The new screen will appear with 3 tab pages and 2 panes can be seen in context tab page. The left hand pane is the interface and the right hand pane is the context of the adobe form. The interface needs to be mapped with the context of the form. This can be done by drag and drop of the fields from interface to context of the ADOBE form

Once the mapping is done click on the layout tab. In this tab you may design your ADOBE form layout.

Drag and drop the UI Element Image Field on the form master page table line.

Binding the Image Filed. The UI Element needs to be bind so that if can receive the image at run time. For binding the fields select the UI Element Click on Binding tab on the object window.

As you have dragged and dropped the field of table binding automatically takes place or else you may also bind the fields as done for photo field. Save and Activate the ADOBE Form *&---------------------------------------------------------------------* *& Report ZPHOTO_PRINT *&---------------------------------------------------------------------* REPORT ZPHOTO_PRINT. DATA : IT_PHOTO TYPE ZTEST_PHOTO_T, WA_PHOTO TYPE ZTEST_PHOTO_S. DATA : WA_ZTEST_PHOTO TYPE ZTEST_PHOTO, IT_ZTEST_PHOTO TYPE TABLE OF ZTEST_PHOTO. SELECTION-SCREEN BEGIN OF BLOCK b1 WITH FRAME TITLE text-001. SELECT-OPTIONS : S_PERNR FOR WA_ZTEST_PHOTO-PERNR NO INTERVALS . PARAMETERS : P_PRINT TYPE CHAR1 RADIOBUTTON GROUP RDA1 DEFAULT 'X' USERCOMMAND COM,

P_UPLOAD TYPE CHAR1 RADIOBUTTON GROUP RDA1. SELECTION-SCREEN end OF BLOCK b1. IF P_PRINT IS NOT INITIAL. * selecting the data from the table.. SELECT PERNR PHOTO FROM ZTEST_PHOTO INTO CORRESPONDING FIELDS OF TABLE IT_Z TEST_PHOTO WHERE PERNR IN S_PERNR . LOOP AT IT_ZTEST_PHOTO INTO WA_ZTEST_PHOTO. WA_PHOTO-PERNR = WA_ZTEST_PHOTO-PERNR. WA_PHOTO-PHOTO = WA_ZTEST_PHOTO-PHOTO. APPEND WA_PHOTO TO IT_PHOTO. ENDLOOP. DATA :FP_OUTPUTPARAMS TYPE SFPOUTPUTPARAMS. FP_OUTPUTPARAMS-NODIALOG = 'X'. "'X'. FP_OUTPUTPARAMS-PREVIEW = 'X'. "'X'. * fp_docparams-FILLABLE = 'N'. *fp_outputparams-DEVICE = 'ZLOCA'. CALL FUNCTION 'FP_JOB_OPEN' CHANGING IE_OUTPUTPARAMS = FP_OUTPUTPARAMS EXCEPTIONS CANCEL =1 USAGE_ERROR = 2 SYSTEM_ERROR = 3 INTERNAL_ERROR = 4 OTHERS = 5. IF SY-SUBRC <> 0. MESSAGE ID SY-MSGID TYPE SY-MSGTY NUMBER SY-MSGNO WITH SY-MSGV1 SY-MSGV2 SY-MSGV3 SY-MSGV4. ENDIF. CALL FUNCTION '/1BCDWB/SM00000027' EXPORTING * /1BCDWB/DOCPARAMS = IT_PHOTO = IT_PHOTO * IMPORTING * /1BCDWB/FORMOUTPUT = * EXCEPTIONS * USAGE_ERROR =1 * SYSTEM_ERROR =2 * INTERNAL_ERROR =3 * OTHERS =4 . IF SY-SUBRC <> 0.

* MESSAGE ID SY-MSGID TYPE SY-MSGTY NUMBER SY-MSGNO * WITH SY-MSGV1 SY-MSGV2 SY-MSGV3 SY-MSGV4. ENDIF. CALL FUNCTION 'FP_JOB_CLOSE' * IMPORTING * E_RESULT = EXCEPTIONS USAGE_ERROR =1 SYSTEM_ERROR =2 INTERNAL_ERROR =3 OTHERS = 4. IF SY-SUBRC <> 0. ENDIF. ELSE. DATA: LR_MIME_REP TYPE REF TO IF_MR_API. DATA: LV_FILENAME TYPE STRING. DATA: LV_PATH TYPE STRING. DATA: LV_FULLPATH TYPE STRING. DATA: LV_CONTENT TYPE XSTRING. DATA: LV_LENGTH TYPE I. DATA: LV_RC TYPE SY-SUBRC. DATA: LT_FILE TYPE FILETABLE. DATA: LS_FILE LIKE LINE OF LT_FILE.

DATA: LT_DATA TYPE STANDARD TABLE OF X255.

CL_GUI_FRONTEND_SERVICES=>FILE_OPEN_DIALOG( CHANGING FILE_TABLE = LT_FILE " Table Holding Selected Files RC = LV_RC ). " Return Code, Number of Files or -1 If Error Occurred READ TABLE LT_FILE INTO LS_FILE INDEX 1. IF SY-SUBRC = 0. LV_FILENAME = LS_FILE-FILENAME. ENDIF. CL_GUI_FRONTEND_SERVICES=>GUI_UPLOAD( EXPORTING FILENAME = LV_FILENAME " Name of file FILETYPE = 'BIN' IMPORTING FILELENGTH = LV_LENGTH " File length CHANGING DATA_TAB = LT_DATA " Transfer table for file contents

EXCEPTIONS OTHERS

= 19 ).

CALL FUNCTION 'SCMS_BINARY_TO_XSTRING' EXPORTING INPUT_LENGTH = LV_LENGTH * first_line = 0 * last_line = 0 IMPORTING BUFFER = LV_CONTENT TABLES BINARY_TAB = LT_DATA EXCEPTIONS FAILED =1 OTHERS = 2. WA_ZTEST_PHOTO-PERNR = S_PERNR-low. WA_ZTEST_PHOTO-PHOTO = LV_CONTENT. MODIFY ZTEST_PHOTO FROM WA_ZTEST_PHOTO . if sy-subrc = 0. MESSAGE 'Successfully Uploaded' TYPE 'I' DISPLAY LIKE 'S'. ENDIF. ENDIF. Run the Program

Enter the Photo ID No.. and select radio button Photo upload and run..

A pop will ask to select a photo..

After saving the photo.. the image will store in Xstring format as below in the table.

To display the Photo select ID no.. and run..

Print preview of the photo..

For multiple entries ..

Adding rows dynamically in a table using interactive Adobe Forms


By Phani Diwakar M, YASH Technologies The requirement is to add the table rows dynamically in the table. This document is dealt with how to create dynamic table in interactive form using offline scenario. Step1: Go to SFP transaction and provide interface name.

Click on Create button and provide the meaningful description for the interface. Step2: Now create import parameter ZMAT as shown below.

Save and activate the interface. Step3: Now again go to transaction SFP to create form. Provide the form name.

Click on Create button. A popup will appear where provide the interface name and meaningful description of the form. Step4: Now drag the import parameter ZMAT to context as shown.

Step5: Now go to layout. Drag the table ZMAT to body page. Drag the button from library on to body page below the table as shown.

Step6: Now go to Hierarchy tab, Go to OBJECT palette of DATA and provide the min count is 3 (when we execute the form initially it shows 3 default rows) as shown below.

Step7: Now click on Insert Button. In the script editor, write the following code which generates the rows dynamically at run time.

In script editor: var anInstanceManager = data.Bodypage.ZMAT.DATA.instanceManager; var newInstance = anInstanceManager.addInstance(1); var aToIndex = data.Bodypage.ZMAT.DATA.index + 3; (Adds the rows from 4th postion) var aFromIndex = newInstance.index; anInstanceManager.moveInstance(aFromIndex, aToIndex); Save and activate the form.

REPORT ZOFFLINE_MAT_01. data: fs_venbank type zwd_mat, it_mat type zwd_t_mat, l_fm_name TYPE rs38l_fnam, l_formname TYPE fpname VALUE 'ZOFFLINE_MAT_FORM', fp_docparams TYPE sfpdocparams, FP_FORMOUTPUT TYPE FPFORMOUTPUT, fp_outputparams TYPE sfpoutputparams. START-OF-SELECTION. PERFORM get_function_module. *&---------------------------------------------------------------------* *& Form GET_FUNCTION_MODULE *&---------------------------------------------------------------------* form GET_FUNCTION_MODULE . CALL FUNCTION 'FP_FUNCTION_MODULE_NAME' EXPORTING i_name = l_formname IMPORTING e_funcname = l_fm_name. * E_INTERFACE_TYPE = * fp_outputparams-nodialog = 'X'. * fp_outputparams-getpdf = 'X'. CALL FUNCTION 'FP_JOB_OPEN' CHANGING ie_outputparams = fp_outputparams EXCEPTIONS cancel =1 usage_error =2 system_error = 3 internal_error = 4 OTHERS = 5. IF sy-subrc <> 0. CASE sy-subrc. WHEN OTHERS. ENDCASE. ENDIF. fp_docparams-langu = 'X'.

" CASE sy-subrc

fp_docparams-country = 'US'. fp_docparams-fillable = 'X'. fp_docparams-dynamic = 'X'. CALL FUNCTION l_fm_name EXPORTING /1bcdwb/docparams = fp_docparams zmat = it_mat IMPORTING /1BCDWB/FORMOUTPUT = FP_FORMOUTPUT EXCEPTIONS usage_error =1 system_error internal_error OTHERS =2 =3 = 4.

IF sy-subrc <> 0. CASE sy-subrc. WHEN OTHERS. ENDCASE. ENDIF.

" CASE sy-subrc " IF sy-subrc <> 0

CALL FUNCTION 'FP_JOB_CLOSE' * IMPORTING * E_RESULT = result EXCEPTIONS usage_error =1 system_error internal_error =2 =3

OTHERS =4 . IF sy-subrc <> 0. CASE sy-subrc. WHEN OTHERS. ENDCASE. " CASE sy-subrc ENDIF. " IF sy-subrc <> 0. endform. " GET_FUNCTION_MODULE Note: To add the rows dynamically in the form, we have to pass the value X to parameter DYNAMIC of the structure /1BCDWB/DOCPARAMS. Output: execute the program

Now when you click on button Insert, a new row will be added after 3 rows.

Hiding a Field Using Javascript in Adobe Form based on the condition


By Kalyan Balabhadrapatruni, YASH Technologies Go to Transaction SFP->

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

Click on Create & Enter the Description and Press Save:

Press Save Button.

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

Creating the Global Delivery which will passed filled in the form interface and passed to the Layout of adobe form. Go to Global Definitions->Global Data -> enter the below variables.

Go to Global Definitions->Create types.

Go to Initialization->code Initialization. Enter the below code.

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:- zhide_field).

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

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 data view to View the fields that are add to the context in the context tab.

Now drag and drop the fields from the Data view to the form.

Select object name ->go to Palettes->Click on Script Editor.

This script will hide the field in runtime if it is initial. Enter the below JavaScript in the editor & Select the language as JavaScript. if(this.rawValue == null) { this.presence = "hidden"; }

Save and activate the form.

Execute the form to see the below screen. Here for output we will have two scenarios. SCENARIO 1: Position Title is not initial SCENARIO 2: Position Title is initial

SCENARIO 2:

Custom Dialog Box Message while Saving the Adobe Forms without filling the Mandatory Fields
By Siddharth Samal, Capgemini Canada Prerequisite: It is assumed that the reader of this article has basic knowledge in WebDynpro and adobe forms. Requirement: The Requirement is to generate a pop-up message dialog box, to the user while saving the adobe forms without filling in the Mandatory fields. Procedure: The requirement cannot be achieved as adobe doesnt have such functionality, not to allow saving the document without filling in the mandatory fields. We would be using Java Script to generate a Dialog box custom message, and if the user clicks OK then the document would not be closed and if Cancel a Blank copy of the document would be save. 1. Create a WebDynpro Component in SE80

2.

Go to the Context Tab of the View V_SENDEMAIL_DEMO

3.

Create a NODE with LFA1 as DDIC Reference

4.

Select the Attributes for the Node LFA1

5.

Create an Attribute as PDFSOURCE

6.

The Context of the View would look as below.

7.

Create an Element Interactive Form by Insert Element in Layout tab

The Property of the Interactive FORM would be as shown below.

9.

Change the Layout Type to ZCI

10. Create a Input Filed on the Layout and Bind as shown below

11. Make the Field property as Required to make it Mandatory

12. In the same way create another field City and make it Optional.

13. Select any ONE of the Input Field (in our case its Vendor Name). Just above the Tool Bar of the Adobe there is a space to write the Java Script or go to Palettes and Click Java Script. Show Box Select preSave event which triggers when the Document is saved.

Write the Below Mentioned Java Script in the Editor. function IsSpecified(oField) { return (oField.rawValue != null) && (oField.rawValue.length > 0); } var bCanSubmit = true; var message = "Message: Entry for the below Mandatory Fields are Missing! \n"; if (!IsSpecified(LFA1.P1.NAME1)) // The Field Node Name { message += "\n Vendor Name"; // \n = New Line bCanSubmit = false; } if (!bCanSubmit) { var oDlg = { description: { name: "Test Dialog", elements: [ { type: "cluster", name: "---- ERROR MESSAGE ----", elements: [ {

name: "Some Mandatory Fields are Missing!", type: "static_text", }, { name: "Please Click 'OK' and Save Again! By Filling the Mandatory Fields", type: "static_text", }, { name: "If 'CANCLE' is Clicked, a Blank Copy of the Form would be Saved.", type: "static_text", }, { type: "ok_cancel", }, ] } ] } }; // Dialog Activation if ("cancel" == app.execDialog(oDlg)) { xfa.host.resetData(); // Reset The Form } } 15. Create a Web Dynpro Application

16. Test the Application

17. In the below case if the Mandatory field is empty. In any case as its a standard Property of adobe we cant stop it from saving. But we can change the data before saving.

18. If the mandatory field is missing a POP up would be generated with the below message as mentioned in the Java Script.

19. If OK is selected then the form would be Open and user can fill in the mandatory fields. If Cancel is selected then the Form would be refreshed and the enter data would be cleared in the saved form.

20. The same is also applicable for the Close Button as well.

Digital signature in Adobe forms


By Phani Diwakar Marepalli, YASH Technologies A digital signature is a security mechanism for protecting digital data. The digital signature does the same function for processing digital data as hand written signature does for the paper based documents. Step1: SFP is the transaction to create adobe form. Provide the interface name and click on create button.

Provide the description and save it. Activate the interface and come back to initial screen of form builder. Step2: Provide the form name and click on create button.

Provide the interface name and form description.

Step3: Drag and drop the system field date to context tab. Step4: Go to layout tab,

Drag the date field to layout editor. Drag the signature field from library to layout editor as shown.

Activate the form. Step5: Execute the form.

Sign icon (Marked as Yellow color) as shown in tool bar is in disable mode. After the signature has been filled this icon becomes enable mode. Step6: Steps to create digital signature Click on signature field. The following screen appears.

Now select the radio button A new digital ID I want to create now and click on next button.

Clicking on next button, the following screen appears as shown below.

Select the radio button windows certification store The following Add Digital ID screen will appear when click on Next button and fill the related information.

Now click on finish button. Click on sign button as shown below.

Now the created signature will appear on the signatory field as shown below.

Click on signature field, you will get the pop up box as shown below.

If you want to check the signature properties then click on signature properties button. If the signature is valid then you will get 'Signed and all signatures are valid' message appear at the top of the window.

Here we can also change the field entries even after the signature field has been filled. When saving the form after we modified the any of the field entries in the form, you will get the following message at the top Signed and all signatures are valid, but with unsigned changes after the last signature.

Click on signature panel at the top right side corner (Shown on above picture), there you can find the log as shown below.

When you click on highlighted statement under Form Fields Filled In, it would show the modified value of the field. And also you can check the value before modification in the Click to view this version under signature details.

When selected New PKCS#12 digital ID file:

Click on Next button. Provide the required information and press Next button as shown below.

We get the following screen. It asks for password. Provide the password and press finish button.

We get the following screen.

After providing the password only you can able to sign in. Suppose if you press the sign button without giving password, it asks for password saying that A password is required to use this digital ID.

Now press the sign button. The signature would be appeared in signature field.

In the above two cases, we can able to change the field entries after the signature field is filled in the form. But, we can also have an option to avoid / restrict making changes to the content of the fields (Date in this case) once the signature field is filled. Now go to library tab-Web Dynpro native. Drag and drop the signature-sign and lock to layout editor.

Save and activate the form. Execute the form.

Click on signature&lock field. The following screen appears. Select the existing id or create new id as shown below.

Select ID Phani

Click on sign button.

Now the date field becomes locked. We can not modify the value. In this way we can lock the fields after the signature has been done.

Validation of date and calculation of the number of days between two dates using Java Script (Adobe interactive forms)
By Phani Diwakar M, YASH Technologies This document gives an idea about to validation of date and calculation of the number of days between two dates using Java Script.

Step1: Go to transaction SFP, and create interface.

Save and activate the form. Step2: Go to transaction SFP, create form 'ZTEST_FORM_JS2'. Drag and drop the parameters from interface to context tab as shown.

Step3: Go to layout, drag and drop the elements into layout editor. Drag the text field from library to layout editor as shown.

Step4: Insert the variable as shown.

Rename the variable name as 'checkDate' and write the following code in the script editor.

// Validation for the date(dd/MM/yyyy) function isValidDate(DateVal) { //xfa.host.messageBox("Date Val : "+DateVal); var isValidDate = true; DateVal = DateVal.replace("/","-"); // replace first '-' with '/' DateVal = DateVal.replace("/","-"); // replace first '-' with '/' if(DateVal!=null) { var r = new RegExp(); r.compile("^[0-9]{4}-(((0[13578]|(10|12))-(0[1-9]|[1-2][0-9]|3[0-1]))|(02-(0[1-9]|[1-2][09]))|((0[469]|11)-(0[1-9]|[1-2][0-9]|30)))$","i"); isValidDate = r.test(DateVal); } if(!isValidDate) { //xfa.host.messageBox("Invalid Date! Please select the Date","Error in Date",0,0); } return isValidDate; } Step5: Select the days element in the Body Page and select the event VALIDATE to validate the From Date and To Date fields and also logic for calculation of days. var sdate = data.Body.SDATE.rawValue; var edate = data.Body.EDATE.rawValue; // If the both the dates are initial or space, assigning days field to ZERO if((sdate==null)||(sdate=="")||(edate==null)||(edate=="")) { data.Body.days.rawValue = "0"; } // Validation of the From Date field if((sdate!=null)||(sdate!="")) { var isFromDateValid = data.Body.variables.checkDate.isValidDate(sdate); if(isFromDateValid == false) { data.Body.days.fontColor = "255,0,0"; xfa.host.setFocus("data.Body.days"); data.Body.days.rawValue = null; xfa.host.messageBox("Invalid From Date! Please select valid From Date","Error in From Date",0,0); } else { data.Body.days.fontColor = "51,51,51"; } } if((sdate==null)||(sdate=="")||(edate==null)||(edate=="")) { data.Body.days.rawValue = "0"; } // Validation of the To Date field if((edate!=null)||(edate!="")) {

var isToDateValid = data.Body.variables.checkDate.isValidDate(edate); if(isToDateValid == false) { data.Body.days.fontColor = "255,0,0"; xfa.host.setFocus("data.Body.days"); data.Body.days.rawValue = null; xfa.host.messageBox("Invalid From Date! Please select valid To Date","Error in To Date",0,0); } else { data.Body.days.fontColor = "51,51,51"; } } // Validation if From date field more than To Date field if(isFromDateValid == true && isToDateValid == true) { if(sdate>edate) { xfa.host.messageBox("'From Date'"+sdate+" is more than 'To Date'"+edate,"Dates Incompatibility",0,0); data.Body.SDATE.fontColor = "255,0,0"; data.Body.EDATE.fontColor = "255,0,0"; data.Body.days.rawValue = null; } else { // Logic to calculation of days between given dates var sdate1 = util.scand("yyyy-mm-dd", sdate); var edate1 = util.scand("yyyy-mm-dd", edate); for(var i=0;;) { var sDateT = sdate1.getTime(); var sDateD = sdate1.getDay(); var sDateN = sDateT+(24*60*60*1000); if(sdate1>edate1) { break; } i = i+1; sdate1 = new Date(sDateN); } data.Body.days.rawValue = i; } }

Click here to continue...


Step6: Execute the form. Pass the value 'X' to the IMPORT parameters DYNIMIC and FILLABLE.

The output would be

Case1: If you entered wrong date in 'From Date',

Case2: If you entered wrong date in 'To Date',

Case3: If you entered 'From Date' is more than 'To Date'.

Case4: If you entered correct dates, then days between two dates would be calculated as shown.

Quick testing for SAP Adobe Forms


By Yogesh Rane, Deloitte Consulting

1) Go to transaction SFP and open any form in the testing client where you have the data. 2) Then click on Utilities -> Settings as shown below:

3) We get a pop as shown below. Select Option 4 Very Detailed Trace from the drop down list and hit Enter.

4) Execute the transaction that you use to generate the print preview as usual and click on the Attachments button as shown below:

5) Save the file XFD.xml in the attachments to a desired location on your desktop as shown below:

6) Now in the development client open the form and go to Layout tab of the Adobe form. From the Menu click on Edit -> Form Properties.

7) Click on Default tab and browse for the XML file as shown:

8) Hit Enter and click on the Preview tab as shown and youll have the layout preview with the data there itself.

9) Now changes to the form layout can be checked immediately in the preview tab itself without activation.

Date validation in interactive adobe forms


By Phani Diwakar

In adobe form, for date field by default we get F4 help for selecting the date and also we can enter the date manually too. When we are doing interactive adobe forms, usually we get problem with date fields such as we can enter any garbage value manually in date field or we can enter any date format. We cannot restrict not to enter the date manually. So we need to validate the date field with particularly in one specific format. This document gives an idea about this. When you execute the form, initially date will be appeared as shown below.

We can define our own format other than standard SAP provides. Suppose If you want to display the date in YYYY.MM.DD format, then you have to follow the below procedure. A. Check whether the date format YYYY.MM.DD is already exists. For that, check the Display Pattern in Field tab of Object palettes as shown. This displays what are the available formats.

We want to display the date format as YYYY.MM.DD which is not already exists as shown above. In this case we need to define this date format. B. Now go to Edit Pattern in Field table of Object palette and write the date format YYYY.MM.DD as shown below.

Now if you see the Display patterns,

If you check point A, you cannot find this date format. Select the YYYY.MM.DD format as shown.

Activate and execute the form.

Still you can enter the date in different formats or else we can give some garbage in date field as shown.

For that we need to validate the date field. Follow the below process to validate the date. Now go to Value tab of Object palette as shown. In the value tab, we have Validation Pattern, there select the date format.

Activate the form and execute it.

If you enter the date other than YYYY.MM.DD format and press the enter button The following standard error message will be displayed as below.

If we want to give specific message other than standard message, go to value tab of Object and select the check box validation pattern message. There provide the custom text to be displayed.

Activate the form and execute.

If we enter any garbage or any other format other than YYYY.MM.DD, we get the following message.