Kendo UI Window content not showing when Ajax loading html string

Question

I tried to load the Kendo UI Window content from an Ajax call, the Ajax call return s the html string, but the window not showing the content, here is the code,

HTML

<div id="helpWindow"></div>

Javascript

    $(document).ready(function () {
    var helpwindow = $("#helpWindow");

    $("#helpDutyCycle").bind("click", function () {
        $.ajax({
            url: "@Url.Action("HelpPartial","Help", new { key = "duty_cycle" })",
            type: "GET",                
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            error: function (response) {
                console.log(response);
            },
            success: function (response) {
                console.log(response.HelpContent);

                helpwindow.kendoWindow({
                    width: "615px",
                    title: "Help Info",
                    content: response.HelpContent // html string
                });
                helpwindow.data("kendoWindow").open();
            }
        });

    });
});

the console log prints the html string but not loading the content in Window.

Answer 1

As written in the documentation on https://docs.telerik.com/kendo-ui/api/javascript/ui/window/configuration/content the option content does not specify the content as such but an uri where to load it. Use content() instead, see https://docs.telerik.com/kendo-ui/api/javascript/ui/window/methods/content

Alternatively, you could load the content directly if you change the return so it contains the content only by giving the uri to the window:

var win = $("#helpWindow").getKendoWindow();
win.refresh({
    url: "@Url.Action("HelpPartial", "Help", new { key = "duty_cycle" })"
});