I have a modal inside a listview, it opens correctly when the button is pressed, but I want to have a personalized close button inside the opened button (besides de X). I've inserted a button that runs a modal1.close() JS query when clicked, but I am getting this error message when clicking it: modal1.close is not a function.
Could you try modal1[i].close()? Ideally, rather than having a duplicated modal for each row of a listview, its often better to have a listview button component open an external modal component. Do you think this could work for your use case here?
Exactly, in the query that you trigger from the button on top of opening the modal with modal.open() you will also have access to the variable "i" which represents the index within the listview that the query was triggered from. You could then use this index to render the corresponding data in the modal. Hope this helps, let me know if you have any questions! :)
In this table inside de modal I wanted to show data of rows in payoutsJoin where payoutBatchId column is equal to the id from the list item clicked to open the modal (in this screenshot example would be laisa0002)
Great to hear from you. I think an approach that might make sense here is to add an onClick handler for ListView child components - this onClick handler will set a local state variable equal to the current index selected (i). We'll use the built-in Retool feature, temporary state. You can access this in the top of the left sidebar, and click "Create a variable to store state."
You can then add another event handler to open the modal as before. Within the modal, you can reference state1 to access the clicked instance within the List View! Let me know if this makes sense and resolves the issue.