Cascading drop-down values using repeaters


#1

Hello friends,

I have 3 custom drop-down lists which are created using repeaters. Choosing a value from drop-down 1 will drive the list of values in drop-down 2 and choosing a value from drop-down 2 will drive the value set for drop-down 3.

Is there a way to achieve this using repeaters?

Whether this is solvable using 3 repeaters or 1 repeater isn’t a restriction as long as the solution is achievable using repeaters.

Thanks!
-Mani B


#2

Yes, you can do this with three repeaters–one per list. Apply filters to change which values/rows are shown. So, if the selected value of list 1 determines which rows are shown in list 2, then the datasheet for list 2 needs to include all the possible rows for any selection from list 1–but only a portion of which would be shown for any selected item.

Depending on the taxonomy of your set–lists 1, 2, and 3–the solution can be pretty simple or quite complex. For instance, are the parent-child relationships exclusive or overlapping? Can multiple items be selected from a list?

As a basic example, look at the classification system in Biology. Limiting the scope for demonstration here, the first 3 lists would be Kingdom, Phylum, Class.

List 1, Kingdom, could have a datasheet with one column and a row for each kingdom, e.g., Animalia, Plantae, Protista, (etc.).

List 2, Phylum, would need at least two columns: one to represent which kingdom (parent) the phylum name belongs, and one to represent the name of the phylum (child), e.g.,
Column1 | Column2
Animalia | Arthropods
Animalia | Molluscs
Animalia | Chordates
Animalia | etc.

Plantae | Anthocerotophyta
Plantae | Bryophyta
Plantae | Charophyta
Plantae | etc.

Protista | Amoebozoa
Protista | Bigyra
Protista | etc.

List 3, Class, could have 3 columns, like:
Column1 | Column2 | _Column3
Animalia | Arthropods | Insects
Animalia | Arthropods | Crustaceans
Animalia | Arthropods | etc.
Animalia | Molluscs | Gastropods
Animalia | Molluscs | Bivalves
Animalia | Molluscs | etc.
Animalia | Chordates | Cyclostomates
Animalia | Chordates | Vertebrates
Animalia | Chordates | etc.
…but the “kingdom” column would not be absolutely necessary, because a row with an Arthropod would by definition be within Anamalia.

So, if a user selects “Animalia” from List 1, it would apply a filter to List 2 with a rule something like, [[TargetItem.Column1 == Item.Column1]]

If your second or third list gets too long or unwieldy, you could split it into multiple repeaters. Put each “sub-list repeater” in separate state of a dynamic panel. For instance, List 2, Phylum could have DP with state for Animalia, Plantae, Protista, etc. Then, instead of filtering one list, just change the DP state.


#3

Thanks for the detailed explanation as usual @mbc66. I’ve a question: What would be the difference between TargetItem.Columnname and and Item.Columnname?

I’m asking as the explanation provided here: https://docs.axure.com/axure-rp/reference/repeaters/#item-and-targetitem is not very helpful.


#4

Good question. If it is not obvious, “Item” means the same thing as “Row” in a repeater, where [[Item.]] is a logical pointer to a row. For example, [[Item.Column0]] points to (or refers to) the data in “Column0” for that row. Normally, if you are referring to a single repeater from outside the repeater, or referring to the “same row” within a repeater, you just use Item as a pointer to a repeater row.

When you need to differentiate between two repeaters or between two rows in the same repeater, TargetItem is a pointer to the “target” —a row in the repeater to be affected by the action. When a repeater action is called from within a repeater itself, then Item refers to the “calling” repeater row, and TargetItem refers to another repeater or another row within the same repeater–the row or rows being “targeted” by the action. It is common to use TargetItem in filter rules where you want to match or exclude rows based on the current row data.

Here is a quick demo of three “droplist repeaters” with “cascading hierarchy”. The key part is the Add Filter action when a repeater item/row is selected.
repeater hierarchical filtering.rp (76.5 KB)


#5

Thanks for explaining this and taking the time to illustrate. I’m sure the community is learning a lot from people like you and I personally believe @axure thrives on people like yourself and other talented community members.