How do I execute a function on-close or on dismiss of <paper-dialog> for Polymer 1.0?
paper-dialog
inherits the Polymer.IronOverlayBehavior
, which has the iron-overlay-opened
and iron-overlay-closed
events.
<paper-dialog
on-iron-overlay-opened="_myOpenFunction"
on-iron-overlay-closed="_myClosedFunction"></paper-dialog>
- https://www.webcomponents.org/element/@polymer/iron-overlay-behavior
- code: https://github.com/PolymerElements/iron-overlay-behavior/blob/master/test/iron-overlay-behavior.html (for example: take a look at line 147 for the
iron-overload-opened
event)
Even this is old topic, there is still 1 thing that people should know and be aware of:
I highly recommend you to also check event.target
inside your listener function. For example, if you have another element using iron-overlay
inside paper-dialog
, closing that elements will trigger listener on paper-dialog
. (you can try this with vaadin-date-picker
).
So:
<paper-dialog on-iron-overlay-closed="_myClosedFunction"></paper-dialog>
and then _myClosedFunction
:
_myClosedFunction(e) {
if(e.target.nodeName == "PAPER-DIALOG") {
//...toDo stuff...
}
}
Now you are guaranteed that whenever only paper-dialog is closed, your code will be executed