Validating a Form With JavaScript

JavaScript is an object-oriented, interpretive language used with HTML to provide dynamic capabilities to otherwise static webpages.

A JavaScript function included in an HTML page is processed and executed by the web browser. Integrating a JavaScript function into an HTML page that calls WebFOCUS, or a page that displays a report, enables you to:

Validate entries on a form before submitting them to WebFOCUS. Validating entries prevents a user from requesting restricted or unavailable data. This topic describes how to code a JavaScript function that checks for a user entry on a form.
Perform calculations on data returned in a WebFOCUS report. JavaScript offloads data processing demands from the Reporting Server to the web browser. See Enhancing a User Interface for an example of a drill-down report illustrating this feature.

You have many additional design capabilities with JavaScript. See your JavaScript documentation for details on JavaScript techniques and syntax.

Example: Checking For a User-Supplied Value on a Form

Note: For information on where to store the files created in this example, see Defining and Allocating WebFOCUS Files.

Create a launch page named VALIDATE, which calls a JavaScript function named checkInput. This procedure must be accessible to the web server.

The sample launch page uses the Servlet.

Launch Page: VALIDATE.HTM

<HTML>
<HEAD>
<TITLE> WebFOCUS Report </TITLE>

<SCRIPT LANGUAGE=JAVASCRIPT TYPE="TEXT/JAVASCRIPT">
function checkInput() {
  if(document.form2.STATE.value == "") {
    alert("You must enter a value for the state!");
    return false;
  }
    else {
      return true;
    }
  document.form2.submit();
}
</SCRIPT>

</HEAD>
<BODY>
<H4 ALIGN=CENTER>State Inventory Report</H4>
<HR>
<FORM ACTION="/ibi_apps/WFServlet" METHOD="get"
TARGET="_blank" NAME="form2" onSubmit="return checkInput()">
<INPUT NAME="IBIF_ex" VALUE="stsales" TYPE="hidden">
<P ALIGN=LEFT NOWRAP><PRE>
<B>Enter a state (for example, CA or NY): </B><INPUT NAME="STATE" 
TYPE="text" SIZE="2">
</PRE></P>
<P><PRE></PRE></P>
<P>
<INPUT NAME="submit" TYPE=SUBMIT VALUE="Run Report"> 
<INPUT NAME="reset" TYPE=RESET VALUE="Clear Form">
</P>
</FORM>
</BODY>
</HTML>

Create a procedure named STSALES, which generates an inventory report for eMart, in the state the user requests.
Procedure: STSALES.FEX
```
TABLE FILE CENTORD
SUM QTY_IN_STOCK BY STATE BY STORENAME BY PRODNAME
WHERE STATE EQ '&STATE'
WHERE STORENAME EQ 'eMart'
END
```
Run the launch page.
Without entering a value for the state, click Run Report. The following message displays: