Project

General

Profile

Bug #11233

Regression in Wt 4.9.0: dialogs don't close after accept() or reject() with Bootstrap 5 theme

Added by Roel Standaert 22 days ago. Updated 11 days ago.

Status:
Closed
Priority:
Normal
Target version:
Start date:
01/09/2023
Due date:
% Done:

100%

Estimated time:

Description

This issue was reported on the forum: https://redmine.emweb.be/boards/1/topics/18202

With Wt 4.9.0 and the update to Bootstrap 5.2.x we changed dialogs to be wrapped in a div with the modal class. This is how modals should be used according to the Bootstrap documentation.

<div class="Wt-popup modal d-block Wt-dialog">
  <div class="modal-dialog">
    <!-- ... -->
  </div>
</div>

Previously a dialog was rendered like this:

<div class="Wt-popup modal-dialog Wt-dialog">
  <!-- ... -->
</div>

The d-block class was added because the modal class adds display: none;.

However, since d-block uses display: block !important, the code that Wt uses to hide widgets (e.g. when a dialog is accepted) would no longer properly hide the dialog.

Instead of using the d-block class, we can instead add display: block for the .Wt-dialog.modal selector, and that should make things work properly again.


Files

WDialog_cutOff.PNG (10 KB) WDialog_cutOff.PNG Stefan Bn, 01/15/2023 07:18 PM

Related issues

Related to Bug #11248: Regression in Wt 4.9.0: Bootstrap 5: setWidth cuts off contents and resizable dialogs don't resizeClosedRoel Standaert01/16/2023

Actions
#1

Updated by Roel Standaert 22 days ago

  • Status changed from InProgress to Review
  • Assignee changed from Roel Standaert to Korneel Dumon
#2

Updated by Roel Standaert 18 days ago

  • Assignee deleted (Korneel Dumon)
#3

Updated by Stefan Bn 16 days ago

Just a follow-up regarding the Wt 4.9.0 changes on WDialog that might be related:

Since 4.9.0 WDialog does not correctly work when a sizing is applied to the dialog using e.g.:

dialog->setWidth(800)

The dialog gets cut off at the right boundaries, the contents do not wrap at dialog boundaries and the footer WPushButton disappears (see Screenshot attached). In earlier Wt versions this worked ok.

See this small sample that shows the issue:

auto dialog = WApplication::instance()->root()->addChild(std::make_unique<WDialog>("Test Dialog"));
dialog->setWidth(800);
//    dialog->setMinimumSize(800, WLength::Auto);  // also fails
//    dialog->setMaximumSize(800, WLength::Auto);  // also fails

auto txtLabel = dialog->contents()->addNew<WText>("This is really long text. This is really long text. This is really long text. "
                                                  "This is really long text. This is really long text. This is really long text. "
                                                  "This is really long text. This is really long text. This is really long text. "
                                                  "This is really long text. This is really long text. This is really long text. "
                                                  "This is really long text.");

auto cancelBt = dialog->footer()->addNew<WPushButton>("Cancel");
cancelBt->clicked().connect([=]{ dialog->reject(); } );
dialog->finished().connect([=] { WApplication::instance()->root()->removeChild(dialog); });
dialog->show();

I have several WDialogs with some WLayout inside, that completely got messed up since Wt 4.9.0, maybe because the sizing information isn't obtained correctly anymore :-/

#4

Updated by Roel Standaert 16 days ago

I'll see if my patch fixes that, but I think it would be another bug that needs its own issue.

#5

Updated by Marnik Roosen 16 days ago

  • Assignee set to Marnik Roosen
#6

Updated by Roel Standaert 15 days ago

  • Status changed from Review to Implemented @Emweb
  • Assignee changed from Marnik Roosen to Roel Standaert
  • % Done changed from 0 to 100
#7

Updated by Roel Standaert 15 days ago

  • Related to Bug #11248: Regression in Wt 4.9.0: Bootstrap 5: setWidth cuts off contents and resizable dialogs don't resize added
#8

Updated by Roel Standaert 12 days ago

  • Status changed from Implemented @Emweb to Resolved
#9

Updated by Roel Standaert 11 days ago

  • Status changed from Resolved to Closed

Also available in: Atom PDF