SAP R/3 Document : SAP ITS Architecture Part II

The SAP Internet Programming Model Part II

Writing an Internet Application with ITS
Internet application development, like all application development efforts, starts with a list of
business requirements. Say, for example, that your companys employees are tired of filling out
purchase requisitions, sending the paper to their managers via snail mail, waiting for approval,
and finally getting what they want three weeks later. This approval process may be necessary for
large purchases, such as a $10,000 computer, but is far too complicated for ordering pencils. To
simplify the process you might want to create an electronic form users can fill out and skip the
approval process altogether when the total is below a certain value. The system could
automatically create a purchase order, which is then sent to a specific vendor.
With SAP R/3, you could ask the users to call a standard SAP transaction such as ME21 to create
a purchase order, but youd face two problems. First, you dont want to install SAPGUI on every
employees workstation (your company could have more than 50,000 employees). Second, ME21
was designed for expert users and requires far too many fields for the standard userafter all, do
you know what document type NB means?
You probably already have a solution for the first problem: The Internet browser on every
employees PC lets you use Internet technology to implement a corporate intranet application.
This approach solves your installation problem in a way that users will immediately accept
because they are used to HTMLs look and feel.
Because each user may have a different browser (ranging from Netscape 2.0 to the latest
Microsoft Internet Explorer), a standard HTML application is probably the best bet for successful
application deployment. What technology do you use to implement this application? First, lets
determine the business requirements, or what your application must be able to do:
Allow users to enter several line items per purchase order
Check valid input for date formats and price
Administer per-user defaults, such as office location
Check whether the user is authorized to create a purchase order
Automatically create a purchase order in SAP.
In addition, the fact that yours is a multinational company with office locations in the U.S.,
Canada, and Europe makes your life more difficult. Youll have to deploy your application in
several languages, and, because input formats are not the same for every nation, your input
checks will have to be specific to the country where the user is located. (For example, in most of
Europe the date is written day.month.year as opposed to the month/day/year format used in
the U.S.)

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

After reviewing the requirement list, you realize you need the following:
Powerful user management to maintain office location, input formats, and user authorizations
A server that lets you keep the user context for a large number of online users (While the user
enters a purchase order, the entered line items must be kept in your applications memory until
the user finally commits the purchase order to the database.)
The ability to save the purchase order to the SAP database.
Writing your application as a regular SAP transaction with the ABAP Workbench should cover
all your projects requirements:
SAP user management lets you keep parameter IDs for every user, and you can maintain user
defaults like office location.
SAP transaction screens take care of input validation by letting you define the valid input
formats for every user.
The ABAP Dictionary contains short texts for important terminology (such as vendor, material,
and so on) in all installed SAP languages, so you dont have to translate these terms yourself.
SAP can handle the user context for a large number of online users.
By writing your application within the SAP system, you obviously have tight integration with
SAP. Saving a purchase order to the SAP database only requires a call to a Business API (BAPI).
Since BAPIs are only function modules, calling a BAPI from an SAP transaction means
essentially calling a function module with the CALL FUNCTION ABAP command.
SAP Internet Transaction Server (ITS) adds an HTML presentation layer to every SAP screen
(see The SAP Internet Programming Model, Part I, SAP Technical Journal, Vol.1, No.1).
Writing an Internet application actually consists of two steps: first, writing the SAP transaction
and, second, Internet-enabling the SAP transaction screens. Lets go through the steps required to
implement the transaction. (For the record, it should be obvious that the simple implementation I
will discuss here doesnt cover all business and usability aspects of the application. The
procurement process is very complex, which is why SAP ships a complete set of procurement
applications, called Business-To-Business Procurement, on the SAP ITS.)

STEP 1: CREATING THE TRANSACTION

To get started, we must first create a dialog program (program type M) with the ABAP
Workbench (SE80). Because you are developing in a customer system, the program must start
with the letter Y or Z; lets call the program ZZPOCREATE.
To make our application easy to use, it will contain screen 1000 (the main data input screen),
which will have only two input fields:
Vendor
Table (with purchase order line items consisting of these fields: delivery date, quantity, order
unit, material number, order price, and price unit).
We could make life easier for the user (for example, the system could automatically determine the
vendor), but for simplicitys sake Ive excluded such optimizations here.
Lets now look at how to create a purchase order automatically in SAP. Obviously, we dont want
to implement the functionality ourselves, but will use an existing BAPI called
BAPI_PO_CREATE. If you call transaction SE37 and type in the BAPI name, you can see this
functions different parameters.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

