Feature Requested: Table Modal Formatting
The column of type "modal" in the table component does not have the ability to be selected. Clicking on the modal itself results in selecting whatever the modal is on top of where you click.
Because of this, the modal component in tables is pretty unuseable as it takes up a large portion of the screen and is confusing for the user to use. Much easier to just use the button type column and triggering a modal to open.
What are you trying to do? The modal can be populated with info but is there something you want to do such as change the width etc. ?
Any functionality that the standalone modal has would be ideal.
I believe this has been requested before. But the Retool team would know more. Sorry I can’t help more
Hey there @ndipreta!
Do you happen to have a screen capture of what you mean when you say the following?
Clicking on the modal itself results in selecting whatever the modal is on top of where you click.
When I format a column in a table as Modal there's no config of the Modal. I've attached a screen grab. I can add elements to the Modal but setting it's width etc would be great. Just as you can with other Modal elements.
Hey @dgoodbourn!
Thanks for your feedback! I know it's a bit of a workaround but, for now, can you try creating a standalone modal component and opening that from a button in your table as mentioned in this post?
Ok thanks. 2 questions. Firstly, how do I just 'make a modal'? From the Create menu when I select Modal it gives me a button to open the modal. How do I make the modal without needing that button?
Secondly, can I pass any values from the row in the table to the modal?
Thanks,
Dave.
@dgoodbourn , you can set the Hidden attribute to true to hide the button.
Secondly, you can pass value to the modal through a Temporary State which could be set on Table row click
@rferland's technique for passing a value works well, and I have countless hidden modals littering apps using this same pattern.
If you are just using data from the selected row on your table in, you can reference {{table1.selectedRow.data.myColumn}} wherever you need to in the modal, without the need for an intermediary Temp State. I use that technique A LOT.
That does mean the modal contents change if the user mis-clicks and selects a different row in the table behind the modal window. If it is critical to avoid that, set the Close when clicking outside property on the modal. But to be honest I have rarely needed to do that.
@bradlymathews Thanks for the suggestion. I did get that working, but as you can't format the modal from a table I'm forced to use the separate modal work around.
Oh, yes sorry if I wasn't clear. What you did was exactly the correct pattern! But get the data you use on the modal from your table's .selectedRow.data if you are displaying or using data form your table.
For instance:
That edit button has this defintion:
jdEditIC just does this: modAddEditIC.open()
the modal is tucked out of the way and hidden:
The modal has a form and I set its Initital data property to my tables selected row and all of the form is filled in.
That is a full summary of the pattern
@bradlymathews Ah! OK now I'm learning. I was trying this before but I had the "disable user selection" enabled 
so went down the temp state route. But now I know about them too 
Thanks for the help.
