Summernote: set focus after initialization

Question

Summernote gives you the opportunity to give focus to the editor when you create it by passing the following parameters:

$('#summernote').summernote({ focus: true }); 

But after initialization, it seems like you cannot focus on the text field by pressing a button or similar. I tried several ways without success.

Has anyone done this?

Answer 1

Returning to this problem and trying to find many solutions, I came to the conclusion that it works:

$('.note-editable').trigger('focus');

Triggering an event through jQuery works, but using the focus() function does not.

Answer 2

 $('.summernote').summernote('focus') 

ps. I want to find angular output .. and it works

Answer 3

 $(document).ready(function () { $.fn.extend({ placeCursorAtEnd: function () { // Places the cursor at the end of a contenteditable container (should also work for textarea / input) if (this.length === 0) { throw new Error("Cannot manipulate an element if there is no element!"); } var el = this[0]; var range = document.createRange(); var sel = window.getSelection(); var childLength = el.childNodes.length; if (childLength > 0) { var lastNode = el.childNodes[childLength - 1]; var lastNodeChildren = lastNode.childNodes.length; range.setStart(lastNode, lastNodeChildren); range.collapse(true); sel.removeAllRanges(); sel.addRange(range); } return this; } }); }); 

then

 $('.note-editable').click(function(){ //$('#summernote').summernote('focus'); $(this).placeCursorAtEnd(); }); 

①Press the button or press ② Focus at the end of the content

it also works on a mobile device

Answer 4

You can set the focus by focusing on the editable div used by Summernote:

 document.querySelectorAll(".note-editable").focus(); 

or using jquery

 $('#summernote').find('.note-editable').focus();