HTML Form data validation with Object REXX (Windows)
Hello,
here is another example of how to use Object REXX script code in a HTML
page
(IBM Object REXX for Windows V2R1 & Microsoft Internet Explorer).
This time, the example demonstrates three things:
1. How to validate the input data of a form with a script,
2. how to insert data into a form by script and
3. how to use "global" (by definition of Windows Scripting) variables.
It is often desirable that data the user has entered into a form is
validated
before it is sent away. Here, it is checked whether a certain value is
numeric
and whether the choice from a drop-down list is valid.
Further, this example shows how to dynamically fill data into a form.
And
finally it shows how to make use of the feature of "global" variables
(variables the scripting engine considers global).
Here is the source code:
----file begins here
<HTML>
<HEAD>
<TITLE>Object REXX and WSH #3</TITLE>
<SCRIPT LANGUAGE="Object REXX">
/* The next REXX line is "immediate code" in the WSH
terminology. It gets executed right away.
The variable LANGUAGE will from now on be a
"global" variable whose contents can be accessed
with the VALUE-BIF and the WSHPROPERTY selector */
language = (navigator~userLanguage)~substr(1,2)
/* This verifies that the data in the form is correct.
If it is, .true is returned, .false otherwise. */
::ROUTINE verifyForm PUBLIC
proceed = .true
form = document~forms~item(0)
check = form~item("verify")~checked
if check == .true then do
amount = form~item("amount")~value
if datatype(amount) \= "NUM" then do
proceed = .false
call alert "Please enter a numerical value for the amount!"
end
selection = form~item("flavor")~value
if selection = "" & proceed == .true then do
proceed = .false
call alert "Sorry, this item is out of stock!"
end
end
return proceed
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT LANGUAGE="Object REXX">
/* Obtain the language value from the script code
that was executed above */
language = value('LANGUAGE',,'WSHPROPERTY')
select
when language = 'en' then greeting = "Welcome!"
when language = 'de' then greeting = "Willkommen!"
when language = 'es' then greeting = "Bienvenido!"
when language = 'fr' then greeting = "Bienvenue!"
otherwise
greeting = "Welcome!"
end
/* Print the greeting in the language of the user, if it is supported.
Otherwise, print it in english. */
document~writeln("<H1>" greeting "</H1>")
</SCRIPT>
This example shows how to verify the input data of a form before
submission.
<!-- Usually, the input data goes to a CGI script or similar that
processes
the data. Here, an eMail is sent that will be ignored... !-->
<FORM NAME="icecream"
METHOD=POST
ENCTYPE="text/plain"
onSubmit="if verifyForm() == .false then return .false"
LANGUAGE="Object REXX">
<TABLE>
<TR>
<TH BGCOLOR="#cccccc" COLSPAN=2>Ice Cream Order</TH>
<INPUT TYPE=HIDDEN NAME="X" VALUE="IGNORE THIS NOTE">
</TR>
<TR>
<TD>Amount</TD>
<TD ALIGN=RIGHT><INPUT NAME="amount" SIZE=5 VALUE="0.5">kg</TD>
</TR>
<TR>
<TD>Flavor</TD>
<TD> <!-- The selection is left empty intentionally. It will be filled
by script code after the FORM-Tag. !-->
<SELECT NAME="flavor" SIZE=1></SELECT></TD>
</TR>
<TR>
<TD></TD>
<TD><INPUT TYPE=SUBMIT><BR>
<INPUT TYPE=CHECKBOX NAME="verify" CHECKED>Verify form data</TD>
</TR>
</TABLE>
</FORM>
<SCRIPT LANGUAGE="Object REXX">
/* This script fills in the data in the form. Of course, since it
is static, it could easily have been done by stating the items
in the SELECT-Tag. Imagine the icecream information here was
obtained in a dynamic way... */
form = document~forms~item(0)
selection = form~item("flavor")
do i over .array~of("Strawberry", "Vanilla", "Peppermint", "Chocolade",,
"Apple", "Banana (out of stock)", "Cherry (out of
stock)")
option = document~createElement("OPTION")
option~text = i
/* If this item is out of stock, set the value attribute
of the option to an empty string. Otherwise, text and
value of the option are the same. */
if i~pos("out of stock") > 0 then
option~value = ""
else
option~value = i
selection~add(option)
end
</SCRIPT>
</BODY>
</HTML>
----file ends here
In our documentation "Object REXX for Windows Reference" (chapter 21),
these things are described in detail. Here is a link to the download
page for the documentation:
http://www.*-*-*.com/ #public_pdf
The following link will take you to a reference on the objects that
can be used inside the Internet Explorer:
http://www.*-*-*.com/
Kind regards,
Jan Engehausen, REXX Development, IBM Germany