Support Topics Documentation Slack YouTube Blog

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