Reusable functions with page scope?

I have a page with containers with dynamic list behavior. OnPageEnter, I’m filling these containers by reading data from an API and then do something like
image
All works fine!

Now I want to have a refresh button on my page, which is repeating the same thing which happens OnPageEnter and I was wondering how create one, resusable codeless artifact for this.

“Function” are obviously not adequate because these are only known in the event handler scope.
“Custom Functions” on the other hand seem to have a global (application wide) scope. I tried “Custom Functions” but this failed because it seems that UI component IDs have page scope and cannot be used as a reference in a custom function. As an example: This custom function
image
leads to the error

ReferenceError: ___arguments is not defined

I’ve verified that “contacts” is well-defined, so the issue is with “Container2”. Interestingly, I can select Container2 via the dropdown of “Set Dynamics List Items to”.

How can I create this “data refresh” as a reusable function?

I’ve also tried just to use the “Go To Page name” block to reload the very same page, but this leads to other issues, because the page state is completely lost …

Regards,

Hello @Klaas_Klever

Yes, this kind of block (Set Dynamic List Items…) won’t work properly, because it requires some inner context arguments that are persisted in the EventHandler scope.

What about getting rid off of the block and do not assign items directly to the component, and use the DataBinding approach instead?

You will be able to list the component with some data model (let’s say PageData Model) and when it changes the Components will be refreshed. And in this way, you can create a custom function and pass there a PageDataModel along with other arguments.

What do you think?

Regards, Vlad

Not quite sure if I got it …
Are you referring to the option to use the “Dynamic Items Logic” field of my “Container2”? I would enter the name of a list page data property there and then I would set this list to the result of my Custom Function which refreshes the data.
Might work …

Klaas,

Are you familiar with how data binding works in Backendless UI Builder?
If not, it would be helpful to become familiar with that concept:

Regards,
Mark

1 Like

Yes, I am. Thanks. I just wasn’t thinking about the possibility that the concept is general enough to bind to a dynamically filled container. But now I understand. At the end it’s only about binding to a variable of array/list type.
I tried it successfully. I could get rid of the “Set Dynamic List Items” blocks, so that I can go forward to encapsulate this into a reusable custom function.

Regards,

Hi just to clarify… are you saying there’s no way currently to set a Page Data variable from within a custom function… because custom functions are inherently accessible at the App level? Thanks

Hello William,
I’m passing “Page Data” to custom functions as a parameter. As passing is by reference, you can access/read page data the same way as outside the custom function.

3 Likes

Setting Page Data is not possible with a custom function. Generally not a problem, we can just have the function return an object which we can then set in Page Data. However, we would love to have a custom function running that does things with Page Data and which involves “wait” timers. Basically show a message for a few seconds and then stop showing it… work-arounds are possible of course… but it would be lovely if custom functions could read from and write to App Data :slight_smile:

What’s wrong with passing PageData as an argument into a custom function?

As mentioned above, that is easy to do… but we would love to be able to affect (set) Page Data via a custom function that involves wait timers (so Page Data is modified more than once, with a delay in between).

Our specific use case: we have component(s) on a page bound to Page Data and a “local” function that triggers changes to the components class list (via Page Data). With a timer in the function, we show an alert-type message for a few seconds and then make it disappear again. We will have this kind of message component on all pages and it will be called in various event handlers… it’s a bit tedious to have to re-define the function in every place (and if we ever want to make changes to the function… yuck).

Just saying it would be nice to be able to affect App Data in a custom function (I understand Page Data isn’t possible) :grimacing:

When you pass PageData into a custom function, you can manipulate it’s contents without any restrictions.

1 Like

Wow — you are right! Tested:

  • pass Page Data into a custom function as argument, arg variable is named “PD”.
  • the function manipulates PD over some time
  • Page Data outside of the function does actually change over time

This really is amazing… thank you :heart: