Resolving Javascript Undefined Errors

Prerequisites

(1) Knowledge of DesignBais Data Component. Refer to the Database Component Manual

(2) Some understanding of CSS would be useful.

Objectives

• Investigate javascript undefined errors to determine which form elements are referred to and to determine the cause of these errors.

Analyse the Javascript error messages

Javascript errors display in an alert box with an OK button. There is a temptation to click the OK button without actually reading the error message. In general the message will refer to a form element. The starting point is to determine to which form element the message is referring.

DesignBais Field XML Id Structure

text3v1 - input field

label24v1 - text field, search label

select44v1 - input field with dropdown

button44v1 - button

textarea55v1 - textarea

datepickstext3v2 - date field

checkbox33v1 - checkbox

ASSOC1ztext154v2v2v3 - multivalue input grid field [FormGroupName zFieldName vLevelNumber vRow vCol]

tdxspan5v1x1z3 - on-form report cell [TableDefinition xspan vLevelNumber xRow zCol]

Use the Inspect function to determine which form element is undefined

Position your cursor over a form element and right-click. Select the Inspect option at the base of the displayed context menu. This will open the browser console. The image below is from Chrome.

The console displays the properties of the each form element. The id="text3v1" indicates the xml id of the element. This will correspond to the DesignBais field xml id stored in the DBIF.FIELD.XML.LABEL attribute of the DBIFORMS record. This is attribute 41.

text3 is the form element id which will match the DesignBais xml id providing there is no header form. If the form has a header form with say three form elements then the DesignBais xml id will be incremented by 3. For example the id text3  becomes text6.

The integer following the "v" is the level. A base form will display at level one. A modal or layered form that is triggered from the base form will be rendered in the next layer up. For example "v2" indicates a form rendered in level 2.

Review the source code

The error displays when the Close button is clicked. The Close button performs a simple close of the modal form. Checking the MODAL RETURN event source code (shown to the right) reveals that the subroutine is performing a PROCESS.STACK of the base form.

Resolution

The references in the error to text3 and text5 do not have a level number which appears to be the cause of the undefined error. These references should be of the form text3v1 and text5v1. The execution of PROCESS.STACK from the MODAL RETURN slot appears to be the problem.