how to reuse kendo-ui window jquery

Question

I have seen some posts about this issue but I am getting a actual error instead of it just not opening. the window opens successfully on a success function. however i am receiving the error message after I close it and then try to reopen it.

Error Message

Uncaught TypeError: Cannot read property 'open' of undefined

$(document).ready(function () {
$(".export-pdf").click(function () {
        $.ajax({
            url: "/Home/Save",
            type: "POST",
            data: { source: data },
            success: function (data, textStatus, jqXHR) {
                openEmailWindow();

            }
        });

    });
});

function openEmailWindow() {
    var window = $("#email");
       $("#undo1")
           .bind("click", function () {
               window.data("kendoWindow").open();
           });


    if (!window.data("kendoWindow")) {
        window.kendoWindow({
            width: "600px",
            title: "Subject Property",
            actions: ["Close"],
            deactivate: onDeactivate
        });
    }
    function onDeactivate(e) {
        this.destroy();
        console.log("event :: deactivate");
    }
  }

});

view

<span  id="undo1" style="margin-left: 865px" class="export-pdf k-button">Print Pdf</span>

  <div id="email"></div>

Answer 1

The issue is happening because you are destroying the window during deactivation. Instead of that you should use the close function

function onDeactivate(e) {
        this.close();
        console.log("event :: deactivate");
    }

Please refer the sample fiddle here

Answer 2

The problem is that you are calling this.destroy() in your deactivate handler which removes the widget html from the DOM.

Therefore, it cannot open because it doesn't exist.

http://docs.telerik.com/kendo-ui/api/javascript/ui/window#methods-destroy