Bootstrap 5 toasts not working

In the 3.7.0 release notes I can see that the toast messages should be working with BS5

However when I set up a ‘show toast’ message through a dynamic event I see that it’s still adding the dmxBootstrap4Toasts.js

I can’t see a dmxBootstrap5Toasts.js

Is this a bug or still on the todo list?

Gentle bump.
This plus Bootstrap 5 Icons in Wappler are our only bottlenecks to fully utilize BS5 :smiley:

Just rename dmxBootstrap4Toasts to dmxBootstrap5Toasts in the include code.
Folders will be copied and created automatically.

Automatic conversion from Bootstrap 4 to 5 will be adjusted in the next update but that will be only for full new conversions.

Renaming it in the layout page did generate a file as you said.

However the toasts aren’t showing anything (I think it’s relying on Jquery still):

  1. I’ve included that layout on my page
  2. I’ve made a button that triggers a flow on click: it should show a notification + a toast
  3. Notification does show. Toast does not. Error in console:
toasts.js:56 Uncaught (in promise) ReferenceError: $ is not defined
        at (toasts.js:56)
        at (toasts.js:8)
        at n._execStep (flow.js:83)
        at flow.js:37 

PS I also can’t add the toast element on the page as component

you have both boostrap4 Toasts and Bootstrap5 toasts included - should be just the later

Ah yes it automatically added that when creating the flow again.

Anyhow - just removed BS4 toasts, still same:

I see, you need to change also dmx-bs4-toasts, to: dmx-bs5-toasts
in your code

Sorry, where can I find that?

If you mean this one in the view, I’ve changed this to bootstrap5 toasts

Please wait until this weeks update, when the issues with the Toast component for BS5 will be fixed.

1 Like

Of course, thanks! :raised_hands:

Fixed with Wappler 3.9.5

This topic was automatically closed after 24 hours. New replies are no longer allowed.