Question

我正在使用kendo Grid及其上定义的自定义按钮，如下所示

@(Html.Kendo().Grid((IEnumerable<AdjustmentModel  >)ViewBag.Adjustments)
  .Name("AdjustmentsGrid")
  .DefaultConfiguration()
  .HtmlAttributes(new { style = "height=100%" })
  .ToolBar(toolbar => {
      toolbar.Custom().Text("Search");
      toolbar.Custom().Text("Apply Adjustment");
      toolbar.Custom().Text("Clear");
  })

我想在“应用调整”按钮上打开一个剑道窗口。怎么做到了？另外如何在剑道窗口上提供网格？

请告诉我。

感谢。

Answer 1

...
toolbar.Custom().Text("Apply Adjustment").HtmlAttributes(new { @id = "applyadjust"})
...

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

<script>
var window = $("#applyadjustmentwindow"),
    applybtn = $("#applyadjust")
        .bind("click", function () {
            window.data("kendoWindow").open().center();                
        });

window.kendoWindow({
    title: "Apply Adjustment",
    actions: ["Minimize", "Maximize", "Refresh", "Close"],
    content: "URL to the action from which you are loading the html (can be partial view or plain html) on the window",        
    visible: false,        
    width: "50%"
});

Answer 2

我这样做。

首先使用display：none

在div中声明一个kendo窗口

<div style="display:none">
  @(Html.Kendo().Window() .Name("MyWindowName") .Title("Test Window") .Content(@
  <text>
    <p>
      I am just for a demo
    </p>
  </text>) .Draggable() .Resizable() .Width(350) .Actions(actions => actions.Close()) )
</div>

然后在Kendo Grid工具栏中添加一个按钮，

toolBar.Custom().Text("Open Window").Url("javascript:OpenKendoWindow()");

然后添加一个javascript函数

function OpenKendoWindow(e) {
  $("#MyWindowName").data("kendoWindow").center(); // This will open the window on the center of the page
}

多数民众赞成。

如何在自定义按钮上打开kendo窗口

2 个答案: