Skip line Javascript

Question

I have this Javascript function that only allows the user to type 42 characters. Someone can help me, I need every time I reach 42 characters to skip a line instead of blocking typing. My problem is in onKeydown and onKeyup.

$('.summernote').summernote({
    height: 150,
    lang: 'pt-BR',
    toolbar: [
        ['style', ['bold', 'italic', 'underline', 'clear']],
        ['fontsize', ['fontsize']],
        ['color', ['color']],
        ['para', ['ul', 'ol', 'paragraph']],
        ['insert', ['picture']],
        ['codeview', ['codeview']]
    ],
    disableDragAndDrop: true,
    callbacks:{
        onKeydown: function (e) { 
            var t = e.currentTarget.innerText; 
            if (t.trim().length >= 42) {
                //delete key
                if (e.keyCode != 8)
                e.preventDefault(); 
            } 
        },
        onKeyup: function (e) {
            var t = e.currentTarget.innerText;
            $('#maxContentPost').text(42 - t.trim().length);
        },
        onImageUpload: function(files) {
            moveImagem(files[0]);
        },

        onMediaDelete : function($target, editor, $editable) {
            var nome = $target.data('filename');
            if(apagaImagem(nome)){
                $target.remove();
            }
        }
    }
}); 

Answer 1

first, assign the summernote instance to a variable, for later use, it already has a method for add paragraphs, using the callbacks:{} you add the event onKeyup (tried with onChange but created an infinite loop and broke all rs), if you inspect the Summer editor, you will see that the text appears inside a div with class .note-editable and inside it inserts paragraphs, line breaks and so on. what I thought could be done is: within the keyup function, you take the content of that div with class note-editable and make a loop and all the <p> and checks how many characters are in each <p>, if it has 42 characters, it executes the method that adds a new paragraph. for example:

var editor = $('#summernote').summernote();

and within the onKeyup function:

editor.summernote('insertParagraph');

an example (incomplete yet): https://jsfiddle.net/hfv35Ld0/

Answer 2

Just make sure the .val() is divisible by how much you want to break the line (42 in your case), then enter a \n, using .val($(this).val()+"\n") as an example. You should remove breaks from previous lines, otherwise they will also be considered a character, so use the .replace(/(\r\n|\n|\r)/gm, "")!

$('textarea').on('keydown', function(){

   value = $(this).val();

   if(value.length !== 0 && value.replace(/(\r\n|\n|\r)/gm, "").length % 5 === 0){
      $(this).val(value+"\n");
   }


});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea></textarea>

In this case every 5 digits will insert a new row. There is BUGS in this, because the user can change the text previously written, this is not verified by the function, but can add some solution to this.