javascriptkendo-uiundo-redoctrlkendo-editor

Handle Ctrl+Z (undo/redo) for text editor in single page application


I have single page application which consists of a text editor (kendo Editor). The data in the text editor are replaced somewhat like this

$("#editor").kendoEditor({
                    resizable: {
                        content: false,
                        toolbar: true
                    }
                });

                var editor = $("#editor").data("kendoEditor");

                var setValue = function () {
                    editor.value($("#value").val());
                };

see demo here.

The Issue: So I am changing record of A then save it. Then I switch to B. Now if I do Ctrl+Z the text editor shows the record of A. How can I prevent this behavior.

Is a way to remove the undo history on demand, or something which would prevent the text editor replacing text with previous record?


Solution

  • Updated: Better Solution.

    I contacted Kendo devs and they provided a neat solution.

    var editor = $("#editor").data("kendoEditor");
    editor.undoRedoStack.clear();
    

    Note: this function is not documented in the public api and is may change in newer version. This is working as of version 2016.3.1118

    demo

    Old Solution.

    I ended up destroying and rebinding the widget to the textarea.

    http://dojo.telerik.com/OjIZe

    $("#destroy").click(function(){ 
      var copy=$("#editor").clone(); 
      $("#editor").data('kendoEditor').wrapper.find("iframe").remove(); 
      $("#editor").data('kendoEditor').destroy(); 
      $("#test").empty(); 
      $("#test").append(copy); 
      $("#editor").kendoEditor({ resizable:    { 
        content: false, toolbar: true 
      } 
      }); 
    });