Kendo网格不会在按钮点击时打开kendo窗口

时间:2014-05-04 05:50:32

标签: asp.net-mvc asp.net-mvc-4 kendo-ui kendo-grid kendo-asp.net-mvc

我正在研究MVC 4应用程序,并且在我的视图中使用了Kendo UI网格。该视图有一个显示按钮的命令列。单击此按钮,我应该显示一个显示部分视图的kendo窗口(弹出窗口)。单击此窗口上的“关闭”按钮,我应该再次返回到网格,网格应该刷新。 现在我有2个问题,

  • 点击网格上的按钮后,它只显示窗口 once.i.e.如果它关闭窗口并再次尝试单击按钮 网格,没有任何按钮响应!
  • 点击窗口上的关闭按钮后,通过窗口 关闭,但网格不会刷新。而是整个页面 刷新。

我使用了以下代码,

@(Html.Kendo()
      .Grid(Model)
      .Name("DefectGrid")
      .Columns(columns =>
      {
          columns.Bound(d => d.DefectId).Title("ID").Width("5%");
          columns.Bound(d => d.Title).Title("Title").Width("20%");
          columns.Bound(d => d.Severity).Title("Severity").Width("10%");
          columns.Bound(d => d.Status).Title("Status").Width("10%");
          columns.Bound(d => d.Description).Title("Description").Width("20%");
          columns.Bound(d => d.LoggedBy).Title("LoggedBy").Width("10%");
          columns.Bound(d => d.LoggedOn).Title("LoggedOn").Width("10%");
          columns.Command(command => command.Custom("ViewDetails").Click("showDetails"));
      })
      .Pageable()
      .Sortable()
      .Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple))
      .Scrollable(scr => scr.Height(200))
      .DataSource(dataSource => dataSource
                                          .Ajax()
                                          .Read(read => read.Action("LoadDefects", "Home").Data("refreshGrid").Type(HttpVerbs.Get))
                                          .PageSize(20)
                                          .ServerOperation(false)))

        @(Html.Kendo()
              .Window()
              .Name("Details")
              .Title("Defect Details")
              .Visible(false)
              .Modal(true)
              .Draggable(true)
              .Width(1000)
              .Height(600)
              .Events(ev => ev.Close("onClose"))
        )
        <script type="text/x-kendo-template" id="template">
            <div id="defectDetails">
            </div>
        </script>
            function showDetails(e) {
//                e.preventDefault();

                var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
                var wnd = $("#Details").data("kendoWindow");

                var defId = dataItem.DefectId;
                var actionURL = '@Url.Action("DefectDetail", "Home")';

                wnd.refresh({
                                url: actionURL,
                                data: { defectId: defId }
                            });
                wnd.center();
                wnd.open();
            }

            function onClose(e) {
                if (!confirm("Are you sure you want to close window?"))
                    e.preventDefault();
            }

任何人都可以建议我哪里出错了,我该如何解决这个问题!!!

提前致谢

2 个答案:

答案 0 :(得分:1)

尝试这样做,添加script标记,它就可以了。

<script type="text/javascript">
            function showDetails(e) {

                var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
                var wnd = $("#Details").data("kendoWindow");

                var defId = dataItem.DefectId;
                var actionURL = '@Url.Action("DefectDetail", "Home")';

                wnd.refresh({
                    url: actionURL,
                    data: { defectId: defId }
                });
                wnd.center();
                wnd.open();
            }
        </script>

答案 1 :(得分:0)

您可以通过调用网格元素上的dataSource.read()来刷新网格

可能你可以在窗口的onClose()事件中做到,

$("#DefectGrid").data("kendoGrid").dataSource.read();