具有层次结构的网格自定义命令正在调用 javascript 函数两次

Question

我正在使用具有分层网格(父网格和子网格(的剑道网格和自定义命令;当单击Child的视图按钮(在父网格的情况下它运行良好(时，它应该调用java-script函数，该函数显示该行的详细信息，但正在发生的事情是它调用javascript两次，第一次具有正确的行ID(即同一行(，然后第二次具有错误的id(即父网格的第一个ID(。

代码如下。

父网格

@(Html.Kendo().Grid<IRIS.Web.BackOffice.ViewModels.AuditListView>()
.Name("GridAudit")
.Columns(column =>
    {
        column.Bound(model => model.LogId).Visible(true);
        column.Bound(model => model.Date);
        column.Bound(model => model.Time);
        column.Bound(model => model.User).ClientTemplate(IRIS.Common.Helpers.ViewTemplateFormats.GetUnWrapColum("User"));
        column.Bound(model => model.Module).ClientTemplate(IRIS.Common.Helpers.ViewTemplateFormats.GetUnWrapColum("Module")).Width(150);
        column.Bound(model => model.Activity);
        column.Bound(model => model.Description).ClientTemplate(IRIS.Common.Helpers.ViewTemplateFormats.GetUnWrapColum("Description")).Width(200);
        column.Command(command =>
        {
            command.Custom("View").Text(" ").Click("onParentAuditHirarchy");
        }).Width("6em").Title("Actions");
    })
.Reorderable(reorder => reorder.Columns(true))
.Selectable(select => select.Enabled(true).Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
.ClientDetailTemplateId("template1")
.Sortable()
.Scrollable(scroll => scroll.Enabled(false))
.Filterable()
.Pageable(page => page.ButtonCount(5))
.HtmlAttributes(new { style = "height:400px" })
.DataSource(dataSource => dataSource
    .Ajax()
    .Read(read => read.Action("Audit_Load", "AuditLog").Data("getSearchData")
)
.PageSize(11)
)
)

子电网

<script id="template1" type="text/kendo-tmpl">
@(Html.Kendo().Grid<IRIS.Web.BackOffice.ViewModels.AuditListView>()
    .Name("GridDetails" + "#=LogId#")
    .AutoBind(true)
    .Resizable(resize => resize.Columns(true))
    .Reorderable(reorder => reorder.Columns(true))
     .Columns(column =>
    {
        column.Bound(model => model.LogId).Visible(true);
        column.Bound(model => model.Date);
        column.Bound(model => model.Time);
        column.Bound(model => model.User).ClientTemplate(IRIS.Common.Helpers.ViewTemplateFormats.GetUnWrapColum("User"));
        column.Bound(model => model.Module).ClientTemplate(IRIS.Common.Helpers.ViewTemplateFormats.GetUnWrapColum("Module")).Width(150);
        column.Bound(model => model.Activity);
        column.Bound(model => model.Description).Width(200);//.ClientTemplate(IRIS.Common.Helpers.ViewTemplateFormats.GetUnWrapColum("Description")).Width(200);
        column.Command(command =>
        {
            command.Custom("View").Text(" ").Click("onGridAuditHirarchy");
        }).Width("6em").Title("Actions");
    })
    .Selectable()
    .ClientDetailTemplateId("template2")
    .Sortable()
    .HtmlAttributes(new { style = "height:300px;" })
    .Scrollable(scroll => scroll.Enabled(false))
    .Filterable()
    .Pageable(page => page.ButtonCount(5))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("LoadHirarchy", "AuditLog", new { auditId = "#=LogId#" }))
        .PageSize(3)
    )
    .ToClientTemplate()
 )
 </script>

爪哇语

<script type="text/javascript">
function GetAuditId() {
    return {
        auditId: $(hdnTempGridId).val()
    }
}
onParentAuditHirarchy = function (e) {
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    var id = dataItem.LogId;
        $(hdnTempGridId).val(id);
        var win = $("#window").data("kendoWindow");
        var grid = $("#GridDetails").data("kendoGrid");
        grid.dataSource.read();
        win.setOptions({
            width: 900,
            height: 400
        });
        win.open();
        win.center();

}
onGridAuditHirarchy = function (e) {
    e.preventDefault();
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    var id = dataItem.LogId;
    if (e.delegateTarget.id != 'GridAudit') {
        $(hdnTempGridId).val(id);
        var win = $("#window").data("kendoWindow");
        var grid = $("#GridDetails").data("kendoGrid");
        grid.dataSource.read();
        win.setOptions({
            width: 900,
            height: 400
        });
        win.open();
        win.center();
    }
}
$(document).ready(function () {
    var win = $("#window").data("kendoWindow");
    win.close();
});
</script>

然后通过java脚本Kendo窗口打开。

@(Html.Kendo().Window()
  .Name("window") //The name of the window is mandatory. It specifies the "id" attribute of the widget.
  .Title("Audit Log Detail(s)") //set the title of the window
  .Content(@<text>
      @(Html.Kendo().Grid<IRIS.Web.BackOffice.ViewModels.AuditDetailListModel>()
    .Name("GridDetails")
    .AutoBind(false)
    .Resizable(resize => resize.Columns(true))
    .Reorderable(reorder => reorder.Columns(true))
    .Selectable()
    .Sortable()
    .HtmlAttributes(new { style = "height:300px;" })
    .Scrollable(scroll => scroll.Enabled(false))
    .Filterable()
    .Pageable(page => page.ButtonCount(5))
    .DataSource(dataSource => dataSource
                .Ajax()
                .Read(read => read.Action("LoadDetails", "AuditLog").Data("GetAuditId"))
                .PageSize(10)
            )
)
            </text>)
  .Visible(false)
  .Modal(true)
)

Answer 1

您可以通过检查第一个命令事件显示的元素是否可见来解决此问题：

function showDetailsLevel(e) {
    e.preventDefault();
    originatingId = this.dataItem($(e.currentTarget).closest("tr")).Id
    var wnd = $("#Details").data("kendoWindow");  
    if (!$("#Details").is(":visible")) { 
        wnd.center();
        wnd.open();
        var grid = $("#DetailGrid").data("kendoGrid");
        grid.dataSource.read();
    }   
}

Answer 2

我终于想通了(至少对于我的问题(

自定义操作的名称在父网格和子网格中不能相同

command.Custom("View")//parent
command.Custom("View")//child

所以让它

command.Custom("View1")//parent
command.Custom("View2")//child

我希望这可以节省别人的时间。