0

I'm searching for a javascript solution for the following problem. I'm using CKEditor on my website, but i think that this is irrelavant. Because i think that this is a native functionality and not a functionality of the CKEditor.

I would like to disable moving selected text within the editor. The user needs to be able to move select text within the editor, this may not be disabled.

The only thing that i would like to disable is the moving of a selection. Or better the drop of a selection.

Spons
  • 1,593
  • 1
  • 17
  • 46
  • I searched on the Web, google, stackoverflow. But i really don't know where to start. Which event is handeling this? To start? – Spons Mar 18 '13 at 17:19
  • can you explain why you want this? – 23tux Mar 18 '13 at 17:20
  • I'm making an track changes functionality. and i can't find a way to track this changes. – Spons Mar 18 '13 at 17:21
  • And everywhere i'm searching on the web, i keep ending up with the same element moving.. and they are explaning things/events as moving out of the element. But if you move a text selection, that is a element, A TextNode or a part of a textnode then i don't want events like dragout? or am i wrong? – Spons Mar 18 '13 at 17:23
  • For change tracking, could you just bind to a change event on the element? – MrGrigg Mar 18 '13 at 17:32
  • The onChange event indeed is a nice idea. but i'm looking for a more separated way of tracking input which i already have found. but tnx for the feedback. – Spons Mar 19 '13 at 12:44

1 Answers1

1

Use the ondrop event.

myEditor.ondrop = function preventDrop (e) {
    e.preventDefault();
};

jsfiddle.net/PHgdZ

But, if change tracking is what you are actually after, there's no need to prevent drag and drop. Just use the ondrop event to track the change. And for newer browsers, just use oninput. That will detect changes regardless of the input method.

jsfiddle.net/PHgdZ/1

gilly3
  • 87,962
  • 25
  • 144
  • 176
  • the oninput event isn't supported sadly in -IE9 and the client likes to have support until ie7. But besides that the oninput is like the onchange in one of the comments above a complete solution which i don't need. Thank for the idea though. The ondrop event is exactly what i'm looking for. Personaly i would extend your solution with a editor.ondragstart = function (e) { e.preventDefault(); }; To not give your client the idea of a possibility. http://jsfiddle.net/PHgdZ/2/ – Spons Mar 19 '13 at 12:51
  • And not only input will be tracked also deletes must be tracked. Therefor a oninput nor the onchange event like in the comment of MrGrigg will be usefull. Because now i have to find from the onDragStart what is selected, and mark it like deleted. After that i have to wait for an insert. and if not dropped within the text area. the last marked deleted text will be undone. But for now i keep with the prevent to be save. New Feature in the next version ;) – Spons Mar 19 '13 at 12:56
  • 1
    @spons - Yes, `ondragstart` is a logical extension that could certainly enhance usability. Rather than completely canceling the event, it may be better to just set `cursor: no-drop` for `editor` during `ondragover` and reset the cursor during `ondragleave`. That way it provides the user with the visual cue that drop is not available, but does not cripple the browser. – gilly3 Mar 19 '13 at 18:15
  • @spons - `oninput` is *not* like `onchange`, which is fired when the control loses focus. `oninput` is fired every time the value changes, even while it has focus. `oninput` also differs from the `onkey*` events in that it is not fired when, for example, arrow keys are pressed. Both `oninput` and `onchange` are fired for deletes, but never `ondrop`. And `ondragstart` does not necessarily indicate a delete. If you are implementing an undo stack, I'd use `oninput` with graceful degradation. To just show changes, use `onchange` and a diff algorithm like John Resig's [jsdiff](http://goo.gl/c7Htq). – gilly3 Mar 19 '13 at 19:12
  • I never said they are equal. i was talking about the fact that it is a full solution for a part that i'm not looking for. that's why i said that it's like the onchange idea in one of the posts above. Besides that i never intented to make a undo stack. because a undo stack already exists in the CKEditor. undo stack is a complete solution for all undo's and i'm doing way more actions than that.But don't worry.. that's why i said that it is something for a next version. because i don't have time to research it. – Spons Mar 20 '13 at 08:02