The purpose of the validateField client script function is to control what can and can’t be entered in a certain field. One example of how you might want to place controls on a field is with the Job Title field on the customer record. You might want it to be at least 3 characters to prevent someone from just entering something like “VP” instead of “VP of Finance.” Let’s take the existing script that we’ve been working with and add the validateField function to prevent that exact scenario from happening. Here is the full script that we have created so far.

define(['N/record','N/search','N/ui/dialog', 'N/log'], function (record, search, dialog, log) {
    /**
    *@NApiVersion 2.0
    *@NScriptType ClientScript
    */
    
    function pageInit(context) {
        var currentRecord = context.currentRecord;
        
        var firstName = currentRecord.getValue({
            fieldId: 'firstname'
        });
        log.debug({
            title: 'Customer First Name', 
            details: firstName
        });
        
        dialog.alert({
            title: 'Announcement',
            message: 'You are viewing ' + firstName
        });

        currentRecord.setValue({
            fieldId: 'comments',
            value: 'Use this area for any customer comments.'
        });        
    }

    function fieldChanged(context) {
        var currentRecord = context.currentRecord;

        if(context.fieldId == 'title'){
            var jobTitle = currentRecord.getValue({
                fieldId: 'title'
            });

            dialog.alert({
                title: 'Job Title Change',
                message: 'Job Title has changed to ' + jobTitle
            });
        }
    }

    function saveRecord(context) {
        var currentRecord = context.currentRecord;

        var comments = currentRecord.getValue({
            fieldId: 'comments'
        });

        if (!comments){
            dialog.alert({
                title: 'Comments Needed',
                message: 'Please enter comments for this customer'
            });
            return false;
        }else {
            return true;
        }
    }
    
    return {
        pageInit: pageInit,
        fieldChanged: fieldChanged,
        saveRecord: saveRecord
    }
    
});

Validate Field Function

Similar to the saveRecord function, the validateField function needs to return either true or false. If it returns true the field is permitted to be changed. If it returns false the field is not permitted to be changed. Here is the basic setup of the validateField function.

function validateField(context) {
    var currentRecord = context.currentRecord;

    return true;
}

The var currentRecord = context.currentRecord; line is needed to give us access to the record and ultimately the “Job Title” field. The return true; line will allow the field to be changed if it passes the validation. Between those two line is where we will add the code to validate the “Job Title” field to make sure it contains at least 3 characters.

We also need to add validateField: validateField to the return section at the end of the script.

return {
    pageInit: pageInit,
    fieldChanged: fieldChanged,
    validateField: validateField,
    saveRecord: saveRecord
}

Validate The Job Title Field

Now we can start adding the logic to validate the “Job Title” field so that 3 or more character are required. The first thing we need to do is find the internal id of the “Job Title” field. When you look at the NetSuite Record Browser, you will notice that the internal id of that field is title.

We will add a conditional “IF” statement to make sure we are only validating the “Job Title” field and not any of the other fields. To get the internal id of the current field being changed we will need to use context.fieldId. Here is the updated function with the basic “IF” statement that checks to see if the current field id is equal to title.

function validateField(context) {
    var currentRecord = context.currentRecord;

    if (context.fieldId == 'title'){

    }

    return true;
}

Inside the curly brackets of the “IF” statement is where all the logic will go. We need to get the value of the “Job Title” field and then get the number of characters.

  1. Get the value of the “Job Title.” Since we did this before in a previous tutorial, I’ll just copy that below.
var jobTitle = currentRecord.getValue({
    fieldId: 'title'
});
  1. Get the character count of the “Job Title.” There is a simple javascript way to get the character count of a string which is adding .length to the end of the variable. To get the character count of jobTitle, we will create another variable to store the count and we would write something like this: var jobTitleLength = jobTitle.length;.

Once you add this into the “IF” statement, the validateField function should look like this.

function validateField(context) {
    var currentRecord = context.currentRecord;

    if (context.fieldId == 'title'){
        var jobTitle = currentRecord.getValue({
            fieldId: 'title'
        });
        var jobTitleLength = jobTitle.length;
    }

    return true;
}

Add “IF” Statement

Now we need to add another “IF” statement that compares the character length of the “Job Title” field to make sure it is not under 3, and if it is we will return false; to prevent the field from being changed. This “IF” statement will still need to be inside the other “IF” statement and right after the jobTitleLength variable.

The condition for “If Job Title Length is less than 3” is if (jobTitleLength < 3).

And the alert message can be set up like this:

dialog.alert({
    title: 'Insufficient Job Title',
    message: 'The Job Title needs to be 3 or more characters.'
});

Inside the “IF” we need to add the return false; line to prevent the field from being changed. The updated function looks like this.

function validateField(context) {
    var currentRecord = context.currentRecord;

    if (context.fieldId == 'title'){
        var jobTitle = currentRecord.getValue({
            fieldId: 'title'
        });
        var jobTitleLength = jobTitle.length;
        if (jobTitleLength < 3){
            return false;
        }
    }
    return true;
}

Once we add the function to the rest of the script, the whole script should look like this.

define(['N/record','N/search','N/ui/dialog', 'N/log'], function (record, search, dialog, log) {
    /**
    *@NApiVersion 2.0
    *@NScriptType ClientScript
    */
    
    function pageInit(context) {
        var currentRecord = context.currentRecord;
        
        var firstName = currentRecord.getValue({
            fieldId: 'firstname'
        });
        log.debug({
            title: 'Customer First Name', 
            details: firstName
        });
        
        dialog.alert({
            title: 'Announcement',
            message: 'You are viewing ' + firstName
        });

        currentRecord.setValue({
            fieldId: 'comments',
            value: 'Use this area for any customer comments.'
        });        
    }

    function fieldChanged(context) {
        var currentRecord = context.currentRecord;

        if(context.fieldId == 'title'){
            var jobTitle = currentRecord.getValue({
                fieldId: 'title'
            });

            dialog.alert({
                title: 'Job Title Change',
                message: 'Job Title has changed to ' + jobTitle
            });
        }
    }

    function validateField(context) {
        var currentRecord = context.currentRecord;

        if (context.fieldId == 'title'){
            var jobTitle = currentRecord.getValue({
                fieldId: 'title'
            });
            var jobTitleLength = jobTitle.length;
            if (jobTitleLength < 3){
                return false;
            }
        }
        return true;
    }

    function saveRecord(context) {
        var currentRecord = context.currentRecord;

        var comments = currentRecord.getValue({
            fieldId: 'comments'
        });

        if (!comments){
            dialog.alert({
                title: 'Comments Needed',
                message: 'Please enter comments for this customer'
            });
            return false;
        }else {
            return true;
        }
    }
    
    return {
        pageInit: pageInit,
        fieldChanged: fieldChanged,
        validateField: validateField,
        saveRecord: saveRecord
    }
    
});

Update the Script Record and Test

Now you can update your script record and test. Here is reminder for how to update the script record.

  1. View the script record (don’t click on edit).
  2. Go to the “Scripts” tab
  3. Click “edit” next to the “Script File”
  4. Copy your new code and paste it in the window that pops up to replace the old code.
  5. Then save

When you can navigate to a customer record and adit the Job Title field, the script will not allow you to change the Job Title to anything with less that 3 characters. It would be nice to show an alert to the user at this time, but the regular alert we have used in these tutorials will not work with the validateField function. In the future we will learn about another type of message that will work and that will make this a little more user friendly.

Add Sublists to a Suitelet (Build a Suitelet, Part 3)

With the 'ui/serverWidget' module, we can add custom sublists to our Suitelet page. In this tutorial, we will cover the basics of adding Suitelet sublists, as well as some helpful tips to help you along the way. If you're new to this mini-series about creating...

Build a Suitelet with the ‘ui/serverWidget’ Module Part 2

If you're new to this mini-series on how to create a Suitelet, check out our first part of the series here! How to Make Suitelets Look Like NetSuite Suitelets are an incredibly powerful tool. Not only are they great for making completely custom pages in NetSuite (like...

Build a Suitelet with the ‘ui/serverWidget’ Module Part 1

Introduction to Suitelets Suitelets are, in simple terms, a kind of page in NetSuite we can use any way we want. We can use SuiteScript modules to imitate the NetSuite user interface, or we can even use custom HTML to display our own unique information and UI....

Debugging Scripts with the SuiteScript “N/log” Module

About Logging Debugging your scripts is perhaps the most important skill as a developer, next to writing actual code. Debugging is a key to open many closed doors, and an eye to see through many thick walls. Several months ago, we made a blog about the basics of...

Using the ‘N/search’ SuiteScript Module

Searches in SuiteScript 2.0 The Search Module is an important key to coding effectively in NetSuite. Although there are numerous methods that this module supports (which the help documentation defines in detail), we will just address the three most commonly used...
2
0
Would love your thoughts, please comment.x
()
x