As you can see in Table 1, the user provides some parameters, and some are calculated when the
BAPI is called, but some must be kept on a per-user basis as a user default. The R/3 infrastructure
comes in handy here, because the R/3 user management can store these parameters in parameter
IDs. When system administrators set up a new user, they use the R/3 user interface to set up the
appropriate values for the parameter IDs (see Figure 1).

Figure 1. Values for parameter IDs.

Parameter Name
BAPIEKKOC-VENDOR
BAPIEKET-DELIV_DATE
BAPIEKET-QUANTITY
BAPIEKPOC-UNIT
BAPIEKPOC-PUR_MAT
BAPIEKPOC-NET_PRICE
BAPIEKPOC-PRICE_UNIT
BAPIEKPOC-DOC_TYPE
APIEKPOC-PURCH_ORG
BAPIEKPOC-PUR_GROUP
BAPIEKPOC-STORE_LOC
BAPIEKPOC-CO_CODE
BAPIEKPOC-DOC_DATE
Table 1. Parameters for BAPI_PO_CREATE

Meaning
Vendor delivering goods
Delivery date
Quantity
Unit of measure
Material number
Net price
Price unit
Document type
Purchasing organization
Purchasing group
Storage location
Company Code
Document date

Provided By
User
User
User
User
User
User
User
User Default BSA
User Default EKO
User Default EKG
User Default LAG
Calculated
Calculated

To continue writing the transaction, we need to provide ABAP variables that will hold the values
the user enters (see Figure 2). An element on the R/3 screen holds a link to an ABAP variable
with the same name, which means that it displays the current value and updates it whenever the
user enters something.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

Table 2. ABAP Variable for bolding input

We should name the ABAP variables exactly like the BAPI parameter so that the R/3
Screenpainter will recognize the name as an ABAP Dictionary field and copy the attributes from
the Dictionary. Naming the variables this way has several advantages:
The Screenpainter will place the item description from the ABAP Dictionary next to the entry
fields. If table controls are used, the item description will appear in the table header. Because the
ABAP Dictionary stores a translation of all item descriptions, you wont have to translate the item
descriptions yourself; users logging on in English will see English descriptions, users logging on
in French will see French descriptions. You only have to display these descriptions on the HTML
page, which is very easy with ITS.
The format description from the ABAP Dictionary will be used automatically. This means date
fields will be displayed and can only be entered with the date format that is set in the user
masteryou will not have to program your input format checking and display formatting
yourself.
If the ABAP Dictionary stores a value table for the data field, users will be allowed to enter only
values that are also in the value table. This is helpful when entering a material number, because
the ABAP Dictionary will immediately check whether the material number the user entered is
valid.

Now lets create the necessary ABAP variables in the program:

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

program

zzpocreate.

* BAPI structures
tables:
bapiekpoc,
bapieket,
bapiekkoc,

" PO Item data

" PO Schedule
" PO Header.

For the table control, we need two internal tables that will hold
the data entered by the user. Heres how to create them and to
declare the table control:
* Table controls
controls po_item_ctrl type tableview using screen 1000.

BAPI call parameters

data: po_items like bapiekpoc occurs 0 with header line.

data: po_item_schedules like bapieket occurs 0 with header line.

If everything goes well, the BAPI will return the purchase order
number. If there is a problem, a detailed error log will be
contained in the variable BAPIRETURN. Lets now create these two
variables:
* BAPI results
data: po_number
data: bapireturn

like bapiekkoc-po_number.
like bapireturn occurs 0 with header line.

We also need some helper variables:

* A few helper variables ...
data: po_item_pos type i. " Cursor for table control
data: app_initialized type i value 0.
" Flag if application
initialized
data: fcode like sy-ucomm. " Function code

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

Now we have to create screen 1000. In the end, it should look something like Figure 3.
To place the VENDOR input field on the screen, use the function Goto->Dict./Program
Fields in the Screenpainter menu. Then, enter the data field name into the text box; for
example, bapiekkoc. Use the function Get From Dict, select the field bapiekkocvendor, and choose Copy. Make sure you select the long text radio box, which will
automatically create an item description next to the input field (see Figure 4).
To create the table control, use Edit->Create Element->Table Control and give it
the name PO_ITEM_CTRL. When you enter the control elements, set up the table columns as in
Figure 5.
Now lets create the flow logic of screen 1000:
process before output.
module initialize_app.
loop at po_items with control po_item_ctrl cursor po_item_pos.
module item_to_ctrl.
endloop.
process after input.
loop at po_items.
module ctrl_to_item.
endloop.
module process_fcode.

