2

I have an editor which is a contenteditable and I'm trying to figure out how to get pasting to work correctly. I tried the simple:

self.editorIframeDocument.addEventListener('paste', function () {
  setTimeout(function () {
    _setText(self.editor, _getText(self.editor));
  }, 1);
});

editorIframeDocument == the contenteditable document.

_setText is an internal function for cleaning the input used throughout the code.

_getText is simply innerText when it can, or a shim when it cant (Firefox).

So, the issue is, upon pasting the cursor moves. For example:

+==========+
+ |
+ WORD
+
+===========

If I paste WORD there (pretending it's the editor) the cursor ends up where you see the pipe above it.

How can I always have the cursor at the end of what the user pasted, or, the previous cursor position to be exact. I see I can use extendOffset property in Selection, but I'm not sure how. I also tried doing collapseToEnd, but that puts the cursor at the end of the entire editor.

Any ideas? If you want the full source code: https://github.com/OscarGodson/EpicEditor/blob/feature/ticket-100/src/editor.js

It's in the branch feature/ticket-100

Oscar Godson
  • 31,662
  • 41
  • 121
  • 201
  • 4
    Yeah? I've asked almost 200 questions and they don't get answered unless it's a jQuery question. I just answered one of my own questions, and I'm answering as many of my own as a I can right now to hopefully bring it up, but it's because people don't answer, not that i dont accept. – Oscar Godson Jun 21 '12 at 15:29
  • @TylerCrompton Answered a few of my own and deleted ones with no answers. – Oscar Godson Jun 21 '12 at 15:32
  • Could you give more detailed steps about what this is doing? Is this correct? 1. User pastes some possibly rich text. 2. It gets pasted by the default browser mechanism. 3. After the paste, you extract just the text from the editor with no formatting, do some unspecified manipulation on it and then replace the complete contents of the editor with the new text. 4. You place the caret immediately after the text that was pasted. – Tim Down Jun 21 '12 at 15:55
  • Have you seen [this question](http://stackoverflow.com/questions/2176861/javascript-get-clipboard-data-on-paste-event-cross-browser)? – Tim Down Jun 21 '12 at 15:56
  • @TimDown yes that's correct. #2 is the paste event (triggers via right click context menu, File > Paste or ctrl/cmd+v), #3 yes, with `_setText`. As for the other question, I dont have an issue getting the clipboard data (i do that with the setTimeout). – Oscar Godson Jun 21 '12 at 17:21
  • The other question could help by keeping the pasted content separate. If you allow the content to be pasted in place then it's difficult to find the end of the pasted content, especially if `_setText()` has potentially changed it. Do you have a demo or something I can look at? – Tim Down Jun 21 '12 at 22:49
  • let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/12883/discussion-between-tim-down-and-oscar-godson) – Tim Down Jun 21 '12 at 23:05

0 Answers0