I have a table with expandable rows. I have a table inside that and need to select a row and populate data from that table's selected row.
If I open the first row first, the inner table works in that and some of the other rows work as well. Randomly the third or forth row do not work or sometimes they do (tried with multiple browsers).
If I open any other row first, the table select does not work as expected. What is going on here? Am I missing something?
This is the bug view on my app (row "selects" but does not give data to right)
Would you mind sharing yoru settings for the text components on the right (with customer info)?
Most likely you are referring to {{table_orders_without_delivery.selectedSourceRow}}. However, as your table has several instances of it (as many instances as rows) which do not render until a given row is expanded, you need to specify which instance of the table should be used. Here's a thread regarding this issue
The way I solve this is using {{table_orders_without_delivery[table1.selectedIndex].selectedSourceRow}}
by using table1.selectedIndex, I can tell the component which instance of the nested table should be used to find the data. Bear in mind though that this will break if:
you have multiselect enabled for your parent table
if user selects another row besides the one that it is expanded. What I usually do (which is not always applicable to all use cases) is to apply an event handler to collapse a row that is no longer selected
But maybe this is not the error, please do let me know if the above helps.
I was using {{table_orders_without_delivery_plan.selectedSourceRow.customer_name}}
I tried {{ table_orders_without_delivery_plan[table1.selectedIndex].selectedSourceRow.customer_name }} but it gave me this error:
TypeError: undefined is not an object (evaluating 'table_orders_without_delivery_plan[table1.selectedIndex].selectedSourceRow')
PS. I need to have multiple rows open at the same time and have them be able to select on multiple rows. So if this breaks that it is not the solution I need.
Sorry, it is selectedDataIndex, instead of selectedIndex. you can see how that works, but if you have multiple rows open then this won't be what you need.
You will be able to find the index as well using currenSourceRow. I've got to run to a meeting, but I'll tag here @AJVancattenburch who I'm sure will be able to share some magic on how you can find the index of the nested component using the id of your parent table.
It's still early where I live haha so bear with me as I align my daily flow!
It seems like you're having issues with selectedRow not being expressive enough as currentRow? Is that correct? If so, the self property should also be available in most areas of your tables inspector. If you're also able to iterate over item or i, you should be able to access your {{ currentRow.column_name }} where it's not available with a similar method of {{ self.data[i].column_name }}.
Also, have you tried using a listView component? They're particularly handy for dealing with nested data relationships since you can directly iterate over a data source within a component that lives inside of your listView like how you would a select component with {{ item }} -- giving you access to all properties that would live in currentRow.
I apologize if I'm misunderstanding the context of your requirements! Once I'm fully awake I can take another look at this if none of the above suggestions apply to your scenario
Thanks for the shout-out, @MiguelOrtiz! Don't sell yourself short, either, I've seen you come up with some very elegant solutions that I've applied in my applications more than once!
I personally would use a list view here too just with data structure and app integrity. The issue is retool will reload components when a source row is changed and I think that’s causing the app state to not hold the data correct. I like this approach of course but do recommend looking into the list view since it will target what you need. @retool_amateur
Hi @retool_amateur I don't see any known bugs that could be causing this Would you be open to sending me a JSON export of your app (You can send as a DM so that other community members won't see your data)?
See screenshot below for exporting your app with hardcoded data.
Hi @retool_amateur It seems like a workaround could be a Select row event handler on the nested table that controls the container title component and sets the value based on the current row. This approach also seems to work in a listview