Summernote component not found in Bootstrap 5

Wappler Version : 3.97
Operating System : windows
Server Model: NodeJS
Database Type: MySQL
Hosting Type: Heroku
Bootstrap 5

Expected behavior

What do you think should happen?

click the enable Summernote button associated with a text area and summernote would appear with all the options

Actual behavior

What actually happens?

clicked the enable Summernote button associated with a text area and got notification “Summernote component not found”

How to reproduce

  • Detail a step by step guide to reproduce the issue
  • A screenshot or short video indicating the problem
  • A copy of your code would help. Include: JS, HTML.
  • Test your steps on a clean page to see if you still have an issue

…YOUR TEXT HERE …

I have used Summernote in other projects ( same setup except using Bootstrap 4) and it just worked when i looked to enable summernote. In this project Bootstrap 5 i got the error. I needed it in a modal so initally tried it there got the notification and then tried on the page same error.

Where did you get this error exactly?
Also - are you sure you have added jquery on your page?

See screenshots

Hi Teodor, George,

Any thoughts??

Thanks,

Nigel

We’ve not enabled Summernote component for Bootstrap 5 pages. It natively supports Bootstrap 4, however it should work fine on Bootstrap 5 pages as well, so we will fix this in the next update.
Meanwhile you can just add the Summernote Lite textarea on your page instead of trying to convert the textarea to Summernote component.

1 Like

Thanks

still not fixed on wappler 4.0.1

Is this fixed? Just had this ‘error’ today.

Adding the
is="dmx-summernote" dmx-bind:toolbar=""
to an already created textarea fixed the problem

PS First create an empty summernote lite textarea so all relative files are included

1 Like

Unfortunately Summernote for Bootstrap is not fully Bootstrap 5 compatible.

You can use the Summernote Lite version, which should work always.