XF 2.1 Load overlay after clicking submit button

[Earl]

How do I display a simple overlay after clicking the submit button?
I understand this concept:

if ($this->isPost){

do something

return $this->readirect($this->getDynamicRedirect());
}

return $this->view('Earl\Vendor\ConfirmbBox, 'delete_confirm', $viewParams);

As far as I know, you cannot do this with the submit button, but using the href="link" attribute in anchor tags with data-xf-click="overlay" attribute. (I find report links as an example to this)

What I do want to know is how this submit button in inline mod bar triggers an overlay?




After clicking this submit button, it displays this confirmation overlay.

How does this work?

And what's the different between having data-ajax-redirect="0" attribute in <xf:submitrow> and having data-redirect="off" attribute in <xf:form> tags?

 

[Earl]

And what's the difference between that and adding data-skip-overlay-redirect="true" attribute to <xf:form>?

 

[MilkyMeda]

Add overlay="true" attribute to your form.

 

[Earl]

Add overlay="true" attribute to your form.

Aah it was that simple!? And I couldn't notice. Thank you so much, @MilkyMeda. It works.
Then again, any idea about those these three attributes? data-skip-overlay-redirect="true" data-ajax-redirect="0" data-redirect="off"

 

[021]

data-skip-overlay-redirect

.if true, there will be no redirect if the form is in the overlay

data-redirect

Do a redirect after completing the form. If the response contains a redirect and this option is false, the redirect will not be

data-ajax-redirect

This attribute is indicated on the submit buttons. When you click on one submit button, a redirect will occur, and when you click on another button, it will not.
You can see an example of work in the template admin:template_edit.