Jodit: pasting text that calls the html paste pop up fails

user_2195064 0
Viewed 1453

I'm adding a Jodit editor to a webpage. I'd like to be able to paste formatted text from, say, MS Word, into the editor. I can paste text that does not call the little pop-up for pasting html text, but not text with formatting. The console logs a warning that addRange(): The given range isn't in document. Indeed, logging window.getSelection().rangeCount returns 0 (instead of 1 in other cases). I have no idea what is wrong as pasting from various programs, of course, works on the website. Am I missing an event?

jodit
1 Answers

The problem was that the editor was in an ag-grid cell. The different selections in the dialog box when pasting from MS Word into the editor lay outside of the ag-grid cell, and therefore clicking in the dialog ended the ag-grid session mid-edit! As the behavior I was looking for is to keep the formatting, I simply turned off the dialog box (askBeforePasteFromWord: false, askBeforePasteHTML: false). To still handle the pasting from MS Word (because MS Word), added in Jodit's author's code to auto-handle (https://github.com/xdan/jodit/issues/197):

              jodit_editor = new Jodit(text_area_element, {
              hotkeys: {
                  redo: 'ctrl+z',
                  undo: 'ctrl+y,ctrl+shift+z',
                  indent: 'ctrl+]',
                  outdent: 'ctrl+[',
                  bold: 'ctrl+b',
                  italic: 'ctrl+i',
                  removeFormat: 'ctrl+shift+m',
                  insertOrderedList: 'ctrl+shift+7',
                  insertUnorderedList: 'ctrl+shift+8',
                  openSearchDialog: 'ctrl+f',
                  openReplaceDialog: 'ctrl+r',
              },
              events: {
                  processPaste: function(event, html){
                      jodit_editor.selection.insertHTML(html);
                      jodit_editor.tempContent = jodit_editor.getEditorValue();
                  },
                  afterPaste: function(event){
                      let el = $('<div></div>');
                      el.html(jodit_editor.tempContent ? jodit_editor.tempContent : jodit_editor.getEditorValue());
                      jodit_editor.setEditorValue(el.html());
                      jodit_editor.tempContent = null;
                  },
              },
              askBeforePasteFromWord: false,
              askBeforePasteHTML: false

          });

user_21950640
Related