Lệnh tùy chỉnh lưới có cấu trúc phân cấp đang gọi hàm javascript hai lần.

Question

Tôi đang sử dụng lưới kendo có lưới phân cấp (lưới bố mẹ và lưới phụ) với custom.command; Khi nút xem của Child (trong trường hợp lưới cha mẹ nó chạy tốt) được nhấp vào nó nên gọi hàm java-script cho thấy chi tiết cho hàng đó nhưng những gì đang xảy ra là nó gọi javascript hai lần, lần đầu tiên có id hàng chính xác (tức là cùng một hàng) và sau đó lần thứ hai với id sai (tức là id đầu tiên của lưới mẹ).

Mã như sau.

Parent-Lưới

@(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) 
) 
) 

Child-Lưới

<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> 

Javascript

<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> 

Và sau đó thông qua java script cửa sổ Kendo được mở ra.

@(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

Bạn có thể làm được việc này bằng cách kiểm tra nếu các yếu tố thể hiện bởi sự kiện lệnh đầu tiên được nhìn thấy:

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

I figured it out cuối cùng (đối với vấn đề của tôi ít nhất)

sự tên của hành động tùy chỉnh không được giống nhau trong lưới mẹ và con

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

để làm cho nó

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

Tôi hy vọng điều này sẽ tiết kiệm thời gian của người khác.