The first module is simple: It only creates 40 records in the tables PO_ITEMS and
PO_ITEM_SCHEDULES. PO_ITEMS contains item data such as the material number, and
PO_ITEM_SCHEDULES contains information such as when the user would like to have the
material shipped. These 40 records will initially display 40 empty lines in the table control.
module initialize_app output.
if app_initialized = 0.
app_initialized = 1.
do 40 times.
po_items-po_item = sy-index.
po_item_schedules-po_item = sy-index.
append po_items.
append po_item_schedules.
enddo.
endif.
endmodule.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

The next module, ITEM_TO_CTRL, moves the data from the internal tables that hold item and
schedule information into the table control. The data is moved line by line, so the module reads
the appropriate record from the internal tables and copies the data into the data structures
displayed by the table control. Here is the code:
module item_to_ctrl output.
read table po_items
into bapiekpoc index po_item_pos.
read table po_item_schedules into bapieket index po_item_pos.
endmodule.
" ITEM_TO_CTRL OUTPUT

The Process After Input (PAI) modules process the data entered by the user. PAI module
CTRL_TO_ITEM is the reverse operation of ITEM_TO_CTRL; it copies the data the user
entered into the table control back to the internal tables. Again, the code is simple:
module ctrl_to_item input.
* ----------------- Update Item Table ------------------read table po_items
index po_item_ctrl-current_line.
move bapiekpoc-unit
to po_items-unit.
move bapiekpoc-pur_mat
to po_items-pur_mat.
move bapiekpoc-net_price to po_items-net_price.
move bapiekpoc-price_unit to po_items-price_unit.
modify po_items
index po_item_ctrl-current_line.
* ----------------- Update Schedule Table --------------read table po_item_schedules index po_item_ctrl-current_line.
move bapieket-deliv_date to po_item_schedules-deliv_date.
move bapieket-quantity
to po_item_schedules-quantity.
modify po_item_schedules
index po_item_ctrl-current_line.
endmodule.
" CTRL_TO_ITEM INPUT

Finally, here comes the real stuff: Lets create a pushbutton on the screen with the function code
SAVE. Once thats created, you need to put the variable FCODE into the screen field OK-CODE
so that the function code of the button is automatically copied into the FCODE variable. Listing 1
shows the code that processes the SAVE function code in the module PROCESS_FCODE.
This code contains a few items that require more explanation. First, notice that todays date and
the user creating the purchase order are automatically determined from the ABAP variables SYDATUM and SY-UNAME. Furthermore, parameter IDs are retrieved from the R/3 user
management with the ABAP command GET PARAMETER ID. Also, we determine the company
code from plant based on the customizing table T001K.
I should also explain why the item and schedule tables are copied into two other internal tables.
The answer is simple: Remember that we had set up the item and schedule table with 40 empty
records? Because the user has not entered data into all these records, we filter out records where
data is present and copy only those records into the tables PO_ITEMS2 and
PO_ITEM_SCHEDULES2, which are then passed to the BAPI. You could have created the
purchase order from the original tables as well, but you would have received warnings for every
empty line item. To avoid this, filter out the empty records.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

The last step is to create a transaction code ZZPO, then we are ready to test our application. We
start the transaction in SAPGUI and use the ABAP debugger if we discover any problems.

Figure 3. Screen 1000.

Figure 4. Creating the VENDOR input field.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

Figure 5. Column setup for entering control elements.

module process_fcode input.

data: plant like t001w-werks.
* BAPI call parameters
data: po_items2
like bapiekpoc occurs 0 with header line.
data: po_item_schedules2 like bapieket occurs 0 with header line.
if fcode = 'SAVE'.
bapiekkoc-doc_date
= sy-datum.
bapiekkoc-created_by = sy-uname.
get parameter id 'WRK' field plant.
get parameter id 'BSA' field bapiekkoc-doc_type.
get parameter id 'EKO' field bapiekkoc-purch_org.
get parameter id 'EKG' field bapiekkoc-pur_group.
* derive company code from plant; table t001k (customizing table)
select
* from t001k
client specified
where bwkey
= plant.
move t001k-bukrs to bapiekkoc-co_code.
endselect.
*
Copy actual line items to call table
refresh po_items2. refresh po_item_schedules2.
refresh po_items2. refresh po_item_schedules2.
loop at po_items.
if po_items-pur_mat ne space.
move po_items to po_items2.
get parameter id 'LAG' field po_items2-store_loc.
po_items2-plant = plant.
append po_items2.
endif.
endloop.
loop at po_item_schedules.
if po_item_schedules-quantity gt 0.
move po_item_schedules to po_item_schedules2.
append po_item_schedules2.
endif.
endloop.
call function 'BAPI_PO_CREATE'
exporting

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

po_header
importing
purchaseorder
purchaseorder
tables
po_items
po_item_schedules
return
exceptions
others

= bapiekkoc
= po_number
= po_number
= po_items2
= po_item_schedules2
= bapireturn
= 1.

endif.
clear fcode.
endmodule.

" PROCESS_FCODE

Listing 1. Processing the SAVE function code in the module PROCESS_FCODE

STEP 2: INTERNET-ENABLE THE TRANSACTION

If you dont already have it, you can get SAP ITS either from your SAP CDs or by downloading
version 2.2 (which was shipped with R/3 release 4.5A) from the SAP Labs homepage,
http://www.saplabs.com/devarea/its.htm. You dont necessarily need R/3 4.0A to run the
application; however, if you use an R/3 3.1X release you must replace the table control with a
STEP LOOP because table controls are only supported from release 4.0 upward. The lowest R/3
release that ITS supports is 3.0D.
To install ITS, just execute the setup program on an NT server with an installed Web server (IIS
or Netscape), and follow all the steps. You will need to specify your Web server, the name of the
ITS instance (most system administrators give ITS the name of the R/3 instance), and R/3 system
information. You may also specify an R/3 user name and password, which will be the default
with which you log on to R/3. If you do not provide login information, ITS will prompt you for
the usual R/3 login information with client, username, password, and language. After the ITS
setup, install SAP@Web Studio.
Once you install ITS and SAP@Web Studio, youll need to create an ITS service that contains all
the information necessary for connecting to, logging on to, and starting a transaction on the R/3
system.
After starting upSAP@Web Studio (entries in the Windows NT START menu are created
automatically), youll use wizards to create a project that will contain all the objects you are
currently working on (services, templates, graphics files, and so on).

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

Use the File->New menu to create a project; lets call our example MyProject. Next, use
File->New again and go to the File Wizard tab. There, choose the Service Wizard
and follow all the steps. First, you are asked for a service name. Since the transaction is called
ZZPO, lets also call our service ZZPO. Next, specify the R/3 system you want to connect to. You
can also use the global settings if you specified a specific R/3 system in the ITS setup. The same
rule applies to the R/3 login and password; you can either use the login that you specified in the
ITS setup or give a service-specific login. For this example, however, we wont give a username
or password because we want users to log on interactively once they start our electronic
purchasing application (see Figure 6).

Figure 6. The SAP@WEb Studio Service Wizard.

Finally, specify a timeout (the period of inactivity after which ITS will log a user off the system)
and the transaction code ZZPO. Once confirmed, the service is created.
Now we have to create a template for screen 1000. A template is basically an HTML page into
which ITS merges the data fields from the R/3 screen. ITS makes it possible for a static HTML
page to contain live R/3 data. If the page contains an HTML form with input fields, ITS can also
update the R/3 screen values from the user input in the HTML page.
Use SAP@Web Studios File->New option again and choose the HTML Business
Template option under the Files tab. Pick the service name ZZPO; enter program name
ZZPOCREATE, screen number 1000, and theme 99but no language. (The theme is an ITS
concept that lets you keep several HTML user interfaces for the same transaction; theme 99 is the
default.) SAP@Web Studio will create a file called ZZPOCREATE_ 1000.html, which is formed
by concatenating the program name and the screen number.
Merging live R/3 data into the page is simple: Suppose you have a field DATAFIELD on your
R/3 screen; all you have to do is enclose your field name in back apostrophe symbols. A very
simple HTML page would look like this:

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

<HTML>
<HEAD>
<TITLE> A very simple example </TITLE>
</HEAD>
<BODY>
This is the value of datafield `DATAFIELD`
</BODY>
</HTML>
When you want to display as well as update an R/3 value, you must use HTML forms:
<HTML>
<HEAD>
<TITLE> A very simple update example </TITLE>
</HEAD>
<BODY>
<FORM ACTION=`wgateURL()` METHOD=POST>
<INPUT TYPE=TEXT NAME=DATAFIELD VALUE=`DATAFIELD`>
<INPUT TYPE=SUBMIT NAME=~OkCode(UPDA) VALUE=Update>
</FORM>
</BODY>
</HTML>

