Make JS value usable via Expression element (Toolbox)

Hi there,

I’m struggling with this problem and can’t get any further:

I tried to extract the myVariable value from this JS code:
https://jsfiddle.net/fu204zoL/2/

and make it usable via the Expression element from the Toolbox Plugin. But I failed.

What must the JS code or what must the Expression be? I only managed to output the result via innerHTML as shown in the example. However, I only need the value itself to be able to use it via the Expression element.

Thanks in advance!

Hi @tomnovo!

Do you already have a Javascript to Bubble element in your editor? Can you share some images of how you configured it?

Is this JS code (shared above) in any step of your workflow?

Hi @rpetribu ,

thanks for your message!

No, so far I am not using any workflows for this.

Here is what I tried so far:

Overview

Text myVariable is
Text

HTML Code
HTML

Expression element JS Code
JS Code

Expression element myVariable
myVariable

The Debugger reports that the myVariable is not defined.

Now I have to put <div class="print"></div> somewhere to show the myVariable value. That works. But I want to be able to put only the value itself into the myVariable expression in order to handle it as I like (e.g. formatting, save to database).

You know what I mean?

I am very grateful for any help.

No no no …this is totally wrong :sweat_smile:

After downloading the Toolbox plugin you will notice that you have a new element to drag and drop into your editor, called JavaScript to Bubble. Drag and drop this element. This is the element you will use to receive the variable from your JavaScript snippet and make it visible to Bubble.

image

Note that in my case, I am expecting to receive a NUMBER as variable.

Also, in your workflow section

You will use the function “bubble_fn_xxxxx ()” to pass the result to your Bubble element. In our case, the function is “bubble_fn_text ()”. As you can see, after I run the code, I can load the result anywhere I want…

The result:

image

I made this for you. Click to check the editor.

1 Like

Thank you very much, @rpetribu ,

is there a difference using the “Expression” element or the “Javascript to Bubble” element in combination with a workflow? Is it always best to initiate JS code via a workflow on page load?

My example above also works with the “Expression” and “HTML” element. With the exception that I can’t “read” the myVariable from this JS function:

https://jsfiddle.net/fu204zoL/2/

Does anyone know a little bit about JS? I think the function needs some tweaking to make the value of the myVariable universally accessible.

None of the solutions provided worked for me.

I’ve implemented a few different options (on elements, with json in/out, …) and the one that I like the most is the one where I place an workflow action (runs on workflow request) or element (every time something changes), where the javascript runs. Then I have a set of “input elements” that are triggered “changed” by the javascript when the respective value is updated. There are several “input elements” that correspond to each type.

If there is interest, I may publish it as a mod…

The Javascript to Bubble is used basically to pass variables from Bubble to your JS code and vice-versa, allowing you to perform complex operations in JS and send the result back to Bubble in just a second.

If you are looking to elements where you can just write some JS to make adjustments or add some functionality to your app, you can use whatever you want, such a “HTML element”, as you said.

Thanks for your help up to this point.

But unfortunately my problem is not solved yet.

My original question was about how to pass the myVariable value (7000) to Bubble as a pure number and not within the div container:

https://jsfiddle.net/fu204zoL/2/

Are there people here who know a bit about javascript?