I’m hoping you can help confirm what is the recommended way to have a reusable component reference objects on a page? In this case the repeater (list) has fields with an image, name and a property (true or false) if the row is selected.
The top Navigation bar is a reusable component. It has a delete icon. Clicking the delete icon should go through the rows of the repeater list defined on the page and remove any rows that have the selected property set to true.
The reusable component (Navigation bar) does not have access to the repeater list that is defined on the page.
I’m ok with going through the list and deleting items from the database. However, I am not sure on the best approach to have the click event of the delete icon (within the reusable component) actually reference the repeater list object so I can then go through the list and delete all selected items from the database.
Unfortunately, I didn’t clearly understand what you want to do. Do you want to remove items from the repeater without removing them from DB, or are you stuck with handling repeater items from the reusable component?
Also, will be helpful for us if you create a minimal reproducible case and describe what to want to achieve.
Yep your second guess is correct “stuck with handling repeater items from the reusable component”
How do I reference (access) the repeater object/list from the reusable Component?
Don’t worry about a database or deleting anything I can manage that. Let’s just say i want to console print the repeater list defined on the app page from a reusable component.
One of the approaches is using App/Page Data as a proxy. You may use them as data storage for some collections. Bind it to repeater logic. And manage them from the Reusable component by accessing App/Page Data. That should be an easier way to control Repeater List from the Reusable component(and maybe the only way)
Really appreciate the quick response. The Backendless team has the best support!
I will create an app page object and set its value to the repeater list. I’ll reference the repeater in the reusable component through that app page object.
To summarise the question I had in this topic:
When using a reusable component (header) how do I affect a component or objects defined on the main page?
Specifically in my example how do I manipulate the data in a repeater component on the main page when clicking the delete icon within the reusable header component?
Step 3:
Setup the action (On Click) in the reusable component (header) to manage the data in the component/object via the list object defined on the main page.
Step 4:
Preview app. After clicking the delete icon in the reusable component (header) be amazed as your data bound repeater component on the main page refreshes, selected items are removed and only items that were not selected are displayed.
