將劍道網格的值傳遞給彈出窗口

Question

我在我的MVC5頁面中實現了劍道網格和上下文菜單。點擊更新狀態菜單，我打開一個窗口。我需要在彈出窗口中從選定行中檢索requestid和其他幾個字段。我還需要顯示一個包含值的下拉控件。請告訴我這樣做

電網

的最佳途徑

div class="requestgrid" id="requestGrid"> 
@(Html.Kendo().Grid<CC.GRP.MCRequest.ViewModels.RequestViewModel>() 
.Name("GridRequest") 
.Columns(columns => { 
    columns.Bound(o => o.RequestID).Width("100px"); 
    columns.Bound(o => o.CountryCode).Width("100px"); 
    columns.Bound(o => o.SalesOffice).Width("100px"); 
    columns.Bound(o => o.CustomerNumber).Width("120px"); 
    columns.Bound(o => o.ProjectName).Width("120px"); 
    columns.Bound(o => o.ProjectContent).Width("120px"); 
    columns.Bound(o => o.ContractStartDate).Width("140px"); 
    columns.Bound(o => o.Priority).Width("120px"); 
    columns.Bound(o => o.NameOfResponsiblePerson).Width("170px"); 
    columns.Bound(o => o.Status).Width("100px"); 
    columns.Bound(o => o.CreatedBy).Width("110px"); 
    columns.Bound(o => o.CreatedDate).Width("110px"); 
    columns.Bound(o => o.ModifiedBy).Width("110px"); 
}) 
//.ToolBar(toolbar => toolbar.Create()) 
//.Editable(editable => editable.Mode(GridEditMode.PopUp)) 
.Pageable() 
.Sortable() 
.Filterable() 
.Scrollable() 
.Groupable() 

.Selectable(selectable => selectable 
    .Mode(GridSelectionMode.Single) 
    .Type(GridSelectionType.Row)) 
    .Events(events => events 
    .Change("onChange") 
) 
.DataSource(dataSource => dataSource 
    .Ajax() 
    .Model(model => model.Id(t => t.RequestID)) 
     //.Create(update => update.Action("Team_Create", "Admin")) 
     .Read(read => read.Action("Requests_Read", "Request")) 
    //.Update(update => update.Action("Team_Update", "Admin")) 
    ) 
) 

上下文菜單

@(Html.Kendo().ContextMenu() 
     .Name("RequestMenu") 
     .Target("#GridRequest") 
     .Filter("tr") 
     .Orientation(ContextMenuOrientation.Vertical) 
     .Animation(animation => 
     { 
      animation.Open(open => 
      { 
       open.Fade(FadeDirection.In); 
       open.Duration(500); 
      }); 
     }) 
     .Items(items => 
     { 
      items.Add() 
       .Text("Edit"); 

      items.Add() 
       .Text("Update Status"); 

     }) 

     .Events(e => 
     { 
      e.Select("onSelect"); 

     }) 
    ) 

的Javascript

function onSelect(e) { 
     var grid = $("#GridTeam").data("kendoGrid"); 
     var requestId; 

     switch ($(e.item).children(".k-link").text()) { 

      case "Edit": 

       var grid = $("#GridRequest").data("kendoGrid"); 
       var column = grid.columns[0]; 
       var selectedBackup = grid.dataItem(grid.select()); 
       requestId = selectedBackup.id; 
       window.location.href = '@Url.Action("EditRequest", "Request", new { id = "_id_", status="Edit" })'.replace('_id_', requestId); 
       break; 
      case "Update Status": 
       //alert("Work in progress"); 
       //$('#window1').data('kendoWindow').center().open(); 

       var myWindow = $("#window"); 

       //e.preventDefault(); 
       //var dataItem = this.dataItem($(e.currentTarget).closest("tr")); 

       //kendo.bind($("#window"), dataItem); 



        myWindow.kendoWindow({ 
        width: "400px", 
        height: "180px", 
        title: "Update Request Status", 
        modal: true, 
        visible: false, 
        actions: ["Minimize", "Maximize", "Close"], 

       }).data("kendoWindow"); 
        myWindow.data("kendoWindow").center().open(); 
     } 

Answer 1

你幾乎權，只有這樣它兩個細節：

1. 如果將contextMenu的目標綁定到網格的容器，那麼您將永遠無法確定哪個用戶點擊過。我建議你改爲綁定到網格的行（TR），例如#GridRequest tbody tr;

2. 恐怕e.currentTarget在該上下文中不存在或返回undefined。你應該使用e.target這將指向點擊行，如果你做了我上面的建議。然後，你可以讓你的DataItem如下：

   grid.dataItem(e.target); 
   

退房this demo與我的建議的工作。