Question

我有一个基于我目前情况的问题，我有一个网格，里面有ClientDetail / Child网格。在我的父网格中有一个自定义命令按钮，比方说......

"columns.Command(
   command => { command.Custom("Edit").Click("showEdit"); command.Destroy();   
 }).Width(160);"

并且我的子网格中也有我的自定义命令按钮，让我们说...

"columns.Command(
 command => { command.Custom("Edit").Click("showSubEdit"); command.Destroy();    
 }).Width(160);"

这两个自定义命令应调用不同的功能，即“ showEdit ”＆amp; “的 showSubEdit ”。问题是，每次触发子网格中的自定义命令时，它总是调用其父级函数“showEdit”，但是子网格应该调用“showSubEdit”。

我错过了什么吗？

注意：

function showEdit(e) {
...
}
function showSubEdit(e) {
...
}

网格代码：

<div>
    @(Html.Kendo().Grid<ActivityModel>()
        .Name("GridActivity")
        .Columns(columns =>
        {
            //columns.Template(t => { }).Title("No").ClientTemplate("#= renderNumber(data) #").Width(50);
            columns.Bound(c => c._id).Visible(false);
            columns.Bound(c => c.ActivityType.TypeTitle).Title("Type").Width(80);
            columns.Bound(c => c.ActivityTitle).Title("Title").Width(120);
            columns.Bound(c => c.DependenciesStr).Title("Dependencies").Width(120);
            columns.Bound(c => c.ResourcesStr).Title("Resources").Width(120);
            columns.Bound(c => c.FromStr).Title("From");
            columns.Bound(c => c.ToStr).Title("To");
            columns.Bound(c => c.Status).Title("Status").Width(90).Format("{0:0.00} %").Width(85);
            columns.Bound(c => c.Weight).Title("Weight").Format("{0:0.00} %").Width(85);
            columns.Command(command => { command.Custom("Edit").Click("showEdit"); command.Destroy(); }).Width(160);
        })
        .HtmlAttributes(new { style = "height: 290px;" })
        .Groupable()
        .Scrollable()
        .Sortable()
        .Filterable()
        .ClientDetailTemplateId("template")
        .Pageable(x => x.PageSizes(new int[] { 10, 20 }).Refresh(true))
        .Resizable(resize => resize.Columns(true))
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(10)
            .Model(c => c.Id(p => p._id))
            .Read(read => read.Action("ProjectActivities_Read", "Project", new { projectId = ViewBag.ProjectId }))
            .Destroy(destroy => destroy.Action("ProjectActivities_Destroy", "Project", new { projectId = ViewBag.ProjectId }))
        )
        .Events(x => x.DataBound("resetRowNumber"))
    )
</div>

<script id="template" type="text/kendo-tmpl">
    @(Html.Kendo().TabStrip()
            .Name("TabStrip_#=_id#")
            .SelectedIndex(0)
            .Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
            .Items(items =>
            {
                items.Add().Text("Sub Activity").Content(@<text>
                    @(Html.Kendo().Grid<ActivityModel>()
                        .Name("GridChild_#=_id#")
                        .Columns(columns =>
                        {
                            columns.Bound(x => x._id).Visible(false);
                            columns.Bound(x => x.ActivityType.TypeTitle).Title("Type");
                            columns.Bound(x => x.ActivityTitle).Title("Title").Width(150);
                            columns.Bound(x => x.DependenciesStr).Title("Dependencies").Width(150);
                            columns.Bound(x => x.ResourcesStr).Title("Resources").Width(150);
                            columns.Bound(x => x.FromStr).Title("From");
                            columns.Bound(x => x.ToStr).Title("To");
                            columns.Bound(x => x.Status).Title("Status").Width(90).Format("{0:0.00} %").Width(85);
                            columns.Bound(x => x.Weight).Title("Weight").Format("{0:0.00} %").Width(85);
                            columns.Command(command => { command.Custom("Edit").Click("showEditSub"); command.Destroy(); }).Width(160);
                        })
                        .Pageable(x => x.PageSizes(new int[] { 5, 10 }).Refresh(true))
                        .Resizable(resize => resize.Columns(true))
                        .DataSource(dataSource => dataSource
                            .Ajax()
                            .PageSize(5)
                            .Model(x => x.Id(y => y._id))
                            .Read(read => read.Action("ProjectSubActivities_Read", "Project", new { projectId = ViewBag.ProjectId, activityId = "#=_id#" }))
                            .Destroy(destroy => destroy.Action("ProjectSubActivities_Destroy", "Project", new { projectId = ViewBag.ProjectId, activityId = "#=_id#" }))
                        )
                        .Pageable()
                        .Sortable()
                        .ToClientTemplate())
                </text>
                );
            }).ToClientTemplate())
</script>

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();
    }   
}

子网格自定义命令按钮

1 个答案: