Try OpenEdge Now
skip to main content
Application Developer's Guide
Developing management applications to control infopads : Creating a custom HTML application
 

Creating a custom HTML application

Creating a management application using a custom HTML page is perhaps the easiest way to generate an interface allowing you to manipulate infopad values. The basic procedure involves creating a regular form-based HTML page with the necessary user interface components required to display and update information. Once this is in place, you can use custom HTML tags to display, get, and update the actual infopad values.
When a user requests this page, Business Process Portal preprocesses the HTML file substituting JavaScript and conventional HTML in place of the custom tags, generating a page that can display and update infopad values suitable for display on any supported web browser.
To create the custom HTML page, complete the following steps:
1. Create the HTML file with the user interface components required to display and update the infopad values.
Use standard HTML constructs including input fields, drop-down lists, and multiline inputs (text area).
2. Use custom HTML tags to display, get, store, and update infopad values.
The following table describes the custom tags you can use:
Table 16. Custom HTML tags
Tag
Description
<InfopadValue NewTable x y slot>
Causes a variable to be substituted for the infopad value allowing the user to view and modify the value.
<InfopadGetValue NewTable x y slot>
Causes the value of the dataslot to be substituted. No update of the value is possible.
<InfopadStoreValue NewTable x y slot>
Specifies the dataslot to update. Useful in HTML constructs such as SELECT.
<InfopadUpdate button_label>
Specifies the button label along with the action to perform once the button is pressed.
3. Save the HTML file.
4. Update Business Process Portal user’s application file to include information about the new application.
The following is an example of a customized HTML page illustrating the use of the special tags:
<html>
<head>
</head>
<BODY>
<form>
<INPUT Type='text' VALUE='<InfopadValue NewTable 5 5 slot1>'>
<INPUT Type='text' VALUE='<InfopadValue NewTable 4 4 count>'>
<p> </p>
<SELECT <InfopadStoreValue NewTable row5 col5 slot5>>
<option value='value1'><InfopadGetValue NewTable row4 4 slot6>
<option VALUE='value2'><InfopadGetValue NewTable row5 5 slot6>
<option value='value3'><InfopadGetValue NewTable row4 4 slot5>
<option> <InfopadGetValue NewTable row1 col4 slot2>
</select>
<p> </p>
<InfopadUpdate Update>
</FORM>
</BODY>
</html>
The following shows the same HTML file after translation by the servlet, usable on any Business Process Server-supported web browser:
<html>
<head>
</head>
<SCRIPT LANGUAGE='JavaScript'>
function returnfalse()
{    return false;
}function handleform0()
{    var newLocation =     "http://machine:80/BPM Manage API//com.tdiinc.BPM Manage APIr.ApplicationServle
    t.Servlet.ApplicationServlet?serviceType=postApplication&form=form0&
    SessionID=3fe3fb26d5198b5d.1.947286386593";
    newLocation += "&"+"element0="+document.form0.element0.value;
    newLocation += "&"+"element1="+document.form0.element1.value;
    newLocation += "&"+"element2="+document.form0.element2.options[document.form0.
    element2.selectedIndex].value;
    location = newLocation;
}</script>
<body>
<form name='form0' onsubmit='returnfalse()'>
<input type='text' value='15' name='element0'>
<input type='text' value='10' name='element1'>
<p>
</p>
<select name='element2'>
<option value='value1'>
howard<option value='value2'>
howard<option value='value3'>
gary<option>
25</select>
<p>
</p>
<input type='button' name='updatebutton' onclick='handleform0()' value='Update'>
</form>
</body>
</html>
You must create a directory to store your HTML application.