Using the onSubmit Event

When a form first appears, default values are loaded into two hidden fields: actionBtn and procName. The default value for procName is lw_change* (a stored procedure in the Eval database) and the default value for actionBtn is CHANGE.

Clicking Change fires the onSubmit event and calls the update function, which is the event handler for onSubmit. First, update determines whether the action is an add or a change. A missing GroupId indicates that this is a new record and script changes the values for procName and actionBtn. The following code fragment is from the update function in Group.htm. The validateForm function (see Using IsValid.js to Validate Data on the Client) validates the content of the form. If an entry is invalid, no additional code runs; the function returns a value of FALSE and the submission of data stops.

All forms contain similar code but only Person.htm and Group.htm include a call to the updateInfo function. Translating Check Boxes to Data Values explains the script in the updateInfo function.

function update() {
   var theForm = document.frmGroup;
   if(validateForm(theForm)){
      if (theForm.GroupId.value.length == 0) {
         theForm.procName.value = "lw_addGroup";
         theForm.actionBtn.value = "ADD";
      }
      updateInfo();
      clearDirty();
      return true;
   }
   else
      return false;
}

As shown in the following code fragment, the action attribute of the form contains the URL "..Scripts/postIt.asp" and postIt.asp is called. Using postIt.asp describes the next step in the process of adding or changing data.

<form name="frmGroup" action="../Scripts/postIt.asp" method="post" target="postIt" onSubmit="return update()" onReset="refresh()">

Note  The following code fragments show the definitions of the Change and Delete buttons:

<button id="cmdSubmit" type="submit" class="Button" tabIndex="19" style="WIDTH: 100%" LID="btn1">Change</button></td>

<button class="Button" tabIndex="21" style="WIDTH: 100%" onClick="remove()" DISABLED id="button2" name="button2" LID="btn3">Delete</button></td></tr>

Translating Check Boxes to Data Values

When a user updates data in the Group or User form, the state of the check boxes is copied to the MeetingDays and ReleaseInfo fields. The following code shows the updateInfo function in Group.htm, but Person.htm contains similar code. The chks array contains the id values of the seven check boxes. The updateInfo function is called from the update function, which Using the onSubmit Event describes.

function updateInfo() {
   var info = "";
   for (var i=0; i<chks.length; i++) {
      info = info + (document.all(chks[i]).checked?"1":"0");
   }
   document.frmGroup.MeetingDays.value = info;
}

Translating Data Values for Check Boxes describes the code that copies the values from the ReleaseInfo and MeetingDays fields into the state information for the check boxes that appear on the forms.