Note: Nintex Apps data centers are located in West US and Australia (AUS). In-region processing of Nintex Apps data is only available in these regions.

Nintex Apps and JavaScript

JavaScript is the key to developer greatness with Nintex Apps. Our robust JavaScript API provides simple functions for performing client-side CRUD operations on any data object from a connected connection, as well as saving this data to your connections' servers. And with snippets and custom components, you can utilize JavaScript for programmatic control and extension of your Nintex Apps implementation.

In this article, we will cover the basics of navigating and interacting with data in Nintex Apps using JavaScript. However, the intricacies of the language are beyond the scope of this documentation. If you are JavaScript beginner, or if you just need a refresher course, please refer to your favorite JavaScript resource. MDN's JavaScript portal is just one of many great options.

How Nintex Apps Accesses Your JavaScript

So, how does Nintex Apps access your JavaScript? In the same way it accesses other custom code:

• Inline resources
• External resources
• Static resources

Get familiar with the console

In addition to these resource types, you can also utilize JavaScript (and Nintex Apps's JavaScript API) through your browser's console. The console is an essential tool in leveraging Nintex Apps's JavaScript API. Make sure you are familiar with the console in your browser of choice:

• Chrome
• Firefox
• Safari
• Edge
• Opera

Pull up your browser's console and type skuid. Now press Enter on your keyboard. You'll see the "skuid" JavaScript object—a powerful artifact containing all of the objects and functions to make you a Nintex Apps development superhero. Depending on your browser, you'll also notice that you can click through to those objects and functions within it.

Guess what? You've just had your first experience with...

The Nintex Apps JavaScript API

Within each Nintex Apps page—both in the Page Designer and at runtime—there is a JavaScript object called Nintex Apps which houses all of the functions, data, and objects of the page. While JavaScript can be used for a variety of purposes (such as DOM manipulation), in Nintex Apps you'll mostly work with Nintex Apps's JavaScript API reference through that Nintex Apps object.

The Nintex Apps JavaScript API can do all of the basic, declarative actions of Nintex Apps, including:

• Query and update data from your connections through models
• Save and cancel data changes
• Set and activate model conditions

But it's also used to make the magic happen. Once you've mastered the JavaScript API, you can use it to:

• Easily debug issues—even declarative ones—on your app pages
• Write JavaScript snippets for page-specific use cases or custom field renderers
• Build custom components that read, display, and write data in almost any way you can imagine.

Strict Mode

Nintex Apps enforces strict mode on its own code.

We recommend builders consistently follow strict mode standards throughout all of their custom code, regardless of deployment context.

Best Practices

Favor action flows over writing JavaScript

While it may seem counter-intuitive as a developer, you should always check to see if the Action Framework can do what you need before writing any JavaScript. The Action Framework has the advantage of being written by the same people who wrote our API, and it has been tested across thousands of orgs in every possible configuration. It's incredibly robust, and it is constantly being updated and refined to work as efficiently as possible.

If you need to run straightforward sequences of actions, such as creating records, querying and emptying models, activating conditions, or even actions that require heavy manipulation of the UI (like messages and modals), then action flows will suit your purposes just fine. Nintex Apps's Page Designer can be used to create these types of user experiences much more quickly than writing code.

In fact, as action flows's capabilities expand, it's a best practice to revisit existing JavaScript code snippets and replace them with actions whenever possible.

So when should I use JavaScript instead of action flows?

Use JavaScript for more complex actions or conditional branching of the action script, or when you want the sequence to be triggered in a scenario or component where action flows aren't available.

Use variables to access objects whenever possible

Nintex Apps's API will return objects and data you'll want to work with as the result of a function. Functions can return JavaScript objects that represent models, components, rows, field data, and other modifiable data:

1
2
3
4
skuid.model.getModel('Opportunity') // Accessing a model //
skuid.component.getById('sk-1IioRB-76') // Accessing a component //
skuid.model.getModel('Opportunity').getFirstRow().Name // Accessing the "Name" field from the first row of the Opportunity model//

Clearly, this can get convoluted very quickly. So for both readability and convenience, use variables for Nintex Apps functions:

1
2
3
4
var Opps = skuid.model.getModel('Opportunity') // Accessing a model //
Opps.getFirstRow().Name // Accessing the "Name" field from the first row of the Opportunity model, but easier!//
var bc = skuid.builder.core //For cleanliness in custom component builders

Do Not Use jQuery's Ready Event to Determine If a Page is Loaded

The jQuery ready event may not accurately reflect when a Nintex Apps page is loaded. While snippets may still run, they may not consistently have access to some Nintex Apps data, such as client-side model metadata.

To reliably trigger snippets when all elements are loaded, utilize Nintex Apps's pageload event.

If your snippet uses either of the below:

$(document).ready(function() {

// Or the following, which is shorthand for the above:

$(function(){

Use the following instead:

$(document.body).one('pageload',function() { // Will fire after the page is fully loaded

If your Nintex Apps for Salesforce version supports it, strongly consider using action sequences. Creating a sequence triggered by the Page: Rendered event, with the Run Javascript snippet action activating a snippet will accomplish the same effect in a less error-prone, more future-proof manner.

Important:  In contexts where there may be multiple Nintex Apps pages loading simultaneously—Page Includes, Salesforce Lightning apps—the above function would trigger based on whichever page loads first, which may not be the the page containing the snippet. Strongly consider using action sequences instead.

JQuery and Nintex Apps

Nintex Apps includes the most up-to-date version of jQuery 3, and jQuery functions are accessible by using the skuid.$ API call. Because Nintex Apps uses this custom namespace to avoid conflicts, you are free to load in any version of jQuery, or any other library, that you'd like to use alongside your Nintex Apps page.

If you choose not load in any other libraries, it's common practice to create a more standard shortcut to JQuery:

1
2
var $ = skuid.$;

After calling this, you have access to all jQuery functions, simply using the $. For example, you can now call $('#unique-id').hide() rather than skuid.$('#unique-id').hide()

Important:  Previous versions of Nintex Apps included jQuery 1. If your code references jQuery 1, read the jQuery Upgrade Guide to ensure your code is properly written for jQuery 3.