Issue with conent url in kendo window

2 posts, 0 answers
  1. Nirmala
    Nirmala avatar
    2 posts
    Member since:
    Dec 2011

    Posted 30 Nov 2012 Link to this post


    We are facing an issue with assignment of content of the kendo window from a javascript. The content to be assigned is a url, which links to an action in a controller and this action method returns a partial view, which is to be shown in the window.

    We are opening the window ,while clicking on the toolbar create button on the grid. Gird binding is given as follows and after that the declaration of the window is also given

                            .ToolBar(toolbar => toolbar.Template(
                                    <a class="k-button k-button-icon k-grid-add" href="#" onclick="AddNewPost(@Model.ClientId)" title="Add New Post">
                                    <span class="k-icon k-add"></span>

                                                    .Columns(columns =>
                                                        columns.Bound(p => p.poPostId).Hidden();
                                                        columns.Bound(p => p.poTitle).Title("Post Title").Width(390);
                                                        columns.Bound(p => p.poCreateTime).Format("{0:MM/dd/yyyy hh:mm:ss tt}").Title("Created").Width(180);
                                                        columns.Bound(p => p.poUpdateTime).Format("{0:MM/dd/yyyy hh:mm:ss tt}").Title("Last Updated").Width(200);
                                                    .Pageable(pager => pager.PageSizes(true))
                                                    .DataSource(dataSource => dataSource.Ajax()
                                                                                        .Read(read => read.Action("GetMessages", "Home", new { area = "Post", id = Model.ClientId }))
                                                                                        .Model(model => model.Id(p => p.poPostId))
                            <script type="text/x-kendo-template" id="toobarTemplate">

                                //.Buttons(buttons => buttons.Close())

    The above given window is opened when the add button on the grid's toolbar is clicked. The java script to open the popup is given below.

    function AddNewPost(clientid) {
        OpenPostAddEditWindow("Add New Post",0, clientid);

    function OpenPostAddEditWindow(title, id, clientId) {   
       var window = $("#window").data("kendoWindow");
       window.content({ url: "/Post/Manage/Edit",
           data: { id: 0, clientId: -1112}
       window.title("New Post");

    when we were using telerik window, the code we used is as given below:

    function OpenPostAddEditWindow(title, id,clientId) {
        var url = $.Site.RelativeWebRoot + "Post/Manage/Edit?id=" + id + "&clientId=" + clientId;
        var windowElement = $.telerik.window.create({
            Name: "PostWindow",
            title: title,
            html: '',
            contentUrl: url,
            modal: true,
            resizable: false,
            width: 850,
            height: 400,
            draggable: true,
            onClose: function (e) {
            onRefresh: function (e) {


    how can we make it work same as telerik window and how to call an action in the controller given in the url.Please review this and send us the feedback as early as possible.

  2. Daniel
    Daniel avatar
    2177 posts

    Posted 03 Dec 2012 Link to this post

    Hello Nirmala,

    You should use the refresh method if you wish to load the content with a request:

    var window = $("#window").data("kendoWindow");
    window.refresh({ url: "/Post/Manage/Edit",
       data: { id: 0, clientId: -1112}
    The content method accepts a string with the new Window content.

    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top