Global variable custom JS

[pitt2k]

Hi,

Stupid question. I have a file upload workflow is custom JS action that is creating a new object:

var cInstance = new Cro(imgContainer, {
viewport: { width: 200, height: 200, type: “square” },
boundary: { width: 400, height: 400 },
enableResize: true,
});

Then I have a Button and I’m trying to use OnClick workflow with the following custom code:

cInstance.result(‘canvas’).then(function (result) {
// some code
});

I’m getting message: “cInstance is not defined” when clicking the button.

How can I make my cInstance available to the JS under the button Onclick workflow?

Thanks,
p.

[luka]

Can you post image of your workflow and the codes in there

[pitt2k]

File upload workflow

Button workflow

After clicking Crop button

[Broberto]

How are you loading croppieInstance?

[pitt2k]

It is a croppie npm loaded and there is a loading script added to the page custom code. Other than this is the code that you see on the screenshots.

[pitt2k]

Another, simpler example.
I have a text element, OnClick creates a variable with props of that element:

I have a button with OnClick workflow that changes the text (using the variable from above):

I get the error:

btw: when I do the same from the webrowser’s console it works fine:

So, the real question is, how can I make my custom js variable global so that I can refer to it from everywhere?

[Broberto]

Code blocks don’t communicate with the “outside world” you either need to save it via Change Variable Value in a variable (object) as a reference. To use croppie, you should see an NPM variable in your variables - you should use that, otherwise it’s not imported correctly.

[pitt2k]

Yep, you’re right. I have used the NPM variable and it works.
Thanks for your help!