Skip to Main Content

APEX

Announcement

For appeals, questions and feedback about Oracle Forums, please email oracle-forums-moderators_us@oracle.com. Technical questions should be asked in the appropriate category. Thank you!

Modal Dialog close button loses 'X' following upgrade from APEX 5 to 20.2

AndyHApr 8 2021

We have an application that is being upgraded from APEX 5 (originally 4.2) and have come across an oddity with Modal Dialogs. We're using custom templates.
When displayed, the modal page shows the header differently to the APEX 5 version: where the 'Close' icon on the header used to show an 'X' we now see a square box with the word 'Close' superimposed (and the box seems to turn into a circle once the page has loaded!).
From comparing the generated HTML I can see that there are some differences in the way the button is defined:
In APEX 5

<button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" role="button" aria-disabled="false" title="Close">
<span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>
<span class="ui-button-text">Close</span>
</button>

In APEX 20.2

<button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-dialog-titlebar-close" role="button">
<span class="ui-button-text">Close</span>
</button>

As we're using custom templates that are the same in both versions, I'm surprised at the different outcomes except that I see that the button used in a Modal Dialog doesn't appear to have an associated template?
The obvious differences are that the original used 'ui-button-icon-only' whilst the new uses 'ui-button-text-only' and the extra span in the old version with a tempting 'ui-icon-closethick'.
So, how can I alter the APEX 20.2 version of our templates to at least get rid of the 'Close' message and maybe get the 'X' back?

Comments
Post Details
Added on Apr 8 2021
1 comment
551 views