2017-03-27 2 views
0

フォーラムで検索して、欠けているものが見つかりませんでした。 (私は通常のブラウザのコンテキストメニューを取得する)グリッド行のコンテキストメニューが開かない

私は

したかったあなたの例から、単純なグリッドの実装を持っているが、それにコンテキストメニューを追加しますが、それはただの仕事をしません。ここ

は私のコード(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> 

は私がここに

をしないのですかを知るのが大好きだあるおかげで

答えて

0

結局私は、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> 
関連する問題