Set state of JS2Bubble element

I’m using the toolbox JS2Bubble element and I’m wanting to add a workflow step between my ‘run javascript’ code (workflow 1) and the ‘A Javascript to Bubble event’ (workflow 3).

To do so I thought of adding a state to the JS2Bubble element, so the additional workflow (workflow 2) will set JS2Bubble element’s state to ‘yes’ and then the ‘A Javascript to Bubble event’ will trigger, although, I can only reference the JS2Bubble element in its own workflow (A Javascript to Bubble event) and not any additional workflow…

A Javascript to Bubble event:

Additional workflow to set the state of the JS2Bubble element:

I’ve looked around and can’t see any related questions - so I’m assuming its not possible, but here’s hoping. Does anyone have any ideas please?

You can reference the J2B element like any other reference. There is no such limitation.
Is the J2B element in a repeating group? You cannot access elements in a repeating group from a page-level workflow.

@nico.dicagno Ah… yes it is in an RG… Is there a way around this without moving it out of the RG?

So you want to set the state of the JS element from outside of the RG right? Do you want to set the state of all the J2Bs in the RG, just a few, or only 1?

You could use this plugin:

Alternatively you could add a second J2B element inside the RG, set its bubble_fn_ to ‘setState’, and let it trigger an event.
On the workflow you can use a ‘Run Javascript’ block and run bubble_fn_setState()
Add a ‘Javascript to bubble event is triggered’ event and inside that workflow add a ‘set state’ block.

Having said that, why cant you just put a conditioanal on the main javascript to bubble event which checks for the underlying condition instead of checking if the state is yes? Why add the extra step?


Why do you need to set a ‘state’ at all here?

JavaScriptToBubble elements can hold their own values (multiple values actually), which can be referenced just like a custom state. So there’s almost never a need to use custom states when workign with JStoBubble elements (custom states are just variables… and so are JStoBubble element values… there’s no need to use both).

To answer your second question… (about calling JStoBubble elements inside RGs).

There’s no need for any additional plugins to do this… just make sure each instance of the JStoBubble element has a unique function suffix, and just call the correct one in your workflow.

@adamhholmes Thanks! So I’m quite new to using these JS2Bubble elements.


just make sure each instance of the JStoBubble element has a unique function suffix, and just call the correct one in your workflow.

I’m assuming this means I need a JStoBubble element in each of my current JStoBubble (JStoBubble A) element’s parent group(s), within the RG? I should also mention that JStoBubble A is nested within 2 RGs…

If so, I’m not sure how to set them up to set JStoBubble A’s state to ‘yes’. Will I need multiple ‘A Javascript to Bubble events’ or just one ‘run javascript’ event?

Any help here is appreciated! Thanks again

here’s a screenshot of my layout, where the button inside ‘Group additions enter button’ is to be the trigger for setting the state/value of ‘JavascripttoBubble A’, which then triggers its workflow:

My JavascripttoBubble A element’s suffix is ‘Current cells index’ which I believe adds another layer of complexity as I can’t reference it unless the javascript element I’m using to reference A, is also in the same cell as A (I think).
I’m happy to share a link to my editor to make it clearer.

You just need one in each cell (which obviously means you just add a single JSToBubbleElement), but each instance needs it’s own unique suffix.

So just make sure the suffix is unique for each instance, so you can call the correct one when needed. I usually use the unique ID of the Thing the cells contains (e.g. bubble_fn_myFunction_{current cell’s thing’s unique ID}).

Then just use that unique suffix when calling the approroate function.

If so, I’m not sure how to set them up to set JStoBubble A’s state to ‘yes’. Will I need multiple ‘A Javascript to Bubble events’ or just one ‘run javascript’ event?

To set a JSToBubble element value to Yes, first make sure the element can Publish a Value (of type Yes No).

Then just call the function and pass the argument of either true or false (or ‘yes’ or ‘no’).

Okay, so I have one JavascripttoBubble element in each of my 2 RGs, so 2 JavascripttoBubble elements total.

  • JavascripttoBubble A’s element’s suffix is ‘Current cells index, and is date type (its parsing dynamic text from its corresponding cell of the nested RG)

  • JavascripttoBubble B’s suffix is ‘b’ (bubble_fn_b), value type Yes/No (which is in the parent RG).