The function wgateURL() creates a valid Web address (URL); you dont have to worry about
the technical details. Also notice that the SUBMIT button sends the function code UPDA along
with the data back to R/3.
Displaying a table control can be more complicated. Suppose table control T has multiple lines, T
has a datafield X , and ITS needs to display every single line of T. Because we dont know what
part of the data set is displayed by T while writing the HTML template, ITS makes this
information available to the HTML template at execution time. T.firstVisible contains the
first visible record number. T.lastVisible contains the last visible record number.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

The value of the field X in line 5 is expressed by X[5]. It is of course easy to display a specific
line (X[5] for example) in an HTML template, but what about displaying the data from the first
visible to the last visible line? For this, we need the loop control structure that the ITS HTML
template concept provides. Consider the following example:
<HTML>
<HEAD>
<TITLE> How to update a table </TITLE>
</HEAD>
<BODY>
<FORM ACTION=`wgateURL()` METHOD=POST>
`repeat with i from T.firstVisible to T.lastVisible`
<INPUT TYPE=TEXT NAME=X[`i`]
VALUE=`X[i]`>
`end`
<INPUT TYPE=SUBMIT NAME=~OkCode(UPDA)
VALUE=Update>
</FORM>
</BODY>
</HTML>

Listing 2 shows how to create a template for screen 1000. The template contains some elements
we havent talked about yet:
The variable ~messageLine contains a value if the R/3 screen displays a message.
The table navigation buttons work a little differently than buttons that only send a function code;
you need to specify the table control with the ~control parameter and the desired navigation in
the ~event parameter.
The column headers of table control T are contained in the variables T-COLUMN[i].title.
The number of columns contained in table control T is in the variable T.columnCount.
The width of an entry field F on the SAP screen is contained in the variable F.maxsize.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

<HTML>
<FORM ACTION="`wgateURL()`" METHOD="POST">
`~MessageLine`
<INPUT TYPE="SUBMIT" NAME="~OkCode(/0)" VALUE="Update">
<INPUT TYPE="SUBMIT" NAME="~Control=PO_ITEM_CTRL,~Event=TopPage"
VALUE="Top Page">
<INPUT TYPE="SUBMIT" NAME="~Control=PO_ITEM_CTRL,~Event=PrevPage"
VALUE="Previous Page">
<INPUT TYPE="SUBMIT" NAME="~Control=PO_ITEM_CTRL,~Event=NextPage"
VALUE="Next Page">
<INPUT TYPE="SUBMIT" NAME="~Control=PO_ITEM_CTRL,~Event=LastPage"
VALUE="Last Page">
<TABLE BORDER=1>
<TR>
`repeat with i from 1 to PO_ITEM_CTRL.columnCount`
<TD><B>`PO_ITEM_CTRL-COLUMN[i].title`</B></TD>
`end`
</TR>
`repeat with i from PO_ITEM_CTRL.firstVisible to
PO_ITEM_CTRL.lastVisible`
<TR>
<TD><INPUT TYPE="TEXT"
NAME="BAPIEKET-DELIV_DATE[`i`]"
VALUE="`BAPIEKET-DELIV_DATE[i]`"
SIZE="`BAPIEKET-DELIV_DATE.maxsize`"></TD>
<TD><INPUT TYPE="TEXT"
NAME="BAPIEKET-QUANTITY[`i`]"
VALUE="`BAPIEKET-QUANTITY[i]`"
SIZE="`BAPIEKET-QUANTITY.maxsize`"></TD>
<TD><INPUT TYPE="TEXT"
NAME="BAPIEKPOC-UNIT[`i`]"
VALUE="`BAPIEKPOC-UNIT[i]`"
SIZE="`BAPIEKPOC-UNIT.maxsize`"></TD>
<TD><INPUT TYPE="TEXT"
NAME="BAPIEKPOC-MATERIAL[`i`]"
VALUE="`BAPIEKPOC-MATERIAL[i]`"
SIZE="`BAPIEKPOC-MATERIAL.maxsize`"></TD>
<TD><INPUT TYPE="TEXT"
NAME="BAPIEKPOC-NET_PRICE[`i`]"
VALUE="`BAPIEKPOC-NET_PRICE[i]`"
SIZE="`BAPIEKPOC-NET_PRICE.maxsize`"></TD>
<TD><INPUT TYPE="TEXT"
NAME="BAPIEKPOC-PRICE_UNIT[`i`]"
VALUE="`BAPIEKPOC-PRICE_UNIT[i]`"
SIZE="`BAPIEKPOC-PRICE_UNIT.maxsize`"></TD>
</TR>

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

