Javascript Validation
From PikaDocs
By Matthew Friedlander
Pika Software (http://www.pikasoftware.com/)
In the Pika CMS Javascript is used in many locations to ensure that users properly enter information where required and point out errors where appropriate. This is more commonly referred to on the programming side as Form Validation. In the below example we will walk through a scenario where a user will be prompted to correct data entered into a form prior to submission via a Javascript pop-up dialog box. Using this technique you can make a multitude of rules that ensure data quality and consistency on data entered in the case screen.
| Table of contents |
onClick or onSubmit?
There are two built-in functions in Javascript that can be used to generate form validation pop-ups. Which one to use depends greatly on the situation of your html form that is being used to enter data. If your form only has a single submit button then onSubmit should be the preferred method as it is designed for this purpose. If, however, you have more than one html button with different functions you will most likely have to use the onClick function for the button that should run the validation. Below are some examples:
onSubmit
<form name="ws" action="update_case.php" method="post" onSubmit="return validate()">
As you can see in the above example the onSubmit function is located in the <form> object of an html page and calls the function validate()
onClick
<input type="submit" name="update_case" value="update" onClick="return validate()">
The onClick function is located in the <input> object of an html page and calls the function validate()
Building the Javascript function validate()
<script language="JavaScript" type="text/javascript"><!--
function validate() {
if (document.ws.problem.value != "" && document.ws.sp_problem.value == "") {
alert('The Special Problem Code cannot be left blank');
return false;
}
else {
return true;
}
}
//--></script>
In the above example we are checking to see that if the Problem Code has been specified but the Special Problem Code has been left blank that the user should be prevented from saving the case until the Special Problem Code has been specified. From the users perspective when they click on the Save button to update the case they will receive a pop-up box with the message "The Special Problem Code cannot be left blank." They will then be able to go back and specify the appropriate information and attempt to save the case again. The validate function itself only returns the values true or false to the onClick or onSubmit that originally called it. If the result is false the submit button will not be allowed to update the case values until the conditions of the validate function are satisfied and it returns the value true.
