Plugin - Kendo UI - Window

Script

窗体对象

$("#window").kendoWindow({
    title: "Title",     // 标题
    width: 500,         // 宽度
    height: 300,        // 高度
    content: {
        url: "url",     // 内容url
        type: "post",
        data: { data : value },
        iframe: true,   // 是否 iframe
    },
    actions: [          // 按钮栏
        "Custom",           // 自定义
        "Pin",              // 固定
        "Refresh",          // 刷新
        "Minimize",         // 最小化
        "Maximize",         // 最大化
        "Close"             // 关闭
    ],
    modal: true,        // 是否模态
    daggable: true,     // 是否支持拖动
    pinned: false,      // 是否支持固定
    resizable: true,    // 是否支持调整大小

    open: Open,         // 打开事件
    close: Close,       // 关闭事件
    refresh: Refresh,   // 刷新事件
    activate: Activate,
    deactivate: deactivate,
    resize: Resize,
    dragstart: DragStart,
    dragend: DragEnd,
});

 

打开和居中窗口

$("#window").data("kendoWindow")
    .center()           // 窗口居中
    .open();            // 打开窗口

对同一窗口进行刷新

/*
* 打开窗体
* @@param {string} url 窗体地址
* @@param {string} title 窗体标题
* @@param {object} param 参数对象
*/
function openWindow(url, title, param) {
    // 窗口对象
    var dialog = $("#Win").data("kendoWindow");
    dialog.refresh({
        // 要刷新的视图url
        url: url,
        // 传入参数,
        // 似乎穿数组参数无效
        data: param,
    });
    // 设置标题
    dialog.title(title);
    dialog.open().center();
}

 

// 自定义按钮的事件绑定

window.data("kendoWindow").wrapper.find(".k-i-custom").click(function (e) {
    alert("Custom action button clicked");
    e.preventDefault();
});

 

 

加载内容的4种方式

@(
    Html.Kendo().Window()
    .Name("window")
    .Title("窗口")
    .Content(
        @<text>
            <div> 
                此种形式碰到 内部含有 Ajax.BeginForm 等表单形式的控件
                表单在解析的时候会失效, 导致不能提交
                解决方案是使用标签化的 form 来代替
            </div>
        </text>
    )
    .Draggable(true)
)


/*******************************************/
@(
    Html.Kendo().Window()
    .Name("window2")
    .Title("窗口2")
    .Content(
        "<div>此种形式的缺陷很明显, 只能用字符串能代表的形式来作为内容</div>"
    )
    .Draggable(true)
)


/*******************************************/
@(
    Html.Kendo().Window()
    .Name("window3")
    .Title("窗口3")
    .ContentSettings(s => s.TemplateId("template"))
    .Draggable(true)
)



<script id="template" type="text/template">
    <div>
        <!-- 
            此形式中不能添加 Html.Kendo().Button() 等控件
            否则会出现错误, 原因不明,
            解决方案是可以采用 <button class='k-button'> </button> 这种标签形式
         -->
    </div>
</script>

/*******************************************/

@(
    Html.Kendo().Window()
    .Name("window4")
    .Title("窗口4")
    .LoadContentFrom("Child", "Home")
    .Draggable(true)
)

@(
　　Html.Kendo().Window()
　　.Name("window4")
　　.Title("窗口4")
　　.ContentSettings(s => s.Url("Home/Child"))
　　.Draggable(true)
)

// 此种方式问题最少, 但必须经过 action, 也得新加一张页面