So from here, how do I call bubble_fn_b’s function and pass its argument of either true or false (or ‘yes’ or ‘no’) to bubble_fn_Current cells index?
And how do I make this ‘yes’ or ‘no’ state a conditional on the ‘JavascripttoBubble event’

If I need to apply a workflow to ‘run javascript’ on JavascripttoBubble B, I can’t reference it since JavascripttoBubble B is still within the parent RG, and the button is oustide of it (Group additions enter button). Or am I misunderstanding?

Thanks for bearing with me…

That won’t work… as I said, each instance needs a unique suffix (here you’ve just got them all as bubble_fn_b_… so firstly, there’s no way to know which one to call, and secondly because there will be multiple JSToBubble elements with the same suffix, the JavaScript call to the function won’t work.

Each instance of the JSToBubbleElement needs a unique suffix

To call it, you just run a JavaScript action to call the function, and pass in the true foals value.

So the JavaScript action will look like this:


Ah I see now… I’ve changed the suffix to ‘bubble_fn_bCurrent cell’s index’ making it unique suffix across all instances of it in the RG.


To call it, you just run a JavaScript action to call the function, and pass in the true foals value.

This is the JS that will run on element B’s ‘javascripttobubble event’

This is the JS that will run on element A’s ‘javascripttobubble event’

Although, the ‘run javascript’ step in the button’s (triggers) workflow I’m unable to reference B to trigger that JS to pass in the true value of B, to A (as the button is outside of the RG)

I have a feeling I’m missing something basic, but for the life of me can’t figure out what?

If anyone can shed some light on what I’m missing that would be super appreciated! Thanks

It looks like you’re running the JavaScript action in the workflow triggered by the JavaScript element… which doesn’t make any sense, and will just results in an infinite loop.

I’m really not sure what you’re trying to do here…

Maybe provide some clarification.

@adamhholmes sure thing! So this is all a workaround for Bubble not having a ‘convert to date’ function really.

My API is returning text that I’m parsing to create a Task. I can’t parse the text to retrieve the date in text format, as my DB field for ‘Date’ is data type date.

As a workaround, I’ve used JS2Bubble element A in the double nested RG, to capture the parent groups API text, parse it, and return the text date value as type Date so I can save it in my DB. It’s suffix is dynamic ‘(current cells index).

What I’m trying to achieve now is to be able to control when JS2Bubble element A’s ‘run JavaScript’ event, and the Create new Task event is triggered. I want it triggered when the user clicks on Board Button (CONFIRM).

Although, I can’t figure out how as that would require Board Button (CONFIRM)’s workflow to reference JS2Bubble element A, which is in a double nested RG, and you can’t reference elements that are inside the RG from an element that’s outside the RG.

So I need a way that the Board Button (CONFIRM) can reach and trigger the Js2bubble element A event, so Js2element A’s workflow can begin.

This is a tricky one to explain for me so I hope I’ve managed to clarify!

I’ve been told by Bubble support that this sort of functionality (two JS2Bubble elements, each nested within RG’s) isn’t possible.

Thanks for all your input @adamhholmes.

Perhaps if there’s a way I can pass the JS2Bubble A’s data to the Board Button (CONFIRM)'s group? and then from there can ‘create a Task’ in the Board Button (CONFIRM)'s workflow?

I’m tempted to start a new topic for this… but here’s a slightly different approach.

I have the following two JS2Bubble elements in the nested RG:

  • bubble_fn_Current_cells_index
  • bubble_fn_cCurrent_cells_index
    each having the (d) or (t) value applied to it.

I then added 2 new JS2Bubble elements (B and D) to the group my button is in, and I’m trying to apply/pass (d) and (t) values to those also.

So now the Button’s workflow event ‘create new thing’ can reference B and D which (I’m hoping) has the values (d) and (t).

I think this is along the right path for the correct approach, although, I’m hitting an error:

I think it’s probably due to the fact that B and D’s suffix is ‘its own value’ - which is empty, making it not unique. So all the values I’m trying to save in the ‘create new thing’ workflow are empty.

I can’t figure out a way to make B and D’s value the same as bubble_fn_Current_cells_index and bubble_fn_cCurrent_cells_index (d) and (t), and also make them match their ‘current cell’s index’.

Again, the above isn’t possible with Bubble… Thanks for the input though @adamhholmes - I really appreciate it.