Custom code + NPM modules

Custom JavaScript Functions

Retool supports custom JS libraries. To add your own JS code, click on your profile picture dropdown in the upper right, then go to the Organization Settings page and navigate to the Advanced tab. You will need to be an admin user to add custom JS.

🚧

For security reasons, all JS runs in a sandbox.

If JS ran directly on your page, other people in your org could XSS you. To prevent that, we execute all JS in a separate iframe, on a different domain.

That means that inside of your preloaded JS, you won't be able to use jQuery, or other hosted libraries to create your own components, listen to events on the Retool page, etc.

You can now define the functions you want by assigning them to the window scope:

Creating a very helpful function.

You'll then be able to your custom helpers inside {{ }} snippets, in Transformers and Javascript. Here's some quick examples!

Helping out in {{ }}.

Helping out in a transformer.

Custom Javascript Libraries + NPM modules

You can also pull in libraries from external URLs. For example, you could add papaparse by adding the URL https://cdnjs.cloudflare.com/ajax/libs/PapaParse/4.6.0/papaparse.js to the Libraries section. Then, you'll have papaparse available inside all your JS queries, {{ }}, etc.

Many libraries can be loaded this way. Here's a list: https://cdnjs.com/libraries/

If you would like to have Retool load a JS Library from a URL, you can scroll further down in the Code tab and add whatever libraries you want!

Added the Papa Parse library from a CDN.

Updated about a month ago


Custom code + NPM modules


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.