In this tutorial we will dive a little deeper into the script to add to SuiteScript modules. The main purpose is to define what a script module is and to demonstrate how to add them to your script. We will use the Dialog module as a point of reference, and we will be adding it to the script we started in the last tutorial. If you have not read the last tutorial, you can do so here: SuiteScript 2.0 Hello World
What is a SuiteScript Module?
I like to think of SuiteScript modules as boxes of tools. Each box has a specific set of tools that your script will need in order to do certain actions in NetSuite. If you don’t include a particular box (module) in your script, your script won’t have access to its tools (functions). For instance, if you want to interact with a record by loading it, getting and setting values on it, saving it, etc., you will need the “record” module. In the script below where we left off in the last tutorial, you’ll notice that two modules are included: the “N/record” and “N/search” modules.
define(['N/record','N/search'], function (record, search) {
/**
*@NApiVersion 2.0
*@NScriptType ClientScript
*/
function pageInit(context) {
alert("My first SuiteScript!!");
}
return {
pageInit: pageInit
}
});
Those modules are not being used at all in this script, but we will be using them down the road. To add a module you would just add it on to the current list. If we add the “N/ui/dialog” module, the script would look like this:
define(['N/record','N/search','N/ui/dialog'], function (record, search, dialog) {
/**
*@NApiVersion 2.0
*@NScriptType ClientScript
*/
function pageInit(context) {
alert("My first SuiteScript!!");
}
return {
pageInit: pageInit
}
});
Notice that I added something in two places. The actual name of the module (N/ui/dialog) was added to the list in the square brackets, and “dialog” was added to the list in the parentheses right after “function” on that first line. Adding “dialog” in the “function” parentheses is what gives your script access to the “dialog” box of tools. It’s like the key to the box. When you want to use a tool (function) in the box you would take that key and do something like this: dialog.useThisTool (where “dialog” is the key and “useThisTool” is the tool). Hopefully my box of tools analogy doesn’t completely confuse you. :)
SuiteScript Module Components
Included in SuiteScript modules are “Members” and “Options”. To keep going with our box of tools analogy, the members are the tools in the toolbox, and each member has options. Options are like the settings for each tool that tells the tool how to act.
Using the dialog module as an example, it has three members: alert, confirm, and create. The alert member is what we’re interested in because we want an alert box to appear that looks like a native NetSuite alert box, not a generic alert box (like we currently have in the script). To add this alert to the code you would start off by replacing alert("My first SuiteScript!!");
with dialog.alert();
. Then we need to include some of the Options (tool settings) inside the parentheses. The main options for dialog.alert are “title” and “message.” I like to put each option on its own line to make it more readable. This is what dialog.alert looks like when you add in the options:
dialog.alert({
title: 'Announcement',
message: 'My first SuiteScript!!'
});
Options
All the options go inside curly brackets, and the options are separated by commas. Each option starts with the name of the option followed by a colon and then followed by the value for that option. In this case the title of this alert box will be ‘Announcement,’ and the message in the box will be ‘My first SuiteScript!!’ The complete script will look like this:
define(['N/record','N/search','N/ui/dialog'], function (record, search, dialog) {
/**
*@NApiVersion 2.0
*@NScriptType ClientScript
*/
function pageInit(context) {
dialog.alert({
title: 'Announcement',
message: 'My first SuiteScript!!'
});
}
return {
pageInit: pageInit
}
});
To update your script in NetSuite to test it, navigate to the script record you created in the last tutorial and do the following:
- 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
Conclusion
Now you can navigate to a customer record and click on edit. You should see an alert box appear that looks just like a native NetSuite alert box.
You can access the next blog in this series here. And don’t forget to subscribe to our mailing list so you can receive our latest developing blogs directly in your inbox each week!
Just wanted to say a quick thank you for taking the time to write out this series of SuiteScript tutorials. I think you do a great job of breaking down the concepts so that they’re easy to understand, even for those with minimal programming knowledge. Nice job!
Thanks so much, Justin! We’re really glad you’re finding these blogs helpful!