网格行上的上下文菜单不会打开

我从你的例子，我想

它添加上下文菜单简单的网格实现，但它只是没有做的工作（我拿到常规浏览器上下文菜单）。

这里是我的代码（ASP.NET MVC）

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-xs-18 col-md-12"> 

      <script type="text/x-kendo-template" id="rowTemplate"> 
       <div class="orderRow"> 
        <tr> 
         <td> 
          #:OrderID# 
         </td> 
         <td> 
          #:Freight# 
         </td> 
         <td> 
          #:OrderDate# 
         </td> 
         <td> 
          #:ShipName# 
         </td> 
         <td> 
          #:ShipCity# 
         </td> 
        </tr> 
       </div> 
      </script> 

      <script> 
       var rowTemplate = kendo.template($('#rowTemplate').html()); 
      </script> 

      @(Html.Kendo().Grid<APDashboard.Models.OrderViewModel>() 
       .Name("AgilePointDashboardGrid") 
       .Columns(columns => 
       { 
        columns.Bound(p => p.OrderID).Filterable(false); 
        columns.Bound(p => p.Freight); 
        columns.Bound(p => p.OrderDate).Format("{0:MM/dd/yyyy}"); 
        columns.Bound(p => p.ShipName); 
        columns.Bound(p => p.ShipCity); 
       }) 
       .ClientRowTemplate("#=rowTemplate(data)#") 
       .Pageable() 
       .Sortable() 
       .Scrollable() 
       .Filterable() 
       .HtmlAttributes(new { style = "height:550px;" }) 
       .DataSource(dataSource => dataSource 
        .Ajax() 
        .PageSize(20) 
        .Read(read => read.Action("Orders_Read", "Grid")) 
       ) 
      ) 

      @(Html.Kendo().ContextMenu() 
       .Name("menu") 
       .Target("#AgilePointDashboardGrid") 
       .Filter(".orderRow") 
       .Orientation(ContextMenuOrientation.Horizontal) 
       .Items(items => 
       { 
        items.Add() 
         .Text("Forward"); 
       }) 
      ) 
     </div> 
    </div> 

    <script> 
    $(document).ready(function() { 
     var menu = $("#menu"); 
     var original = menu.clone(true); 
     original.find(".k-state-active").removeClass("k-state-active"); 

     var initMenu = function() { 

      menu = $("#menu").kendoContextMenu({ 
       target: "#AgilePointDashboardGrid", 
       filter: ".orderRow", 
       select: function(e) { 
        // Do something on select 
       } 
      }); 
     }; 
     initMenu(); 
    }); 
    </script> 
</div>

我很想知道我在这里缺少

感谢

来源

2017-03-27 shahar eldad

最后我 “解决” 用它的JavaScript的方式而不是MVC方式。如果我会找到它不能在上面工作的原因，我会更新这个答案以显示两种方式。

这是我如何解决它：

<ul id="context-menu"> 
     <li>Edit</li> 
     <li> 
      Delete 
      <ul> 
       <li>Logical deletion</li> 
       <li>Permanent deletion</li> 
      </ul> 
     </li> 
    </ul> 

    <script> 
    $("#context-menu").kendoContextMenu({ 
     target: "#grid", 
     filter: "tr[role='row']", 
     select: function(e) { 
      var grid = $("#grid").data("kendoGrid"); 
      var model = grid.dataItem(e.target); 
      console.log(model); 
     } 
    }); 
    </script>

来源

2017-04-02 05:19:12

网格行上的上下文菜单不会打开

回答

相关问题