Modal not showing on('ready',...) event (but JsModal with VirtualPage does)

[mkrecek234]

Situation:

• You have a page with a Modal (e.g. that is opened in a grid onRowClick.
• In some cases, you want the modal to be opened on page load.
• If you implement it this way, it won't load:

$outerView = View::addTo($app);

$modal = \Atk4\Ui\Modal::addTo($outerView);
$modal->set(function ($frame)  {
  \Atk4\Ui\Message::addTo($frame, ['Hello']);
}

$outerView->js(true)->on('ready', $modal->jsShow());

Expected result:

• The modal is opened on page load

Actual result:

• The modal is opened, but empty.

Workaround:

• If you implement it with VirtualPage combined with JsModal, it works on page load:

$outerView = View::addTo($app);

$vp = \Atk4\Ui\VirtualPage::addTo($outerView);
$vp->set(function ($frame)  {
  \Atk4\Ui\Message::addTo($frame, ['Hello']);
}

$outerView->js(true)->on('ready', new \Atk4\Ui\Js\JsModal('Hello', $vp));

[mvorisek]

This is not a bug. You must load the modal. jsShow is only thin proxy to render $('#modal')->modal('show').

[mkrecek234]

Isn't it loaded by Modal::renderView() automatically? If I use eg crud->onRowClick($modal->jsShow()) I don't have to care about loading the modal explicitly. May be you have an example how to accomplish this correctly?

[mvorisek]

Michael, for commercial support please contact me via Discord. My current rate is 180 EUR excl. VAT / hour. It is important to clear this question upfront to keep this project and your apps financially secured.

[mkrecek234]

I am posting this issue as also others from the community have the same problems - as this is what an open source framework is all about. Atk4 is all about intuitive, easy-to-code, agile programming. If developers stumble across those problems, it is up to all of us contributors to help them enjoy the framework solving their use cases. If you're not willing to contribute here, no need to refer to your commercial offerings. Commercial requests are certainly handled directly.

[mvorisek]

Forum is the place for community based questions. In issues, we should focus on a bugs or feature requests.

To the financing - keeping this project maintained is not free, if you profit on this project consider taking some part on these costs.

[bedengler]

I did use a virtual page in the end because of this in the documentation: „Care needs to be taken when attempting to combine the above with a Js\JsModal which requires a VirtualPage to store its contents.“

See https://atk4-ui.readthedocs.io/en/develop/js.html?highlight=modal#modals-and-reloading

I didn‘t investigate further in the source, because it worked in the end using virtual page. Nevertheless I also find it more intuitive, if you could set a modal, fill it with content and show it and it really shows.

These are the hurdles, developers get crazy with when learning atk4. And it consumes a lot of time.

I will add some documentation on this topic sooner or later.

Whoever is deeper in the code, could you explain to me, why the rendering of content of the modal is interrupted? As far as I understood, if you define a modal and fill it with content it shouldn‘t matter, if you call it via jsShow, because I would expect jsShow to just show the pre defined content.

Missunderstanding here?

[bedengler]

Did you try adding the content before the function @mkrecek234 ?

Something like

$outerView = View::addTo($app);

$modal = \Atk4\Ui\Modal::addTo($outerView);

\Atk4\Ui\Message::addTo($modal, ['Hello']);

$outerView->js(true)->on('ready', $modal->jsShow());

[mkrecek234]

Hi @bedengler I ran some code on the standard modal demo in atk4/ui and yes, if you have a static modal as above, it properly loads.

This comment here in the modal demo suggests, contrary to what mvorisek said, that upon jsShow the dynamic content would be loaded: https://github.com/atk4/ui/blob/a90d04455b94815b1353d81ec88aa9897542c7f6/demos/interactive/modal.php#L87

In fact, if you do the above on('ready', $modal->jsShow()) on one of the dynamically loading modals, it will show a modal just with a header but without content. I will provide demo code shortly. So only thing I assume is that we might have to trigger the jsShow later in the render tree eventually?

[mkrecek234]

I played around a bit and found the reason - the on('ready', modal->jsShow()) has to be called late enough, so that the dynamic modal has loaded properly beforehand. You can see sample code here: https://github.com/mkrecek234/ui/blob/example/modalShow/demos/interactive/modal.php

[mkrecek234]

If you have a good idea, how to trigger the jsShow out of a crud very late, let me know. Currently I linked it to a ready trigger for an element which is rendered later in the document than the modal. Not very elegant, but working.

[bedengler]

What about setting a timeout using a jsExpression and setTimeout…?