isContentChanged function

If your task allows users to save input values, modified content, or selections, consider defining an isContentChanged function that checks for unsaved changes before z/OSMF closes the task. This prevents users from inadvertently discarding their work.

Invoking the function

The isContentChanged function must be defined off the zosmfExternalTools object. To define the isContentChanged function, use the syntax that is shown in Figure 1.

Figure 1. Syntax to use for the isContentChanged function

window.zosmfExternalTools.isContentChanged = ( ) => {
   //Define your function here.
   //Return either true or false.
   return true|false;
}

z/OSMF core calls the isContentChanged function that is provided for your task when a user clicks the X icon to close the tab that contains your task or when your task calls the programmaticallyCloseTask function.

Return values

The isContentChanged function returns a Boolean value, which indicates the following:

true: Indicates that changes are pending. In this case, z/OSMF core displays a prompt that warns the user that unsaved changes are to be discarded. It gives the user the option to proceed with closing the task or to cancel the close task request. Figure 2 depicts a sample prompt.
Figure 2. Sample confirmation window for a close task request
False: Indicates that no changes are pending. In this case, z/OSMF core closes the task tab and does not display a prompt.

Note: If the zosmfExternalTools object or the isContentChanged functions do not exist, z/OSMF core displays a prompt, regardless of whether changes are pending.

Example

Suppose your plug-in contains a task that has multiple editable fields on a single page. When the user clicks the X icon to close your task tab, you want to check for changes for each field. Figure 3 provides sample code that you can use for this scenario.

Figure 3. Sample code for the isContentChanged function

//When the page is created, call the internal _isContentChanged() function.
ngAfterViewInit() {
   window.zosmfExternalTools = {};
   
   //Define the isContentChanged function.
   window.zosmfExternalTools.isContentChanged = () => {
     return this._isContentChanged();
   }
}
//Determine if the content was changed.
_isContentChanged(){
... },