[#36169] - [4.0] Form field type "modal_article" does not close modal properly
- Closed
- 1 Dec 2021
- Medium
- Build: 4.0-dev
- # 36169
Steps to reproduce the issue
When using form field type "modal_article" e.g. in config.xml, it does not close modal window properly after selecting article. Backgroud (modal backgrop) does not allow to continue in work.
TEST INSTRUCTIONS: we can use e.g. Contact component to demonstrate this issue:
Open following file:
administrator/components/com_contact/config.xml
Change line 4 FROM:
<fieldset
name="contact"
label="COM_CONTACT_FIELD_CONFIG_INDIVIDUAL_CONTACT_DISPLAY"
description="COM_CONTACT_FIELD_CONFIG_INDIVIDUAL_CONTACT_DESC"
>
TO:
<fieldset
name="contact"
label="COM_CONTACT_FIELD_CONFIG_INDIVIDUAL_CONTACT_DISPLAY"
description="COM_CONTACT_FIELD_CONFIG_INDIVIDUAL_CONTACT_DESC"
addfieldprefix="Joomla\Component\Content\Administrator\Field"
>
And below this fieldset add some dummy parameter:
<field name="dummy_parameter" type="modal_article" select="true" new="true" edit="true" clear="true" class="form-control" label="Dummy Parameter" />
Save and try to add article in Contact Parameters:
- when you close the window with CLOSE button, everything is OK
- when you close the window with selecting article, modal background (modal backdrop) will be not closed. See animated GIF:
EDIT: Try to enable and disable debug mode when testing, this can produce different behaviour: #36169 (comment)
Expected result
Like in Joomla 3, when selecting article, modal will be properly closed.
Actual result
Modal is not closed when selecting article,
System information (as much as possible)
Joomla 4.0.4
joomla-cms-bot
- | Labels |
Added:
No Code Attached Yet
|
||
I remember seeing that before. Sorry I dont remember the exact fix but it should not be possible to close the modal by clicking on the background layer
I remember seeing that before. Sorry I dont remember the exact fix but it should not be possible to close the modal by clicking on the background layer
Then it will work the same way like in Menu Manager (for "Create" button):
- when you click "Select", you can close modal with clicking on background
- when you click "Create", you cannot close modal with clicking on background
Which is still better than freezing screen.
The problem is, two backdrop boxes are opened and one is closed:
It can be seen even on the background which is much darker (2x background)
So the problem is, some process makes the background twice, but only closes one when clicked.
And what is interesting:
Select button creates two backdrops and both are closed with Close button
Create button creates two backdrops and only one is closed with Close button
I don't know the function in details but it seems like the first button cares about all backdrops but the second only about one.
The Close button created by Create button does not include "dat-bs-dismiss":
Chaning from:
<button type="button" class="btn btn-secondary" onclick="window.processModalEdit(this, 'jform_dummy_parameter', 'add', 'article', 'cancel', 'item-form'); return false;" >Close</button>
to:
<button type="button" class="btn btn-secondary" onclick="window.processModalEdit(this, 'jform_dummy_parameter', 'add', 'article', 'cancel', 'item-form'); return false;" data-bs-dismiss="modal">Close</button>
can solve the problem for this part, but the part with selecting article title is still unresolved as applying "dada-bs-dissmiss" on URL link in iframe does not work.
Hmmm, this is very interesting. When I enable debug mode, which means not minified Javascript libraries, it works well:
This is the problematic part:
It works with:
media/vendor/bootstrap/js/modal.js
But does not work with:
media/vendor/bootstrap/js/modal.min.js
The difference is, the first one creates only one instance of:
<div class="modal-backdrop fade show"></div>
The second creates two instances
Joomla 4.0.4 stable package.
The same with: Joomla_4.0.5-rc2-dev-Development-Full_Package.zip - Nightly Build Wednesday, 01 December 2021 03:00:04 UTC
richard67
- | Status | New | ⇒ | Closed |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2021-12-01 17:47:55 |
| Closed_By | ⇒ | richard67 |
The behaviour is similar when new article is created and "Save and Close" button is clicked.