I have a few apps where the editing of information would really benefit from having multiple modal overlays similar to multiple dialog boxes in a Windows program. Below is a JSFiddle I found on StackOverflow that seems to demonstrate pretty much what I’m thinking of.
In terms of Anvil usage, I feel like this would happen when an alert or confirm is opened from inside a form that is already contained in an alert or confirm, allowing for multiple overlays.
Is this functionality somewhere on the Anvil road map, or might it be possible to achieve something like this already and I just don’t know where to start looking?
I’ve wanted to open an alert from inside an alert more than once (I put fairly complex forms into alerts at times). It’d be handy if this were possible.
Yes i was just trying this today. It turns out an alert called from within an alert opens once the first alert closes. I love alerts and i would love them even more if they could be nested.
Not a direct answer, but used to I dynamically insert an “alert” form before or after some field which triggered it, styled so it looked a little like an alert (borders, etc.). Bit of a hack, agreed.
[Mod note: merged from new thread so we can keep track of the number of requests]
Currently when you make an alert(content,…) within an alert the new alert only shows when the previous is closed. Please redesign alerts so they can be nested.
I ran into another situation today where the ability to open an alert from inside an alert would have fit perfectly the way I’d like to structure my app.
It would be nice to be able to launch an alert popup from within a popup and have that second alert popup stack on top of the first one (And enable Notification/confirm with the same ability).
Unless I missing something in the docs, there’s no documentation on this and when I try to do this kind of workflow, the alert or confirm appears only after the popup that generated it closes. In the case of the Notification, it opens behind the popup that generated and of course disappears as appropriate.
With the lack of documentation and the alerts and Notifications functioning generally speaking, I don’t think it’s a bug, so that’s why it’s here rather than in Issues.
As a workaround for simple cases until Anvil supports nested alerts, you can use Javascript alerts from inside an Anvil alert. For example, to get confirmation from the user inside an Anvil alert, you could do:
from anvil.js import window
if window.confirm("Are you sure?"):
return True
I use it to get single values using window.prompt and it works well. It isn’t suitable for anything more complicated than a simple confirmation or single input value.
Note that I haven’t tested this extensively, but it works with the way I use Anvil alerts.
It also isn’t really very good graphic ally as well. The reason why I loved anvil alerts is the simple yet modern look they give. Also, I might give it a try sometime but I think it is possible with a little bit of css to achieve your own alert. Maybe applying a role like that to a form and then adding that form to your current form will be able to to give the desired results.
Oh, it’s definitely not an ideal solution, but it’s quick and dirty and works. Which for me is fine, since nested alerts is on the Anvil roadmap, and my use of this is in admin areas, not user facing areas.
The Anvil workaround I ended up with was going to the field with an error and temporarily changing it’s styling like below:
self.text_box.scroll_into_view(smooth=True)
self.text_box.background = 'pink'
self.text_box.placeholder = 'Class Name Required'
self.text_box.align = 'center'
time.sleep(1.5) #Ensures that the warning text persists for ~1.5 seconds
self.text_box.background = None
self.text_box.placeholder = None
self.text_box.align = 'left'
Granted, this was just for a single required field, and only for an error, but it got the job done, doesn’t look bad, and was pretty quick to implement. And, the best part is, no JavaScript!
Is this functionality on the roadmap at the moment?
I have had several cases, where a “double” modal would have been very useful.
As an example, I use modals to allow user to edit/delete items/customers/tickets etc. When user clicks “Delete” button, I would like them to confirm it, before making the server call.
The workaround by @duncan_richards12 has been working so far though, but I would rather use multiple modals.
