Question

I’ve made a little inline editor with some clean up logic. So if you paste from a word file it deletes all the formatting.

My problem is, that if you select e.g. one sentence and paste, it doesn’t get replaced. This is duo to the cleanUp logic. Now I need to know, how I can delete a range with rangy, so I can delete this range before I paste.

http://jsfiddle.net/eJNKy/3/

Answer 1

You can delete a range using its deleteContents() method.

Rangy also deals with a lot of the cross-browser issues you’re attempting to fix in your jsFiddle. It provides a createContextualFragment() implementation and a selection object with getRangeAt(). Also, you should use the ctrlKey property of the keydown event. Here’s an updated jsFiddle:

http://jsfiddle.net/timdown/eJNKy/6/

The crucial function is

function paste(html) {
    var sel = rangy.getSelection();
    if (html && sel.rangeCount > 0) {
        var range = sel.getRangeAt(0);
        range.deleteContents();
        var frag = range.createContextualFragment(html);
        var lastChild = frag.lastChild;
        range.insertNode(frag);
        range.collapseAfter(lastChild);
        sel.setSingleRange(range);
    }
}