`end`
</TABLE>
</FORM>
</HTML>

Listing 2. Creating a template for screen 1000.

OK, lets review what we have now:

A service file containing all necessary information to connect to, log on to, and start a
transaction in R/3
A template for program ZZPOCREATE screen 1000.
Now we need to publish these objectsthat is, copy the objects into the correct directory
locations on the ITS server (see Figure 7). To do this, create an ITS Site using the menu
command Project->Site Definition. Just hit the New button and answer all the
questions. Use the dropdown list in the upper left corner of the Studio window to set the active
site.
Now when you select the ZZPO service name with the right mouse button, you will see the option
Publish. This option brings up a dialog boxif you confirm, SAP@Web Studio will copy all
objects to the proper location on your ITS server.

Figure 7. R/3 instance information.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

Thats it! Start the service using the following address in your Web browser:
http://host/scripts/wgate/ZZPO/! This command will automatically establish an
R/3 connection and prompt you to log on (if you didnt supply logon information in the ITS
setup).
After you log on, you should see the page shown in Figure 8 (page 36). Its no work of arta
professional designer could significantly improve the look. But this article focuses on developeroriented issues, so lets go back and test our purchasing application. As I said before, the SAP
screen interface does a lot of input checking and data formatting for you. Try, for example, to
enter an invalid date, and the HTML page will display an error message that is contained in the
variable ~messageLine.

Figure 8. Viewing connection detail from the monitor page.

One of the side effects of entering an invalid date is that all other lines are blocked from input to
alert the user to correct the input error before entering further data. Although SAPGUI blocks the
data input automatically, the HTML page does notall fields remain ready for input. You can
make the HTML page reflect the SAPGUI screen change in one simple step, though. For any
input field, the attribute .disabled signals whether or not an input field is ready.

With a little HTML template magic, we can also block the HTML input fields when the screen
input fields are blocked by putting an if statement around the HTML input fields:

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

`if (BAPIEKET-DELIV_DATE[i].disabled )`
<!-- only display the value because
field is not ready for input -->
`BAPIEKET-DELIV_DATE[i]`
`else`
<!-- field is ready for input -->
<INPUT TYPE="TEXT"
NAME="BAPIEKET-DELIV_DATE[`i`]"
VALUE="`BAPIEKET-DELIV_DATE[i]`"
SIZE="`BAPIEKET-DELIV_DATE.maxsize`">
`endif`

Also, you may have noticed that the table control navigation buttons currently display only
English text. To make the purchasing application a multilanguage application, display the button
labels in the appropriate language. You can create buttons on the SAP screen and let SAP do the
translation, but this is a bit cumbersome.
ITS uses a concept called language resources for translating Internet applications. A language
resource (which you can create with SAP@Web Studio) is basically a short text that can be
identified with an abbreviation in the HTML template. Use the menu item File->New to bring
up the dialog for creating new objects, choose the File Wizards tab, then choose Resource
Wizard. SAP@Web Studio will bring up a dialog where you can enter your service ZZPO, theme
99, and the language key (for example, De). (See Figure 9.) Once you confirm the dialog,
SAP@Web Studio will create an empty language resource file that you can fill with the necessary
short texts.
Using language resources in the HTML template is easy; just refer to the text by prefixing the
identifier with a # mark:

Figure 9. Creating a language resource file.

Article From www.saptechjournal.com

SAP R/3 Document : SAP ITS Architecture Part II

<INPUT TYPE="SUBMIT" NAME="~Control=PO_ITEM_CTRL,~Event=TopPage"
VALUE="`#FirstPage`">
<INPUT TYPE="SUBMIT" NAME="~Control=PO_ITEM_CTRL,~Event=PrevPage"
VALUE="`#PrevPage`">
<INPUT TYPE="SUBMIT" NAME="~Control=PO_ITEM_CTRL,~Event=NextPage"
VALUE="`#NextPage`">
<INPUT TYPE="SUBMIT" NAME="~Control=PO_ITEM_CTRL,~Event=LastPage"
VALUE="`#LastPage`">

And thats it! Weve created a scalable multilingual intranet purchasing application that is ready
for use.
Michael Bechauf is development manager in the SAP ITS group. He has worked for SAP in
various development positions and as a specialist for R/3 performance since 1992. You can reach
him at michael.bechauf@sap-ag.de.

Note : This article appeared in the second issue on

www.saptechjournal.com.
Please visit the above site for the original article

Article From www.saptechjournal.com