Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Kendo UI Window widget - Dynamic title using templates

Is it possible to have dynamic window titles using templates?

Something like this:

wnd = $("#details").kendoWindow({
 title: #= ItemName #,
 modal: true,
 visible: false,
 resizable: false,
 width: 300}).data("kendoWindow");

I added ItemName in the title field merely to indicate the concept. Any idea?

like image 349
nouptime Avatar asked Nov 07 '13 03:11

nouptime


1 Answers

You can do it with setOptions api method, something like:

// Setting some options
wnd.setOptions({
    title: "dynamic title",
    width: "60%"
});

First initialize your window with your code and on some events (button click may be), use window object to set its options.

If its not clear, lets play with example: I am setting the window title on kendo-grid custom command button click:

<div class="k-content">
    <div id="noteswindow"></div>
</div>

<script>
$(document).ready(function () {
   $("#noteswindow")
        .kendoWindow({
            actions: ["Refresh", "Maximize", "Minimize", "Close"],            
            visible: false
        })   
});

function onNotesClick(e) {  // Custom button click
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    rData = dataItem;

    // Using same window variable again and again for successive clicks with dynamic content
    var nWin = $("#noteswindow").data("kendoWindow");

    // Setting some options
    nWin.setOptions({
        title: "Notes on " + dataItem.AssetOrShotName,
        width: "60%"
    });
    nWin.refresh({
        url: "../Task/Notes",
        data: { AssignId: rData.Id }
    });
    nWin.open().center();    
}
</script>
like image 58
Bishnu Rawal Avatar answered Nov 14 '22 23:11

Bishnu Rawal