Repeater: unSelect product from repeaters needs to deselect the check box from different repeater

advanced-prototyping
repeater-widget
#1

Hello Guys!

I’ve tried many things now. what I am trying to do is when deleting product from the bottom widget the checkbox of the same product in the top widget should be unselected.

I used repeated for both widgets.

https://d8lqcw.axshare.com

Comparsion.rp (1.9 MB)

55%20PM
Screen Shot 2021-06-21 at 5.28.55 PM.jpg3230×1576 448 KB

#2

I’ve found that controlling/maintaining checkboxes in repeaters can be tricky, especially when they need to be set from outside as well as inside the repeater, and/or support row updates, filters, sorting, etc. By default a checkbox will change its own selection state (“true” = checked; “false” = unchecked) on click. If you need to “remotely” change this selection state for a unique row (from outside the repeater) and/or maintain its selection state when a repeater gets “touched” then things get out of whack.

This updated file may not be the most elegant solution, but it works and should be a reliable method.
Comparsion.rp (2.3 MB)

Here is what I changed:

  • I added a column to the “Accommodation list” repeater, named “Compare”, so the checkbox state can be tracked and maintained row by row.
  • I added a global variable, “CompareList” to track which items have been checked for comparison. (You can change this global variable to text on a widget if you’d prefer.)
  • I added a hotspot over the “Compare” checkbox (and named the checkbox “cb_Compare”)
    • The hotspot’s Click or Tap has one action: update “This” (same) row so the Compare column value is set to [[!LVAR1]] , where ‘!’ is the logical “NOT” operator and LVAR1 points to “is selected of” cb_Compare"
    • Thus, the hotspot toggles the selection state of the checkbox via the repeater’s Item Loaded event.
    • An added benefit is your Mouse Enter and Mouse Exit events to show/hide your tooltip widget now works. It didn’t work when these events were assigned to the checkbox widget (bug?)
  • I added 3 cases to the Item Loaded event:
    • Case 2, compare gets checked
      • [[Item.accommname]] gets appended to CompareList
      • A row is added to the “comparison table” repeater (pasted from your checkbox)
      • (Dynamic Panel) set to State 1 (pasted from your checkbox)
      • Wait 10 ms (this accommodates your current method of disabling the checkbox after 4 items selected. Without this wait the fourth checkbox gets disabled before its state can be changed.)
      • The “Counter” text is incremented (pasted from your checkbox)
    • Case 3, compare is (already) checked
      • just checks on the checkbox
    • Case 4, compare gets unchecked
      • Removes [[Item.accommname]] from CompareList
      • unchecks checkbox
      • The “Counter” text is decremented (pasted from your checkbox)
      • The corresponding row in “comparison table” repeater is deleted. The rule for this is:
        [[TargetItem.accomname == Item.accomname]] (so the “Rotate” listener event no longer needed)
  • In the “comparison table” repeater I made one change. I added an action to the hotspot for your “remove” button, before “this row” is deleted:
    • Update Rows
      Accommodation list set Compare to “false” where [[TargetItem.accomname == Item.accomname]]
      • This is the “magic” to remotely uncheck a checkbox in your top repeater–as long as that repeater knows how to handle it–thus all the changes to that repeater’s code.

There is still a potential issue: An item can be removed from “comparison table” either by clicking the ‘X’ button in that repeater, or unchecking the checkbox in “Accommodation list” except when there are 4 items chosen. At that point, all the checkboxes are disabled. So, you might want to rethink your logic for this, figuring out a way to disable only the unchecked boxes. Several ways you could do this, including adding another column for “DisableCompare” or somthing like that.

Repeater chips/tags and checkboxes help
#3

Thank you so much for helping me. it is a great solution.
there only one problem which when I delete products in the bottom widget from left to right it deletes 2 products at once from right to left it works well.

Not sure what could be the reason for this bug.

Appreciate your help

#4

Well that’s no good! Looking at the code again, I notice the “remove” button hotspot has two actions: Update Rows of Accommodation List repeater, and Delete This Row (which I kept from your original) --but, when Accommodation list is updated–to uncheck the corresponding row’s checkbox–it also deletes the row in the comparison table repeater. Removing the “Delete This Row” from the hotspot fixes this issue.

A classic case of trying to do the same thing at the same time in two different places. I can’t decide if I’m surprised it worked at all, or if I’m surprised it failed. :thinking: The best guess I can fathom is the “Update Rows” action causes the current Comparison row to be deleted, and then the “Delete This Row” action happens just after, but “This” gets shifted to the next row, so that next row gets deleted. If there is no next row (rightmost item) that action just gets ignored.

#5

Thank you so much for helping me solve this problem and taking the time to detail the logic.

Much appreciated.