Hey!
I just wanted to share the way that I used to close a dialog/modal when clicking outside of it for anyone else who wants this!
https://ellie-app.com/5JyJv7PBwQfa1
This is the way that elm-bootstrap does it. I created the ellie so others can have a reference for implementing this on their own without having to dig into elm-bootstrap’s source.
Thanks for the example. Just out of curiosity, how would you show a dialog in an Elm app that is sharing code with some other FW (React/Angular/…) and doesn’t have an access to root element?
I think there was a blog post some time ago about that too.
I’m not exactly sure, I haven’t done anything like that before.
My guess would be in the dialog create a div with a unique id and mount the react/angular app from there. Though I’m not sure how mounting would work exactly if the div only exists when the dialog is open. I would recommend taking a look at Luke Westby’s talk about web components because that may end up being a nicer solution.
hey this is an example of a Click Outside with A WebComponent using node.contains HTML API :
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.