.i, ri, currentRow, currentSourceRow not resolved right in expandable row

[AnsonHwang]

Say I have a table classRoom which will have table student in its expandable row.

Here is dataSource of classRoom table

[
  {"id":0,"name":"ClassRoom0", "students":[
    {"id":0,"name":"john"},
    {"id":1,"name":"Aaron"}]
  },
  {"id":1,"name":"ClassRoom1", "students":[
    {"id":0,"name":"Sophia"},
    {"id":1,"name":"Anna"}]
  }
]

Here is data source of student table

{{ classRoom.data[ri[0]].students }}

Then in the event handler of student table, I write script console.log(arguments);

I will click the first row of student table.
Here is output

pls be notice that, currentSourceRow and currentRow not only include the column of student table, but also include the 'students' column which is from classRoom table. column of student and classRow are Mixed together, it's very weird.

Then I click second Row
here is output

i, ri is still 0, instead of expected value 1, and the same Mixed column from two table in currentSourceRow and currentRow

[Alexi]

@AnsonHwang thank you for the thorough writeup!

It is expected that i and ri for the row in the students table are all the same, as rows are not considered children of repeatable components.

The merging of currentSourceRow is definitely a bug however, and we'll have a fix out tomorrow!

Please continue to share any feedback on expandable rows!

[AnsonHwang]

Hi @Alexi, thanks for reply.
I also have a feature request here, could add a option to set the default value of expand status?
For some small datasource, I want the to set it to true which will with expandable row unfold when table component load.

Also consider adding a function to control it, such as expandRow([index/key]).
Adding the row expand event handler will also be great.

[Alexi]

A few things:

• We're a little hesitant to add an option to expand rows by default at this time because it would impose a large performance burden to evaluate all of the Table's children on page load. That being said, we are currently working on a new version of List View that has many performance improvements baked in. Stay tuned for updates soon!

• For Table we can add a function to expand individual rows. I've filed that request internally.

• The "Expand row" event handler should already be live! Do you not see this option?

  

[AnsonHwang]

@Alexi

The "Expand row" event handler should already be live! Do you not see this option?

Thanks, I notice that, so can add an Unexpand row event handler also? I want to disable query linked to expand row, i.e. when the expand row is close, all the query in it will not run.

[bradlymathews]

How about a collapseRow() method?

I am torturing the c**p out of this function right now and one thing that be helpful for one use case is to only have one row expanded at a time. When a user expands a new one, I want the other to collapse.

[Tess]

I've made an internal request for a collapseRow method & event handler

[Tess]

We've added a collapse row method, so you could configure all other rows to collapse on the expand event

[MiguelOrtiz]

Hello there,

Just to share, we added this script to an expand row event handler to automatically collapse the row previously expanded. This enables only one row to be expanded at one time. Not sure if it is the most efficient way, but it works for now.

table1.collapseRows({
    mode:"key", 
    key: variable1.value
})

await variable1.setValue(table1.selectedRowKey);

UPDATE: There was an issue when users collapsed and expanded the same row, I added an "only run when"

[Hoff]

This worked for me. Thanks @MiguelOrtiz

[shawnhoffman]

For Table we can add a function to expand individual rows. I've filed that request internally.

Any update on this expandRow[i] type function?

[darenhunter]

Any tips on how I can get this to work on the listview with nested tables? It works great if I don't switch between tables in the repeating listview. I'm assuming it is because there are multiple instances of table1 within the listview that the problems arise.

[WidleStudioLLP]

Hello there,

Just to share my script which works for me for expandable rows

table1.collapseRows({
  mode: "index",
  index: tableSelectedDataIndexValue.value
})

await tableSelectedDataIndexValue.setValue(table1.selectedDataIndex);

Only run when:

{{ tableSelectedDataIndexValue.value !== table1.selectedDataIndex}}