On-Change Client Side Scripting Scenarios

[Rishi Kendale]

Client Side Scripting

Client scripts run on the client (web browser). You can use client scripts to define custom behaviours that run when events occur, such as, when a form is loaded or submitted, or a cell value changes. Proper client-side processing depends on the form loading completely first. Making record updates prior to form load can produce unexpected results that bypass client-side processing. Client-side Glide APIs (Application Programming Interfaces) provide classes and methods that you can use in scripts to perform client-side tasks.

Users with basic knowledge of JavaScript can define scripts to run in the client browser. Several types of client scripts are supported by ServiceNow. Let us take a look at those:

• onLoad()
• onChange()
• onSubmit()
• onCellEdit()

onLoad()

An onLoad() script runs when the form loads before the user ever sees it. The values on the form are straight from the database. This type of script lets you control how the form first appears to the user.

onChange()

An onChange script runs when the user changes value in any of the field. This script is handy for setting up a value of a field or displaying value based on the values user enters in the other fields. It runs not only on value change for already created records but also for adding value to newly created records.

The onChange Function is automatically passed with 5 arguments by ServiceNow.

• Control − It is the field for which the Client Script is configured
• OldValue − It is the value of the field, when the form is loaded (prior to the change).
• newValue − It is the value of the field after the change.
• isLoading − It is the boolean value indicating whether, the change is occurring as part of a form load. Value is true if, change is due to a form load. When form loads, all the field values on the form changes.
• isTemplate − It is the boolean value indicating whether, the change that occurred, is due to the population of the field by a template. Value is true if, change is due to population by a template.

It refers to whether some onLoad change is happening like if we include 2-3 blocks of code in same client script. And a part of it we are going to run which would be our onLoad. That will be called as it is the change occurring within the template load. When SNOW create OOB functionality, we are just providing values to these functionality. Are we doing any change to values which are provided by SNOW OOB? NO. If we are doing some changes which are reflecting at the backend of OOB values.

NOTE :-

This if block should evaluate to "true", then the code inside if block will be executed as a part of onLoad(). If it returns null, then no code executes as a part of onLoad() page and the script outside the if block will be executed as onChange() as expected.

function onChange(control, oldValue, newValue, isLoading, isTemplate) {

   if ( isLoading || newValue == '') {

      return;

          }

}

Case 1 :  if ( isLoading || newValue == '') {

      return;

   }

==> then the remaining code will run as a part of onChange() as expected

Case 2 :  if ( isLoading == true || newValue == '') {

      return;

   }

==> then the remaining code will run as a part of onChange() as expected

Case 3 : if { } block is removed

          ==> then the remaining code will run as a part of form load first (but there is error since newValue is not available) and then again as onChange()

Case 4 : if { } block is there

if ( isLoading == true || newValue == '') {

      code ....................

      return;

   }

          ==> then the code inside if block will run every time as a part of form load first as well as when newValue becomes null. And then code outside if block is executed as a part of onChange()

Case 5 : If we removed the newValue check

if {

if ( isLoading) {               

      return;

}

==> Then the code inside if block runs as onLoad() as well as onChange().

Remaining code will run as a part of onChange(). But since we have removed newValue() check, when we change the value of the field to blank then it will give an error.

Case 6 :  if ( isLoading || newValue != '') {

      return;

   }

if() condition returns false then

==> then the remaining code will run as a part of onChange() as expected

[Mani Sen]

Good thinking .. Useful

[Shivani Dubey]

It is useful for new learner like me

[Shanthi Reddy]

Good content for beginners

[Ambar Sarangi]

The scenarios are very helpful

[Sam1989]

Good scenarios for developers