Summernote questions

[TomD]

This is a great new feature. I’ve used Summernote before and think it’s a good choice.

There are some useful looking actions related to Summernote:

It seems that some of these have been implemented and some haven’t - eg ‘Insert Text’ and ‘Paste HTML’ don’t work but the others such as ‘Enable’ and ‘Disable’ do. Is this is correct or should they work now? Also, will ‘Insert Text’ insert text at the cursor position or append it to the current contents (hopefully the former).

Something else which doesn’t work - perhaps because it’s yet to be implemented - is customising the toolbar when using Air Mode: the customisations are not applied. Again, is this a bug or perhaps something which it not yet implemented?

[patrick]

configuring the popover toolbars comes soon, it is already in the code, just missing in the Wappler UI.

dmx-bind:toolbar-air="[['color', ['color']],['font', ['bold', 'underline', 'clear']]]"

If you want to go realy advanced, you can do any config you want:

<script>
  dmx.global.set('editorConfig', {
    placeholder: 'Hello summernote',
    tabsize: 2,
    height: 200,
    toolbar: [
      ['style', ['style', 'cleaner']],
      ['font', ['bold', 'underline', 'clear']],
      ['para', ['ul', 'ol', 'paragraph']],
      ['table', ['table']],
      ['insert', ['link', 'picture', 'video']],
      ['view', ['fullscreen', 'help']]
    ]
  });
</script>
<textarea is="dmx-summernote" id="editor" dmx-bind:config="editorConfig"></textarea>

Ofcourse we will try to make it you easy and most options will become available on the UI within Wappler.

[mymdsdigital]

This is a great feature! thanks a lot!!!
Quick question about the toolbar for headings, I can’t find it. How can add the headings selections

to

?
Thanks

[Teodor]

It is just right here:

Make sure to check how to post HTML code here:

How to format code in your posts

Code Formatting When pasting code in your posts, please use the following formatting options, in order to be sure your code is readable and well formatted for the rest of the users. Inline code formatting Surround a section of code with backticks (`) inline code formatting. Typing: `var x = 10;` Results in: var x = 10; This can also be done as var x = 10; inline. Multi-Line Blocks of Code Surrounding code with three backticks ``` will allow for code to span multiple lines Typing: ``` …

[encephalon]

In addition to my last post, is there any chance to bake in those two lines of code as an option (no idea if it works though, but it would be just what I needed)? https://github.com/summernote/summernote/issues/546#issuecomment-619084952

Furthermore, when pulling summernote generated text from my database query, the html tags are not resolved. What am I doing wrong?

[Teodor]

@encephalon

when pulling summernote generated text from my database query, the html tags are not resolved. What am I doing wrong?

You need to use the inner HTML dynamic attribute for this instead of directly binding the expression in the paragraph.
Select your paragraph, add new dynamic attribute > display > inner HTML and select your dynamic expression there.

[TomD]

@encephalon

is there a way to change the Enter-behaviour from <p> to <br>?

You could add a Dynamic Event to the Summernote textarea, eg:
editor1.setValue(value.replace("</p><p>", "<br>"))
This seems to work best with the onblur event, though the replacement will only happen after leaving the field. Other events seem to produce strange results.

Having said that, I prefer the functionality as it is. This is the way Word works for example, and it means users can add paragraphs if they want.

@encephalon

but the intended users of my project don’t.

Using the Medium Editor, I sometimes added a note, eg:

[Antony]

Summernote integration is looking great!

I need file upload to AWS S3 though…

[bradbrd992]

“At last my love has come along“

I can wait to try this out. Thanks a lot Wappler team and I am truly happy to be a part of the Wappler Wave.

[brad]

@psweb

So happy to have this added editor, however in the same boat as @brad, having used Medium Editor on many projects and wondering what the simplest way to go about converting existing Medium Editor fields to Summernote.

Had to do it in code view. Remove is medium code. Refresh app connect panel. Then you can add your summernote editor. Just did 15 of them. Since all had the same options I just copied the is summernote code and replaced the is medium code in them all in code view. Only took about 5 minutes to do 15 editors.

[brad]

@Teodor

Word formatter / cleaner addon is coming next week

Did this make in today’s update? I didn’t see it in the release notes?

[Teodor]

No, it didn’t make it this week.

[Marzio]

Hi Teodor
The implementation of Summernote is fantastic and certainly satisfies many needs and is complete with all the most important settings.
What would be a very interesting plus is the possibility to save, load or modify templates for the content of the text area, thus providing the possibility to choose pre-set presentations (with tables, titles, colors, logos, … . etc)
Somewhere in the past I had seen this possibility, but I don’t remember where.
You know something about this?

[swf]

I’d urgently need a Word formatter/cleaner. Please implement it asap, thanks!

[swf]

George, please implement delete image from server support soon. We have a huge project here where we’d need that in our cms. Thanks!

[swf]

It would also be nice to have more control about the table, like define it as responsive, assign other bootstrap classes like bordered and last but not least define table header and footer rows

[encephalon]

I would like to insert a (NULL) value to db when Summernote field is left blank, is that possible?

[brad]

@encephalon

I would like to insert a (NULL) value to db when Summernote field is left blank, is that possible?

It’s very easy, just set your default to null in your SC Action.

Setting a value to NULL?

Hi Brad, use the default condition to your POST variable: $_POST.input_name.default(null) This way, when empty the input will insert null to the database.

[Bankym]

Hi,
Immediately I add summernote to my view, the design view immediately went blank. but toggling the App connect mode restore it (if appconnect is true, screen is blank, but if appconnect is false it is restored. Any tips please!
Wappler 3.0.0 Beta 5 Released

[mymdsdigital]

Hi I am wondering if there is a way to add alternative text values to images within summernote. When I select the image, the options do not allow me to add an alt text.

I am wondering if I am missing something.
Thanks
Juan