Are you evaluating the use of Third-party JavaScript libraries in NetSuite? In this article, we are introducing the third-party libraries and giving one example of how to use them in NetSuite.
What are third-party JavaScript Libraries
Third-party JavaScript libraries are a fast and effective way to fill the gap in any JS-powered application. NetSuite supports a variety of such libraries such as jQuery, Bootstrap, and Underscore already. You can also incorporate your own third-party libraries.
![Using third-party plugins in SuiteScript 2.0 Using third-party plugins in SuiteScript 2.0](https://www.nssuccess.com/wp-content/uploads/2021/07/Using-third-party-plugins-in-SuiteScript-1024x313.jpg)
How to use Third Party Libraries with NetSuite?
If you’ve found a third-party library file you want to use from a repository like GitHub, etc, then you will typically want to download the file and store it with the rest of your js files (File Cabinet). This is generally recommended.
Therefore, downloading and storing the new library’s JavaScript with your JS files will have better performance than having it called with an HttpRequest or script tag or with some other method.
Example – Create Custom Alert Messages in NetSuite
In many use cases, you will have to show an alert message box to your users to let them know about an error or notification. The problem with the default alert boxes provided is that they are not very attractive. To improve the browsing experience of your users, the unstyled alert boxes will seem out of place.
In this article, we are going to use a third-party library called SweetAlert which allows us to create alert messages that are Beautiful, Responsive, Customizable, Accessible, and a replacement for Javascript Popup boxes.
Using Sweet-Alert JavaScript Library
Sweet-Alert is a replacement for the “window.alert()” function of JavaScript that shows wonderful modal popup windows. It is a standalone library with no dependencies and is composed of a JavaScript file plus a CSS file.
Third-party library: sweetalert2
Author: Limon Monte
Let’s dig into the process:
- Step 1: Download the sweetalert2 CDN source code at https://cdn.jsdelivr.net/npm/sweetalert2@11
- Step 2: Store the source code in a file with the .js extension and store it with your script files in the File cabinet.
- Step 3: utilizing the popup boxes is a UI function, so ClientScript is used for showing the popup boxes.
In this example, we are going to do a button click which then shows a confirmation pop box.
To make this pop-up work, we need to create a button using the Uservent script and deploy it on your desired record type.
![](https://www.nssuccess.com/wp-content/uploads/2021/07/image2.png)
Create a ClientScript, load the sweetalert2 library source code we have previously saved as a .js file in the File cabinet.
![](https://www.nssuccess.com/wp-content/uploads/2021/07/image3.png)
Create a function in the ClientScript that needs to be called on the button click.
![](https://www.nssuccess.com/wp-content/uploads/2021/07/image1.png)
The above code is the syntax of a sweeralert2 pop-up from the library we have loaded into ClientScript.You can choose a lot of options to configure your alert code. For example, you can change the text on the confirmation button.
When the button is clicked the pop-up is shown as below:
![](https://www.nssuccess.com/wp-content/uploads/2021/07/image4.png)
These pop-ups are customizable and there are multiple pop-ups you can create based on your need.
The SweetAlert2 library makes it very easy for developers to create custom alert messages to show to their users by simply setting the values of a few properties
Conclusion
Third-party libraries are an effective way to customize the Ui of Oracle NetSuite. To know more about this article or to get support on Oracle NetSuite you can connect with our team of expert technical and functional NetSuite consultants.