You may have noticed that NetSuite displays messages as a colored banner at the top of the page. When you enter a transaction you will see a green banner that tells you the transaction was created successfully. That same message functionality is available to use in your scripting through the “Message” module. With the message module you can have the flexibility to show warnings, errors, and other types of communication to the user.
If you need a refresher on what we’ve covered so far in this SuiteScript tutorial series before jumping into the rest of this post, feel free to check out our previous post; to review the entire series up to this point, you may want to start with the first post, SuiteScript 2.0 Basics.
Adding the ‘N/ui/message’ Module to Your Script
To demonstrate the message module, we will use the script that we have created in previous tutorials. In the last tutorial we learned about the validateField
function, and we were making sure that a user could not enter less than 3 characters in the Job Title field of the Customer record. We did not add any alerts to that customization because the regular alert box doesn’t work well with the validateField
function. So currently there is not any communication to the user when less than 3 characters are entered in the Job Title field. Since that’s not the most user-friendly, we will use the Message module to handle this communication.
The first thing that needs to be done is to add the module to the script so that we can use it. We do that by adding N/ui/message
to the define section and message
to the main function section at the top of the script like this: define(['N/record','N/search','N/ui/dialog', 'N/log', 'N/ui/message'], function (record, search, dialog, log, message)
Here is the full script where we left off in the last tutorial with the Message module added in:
define(['N/record','N/search','N/ui/dialog', 'N/log', 'N/ui/message'], function (record, search, dialog, log, message) {
/**
*@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
}
});
Add a Message in the validateField Function
Now that we have included the Message module in the script, we can add a message to the validateField
function to let users know why they are unable to enter less than 3 characters in the Job Title field. Here is the basic structure of a message:
message.create({
title: 'Message Title',
message: 'The Message',
type: message.Type.CONFIRMATION,
duration: 10000
}).show();
message.create creates the message, and it needs 4 parts:
- The title of your message.
- The actual message that needs to be displayed.
- The type of message. The type determines the color of the message, and there are 4 types to choose from.
- message.Type.CONFIRMATION makes the message GREEN
- message.Type.INFORMATION makes the message BLUE.
- message.Type.WARNING makes the message YELLOW.
- message.Type.ERROR makes the message RED.
- The duration of time before the message disappears. 10000 is 10 seconds.
The .show() at the end of the message is what causes the message to be displayed.
Now we can adjust the message to give us helpful information when a user attempts to enter a Job Title that is less than 3 characters. After adjusting the message, it might look something like this:
message.create({
title: 'Insufficient Job Title',
message: 'The Job Title needs to be 3 or more characters.',
type: message.Type.ERROR,
duration: 10000
}).show();
When you add that to the validateField
function, make sure to place it directly before the return false;
line. After adding that in, here is what the full script should look like:
define(['N/record','N/search','N/ui/dialog', 'N/log', 'N/ui/message'], function (record, search, dialog, log, message) {
/**
*@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){
message.create({
title: 'Insufficient Job Title',
message: 'The Job Title needs to be 3 or more characters.',
type: message.Type.ERROR,
duration: 10000
}).show();
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.
- View the script record (don’t click on edit).
- Go to the “Scripts” tab.
- Click “edit” next to the “Script File.”
- Copy your new code and paste it in the window that pops up to replace the old code.
- Save.
When you navigate to a customer record and edit the Job Title field, the script will not allow you to change the Job Title to anything with fewer than 3 characters; if you try to use fewer than 3 characters, a message will appear as a red banner at the top of the page. You will actually see more than one message because of the way the validateField function works.
Conclusion
If this blog was helpful, check out some of our related posts below. And be sure to subscribe to our mailing list so that you never miss out on our latest blog posts!
Thanks for the post. Can I suggest adding a place to subscribe to your mailing list? I’d love to get an email anytime you make a new post, but I really can’t find a place to do so.
Thanks Justin, I will work on creating a subscription option. I’m glad you are finding our blogs helpful!
Hey Justin, I recently added a subscription option. You can find it on the right side in the widget area. I plan on sending out an email every Thursday to subscribers linking to the latest blog.