Passing data from popup to specific Flex Repeater instance

I’m developing a page for managing operators in a plant, with functionalities such as handling shifts, vacation days, etc.

To visually represent the data, I created a square label that displays an identifier (letter or number) corresponding to the type of work done on a specific day. The expected behavior is as follows:

  1. The user double-clicks on the label.
  2. A popup opens with the various available options.
  3. The user selects a number or letter.
  4. The popup closes, and the selected value is displayed on the clicked label.

To implement this, I’m using a Flex Repeater that generates one instance per day of the month (arranged horizontally). Vertically, there is one row per operator, resulting in a matrix-like layout.

So far, everything works fine.

The issue arises when I need to pass the selected value from the popup back to the specific label that was double-clicked. I can't figure out how to properly identify the correct instance of the Flex Repeater and update only that one with the chosen value.

What’s the best way to handle passing the selected parameter from the popup to the correct label instance in the Flex Repeater?

This is an example of the view

I don't have a proper answer for you, but thinking aloud...

  • Having a message handler on the Flex Repeater view means that each time you send a message that 30 × 4 onMessageRecieved events would fire. This doesn't seem like a good idea.
  • I'd be inclined to create a session variable to hold the status of the selected values. It would need to be a 2D array.
  • In the Flex Repeater view add in parameters for the row and column. Use these in an expression binding on the indicator labels to refer back to the session property array.
  • Pass the row and column parameters to your popup.
  • On the sendMessage script include the row and column in the payload.
  • Put one onMessageRecieved message handler on the session property and have that update the status array. The repeater views should now update.

I would use a uuid. Generate a UUID in the template using the Java function (just google) and send that to the popup. Send that in the message handler and handle only if the uuid matches.

4 Likes

Would the following work for you?

  1. Store the master copy of the data in the parent view custom props (i.e. custom.operatorSchedule),

  2. Bind flex repeater instances to custom.operatorSchedule (with a transform)

  3. Open your popup (passing index and current value params from your flex repeater instance).

  4. Send your update message from your popup

    #params.index is automatically provided to each flex repeater instance
    system.perspective.sendMessage(messageType = 'updateEntry', payload = {'index': self.view.params.index, 'value': currentValue.value }, scope = 'page')
    
  5. Add message handler on the root container of the parent view to update custom.operatorSchedule

    def onMessageReceived(self, payload):
    	
    	i = payload['index']
    	v = payload['value']
    	
    	self.view.custom.operatorSchedule[i].value = v
    

Any changes to the master data are propagated down to the flex repeater instances and when you need to finally store the edited schedule (i.e. write back to SQL), it is in a form that is easy to handle.

It does seem excessive to update all of the instances when only one changes, but the flex repeater appears to reuse instances when custom.operatorSchedule is modified, rather than re-render all instances. So, I actually can't see a lot of extra overhead from doing it this way? Maybe someone else can comment on this.

That's the solution I usually use (uuid, or something more meaningful when there's such a thing).
You can pass that id to the popup, which in turn sends it back through the payload.
Then you can just filter on this id in the message handler and execute whatever needs to be executed if it matches the instance's id.

I suggest adding a generate_uuid function (I called mine random_id, but that may not be explicit enough). There are a lot of uses for this.
Then you can either assign then when building the repeater's instances, or have a custom prop in each instance with an expression binding like this:

runScript('lib.utils.generate_uuid', 0)