2017-12-04 18 views
0

セルのテキストの色をテレリックグリッドで変更しようとしています。私はここではASP.NET MVC を使用してい が、私はそれをやろうとしている方法です:セルのアクションがテレスコーク剣道グリッドで呼び出されない

@{ 
     Html.Kendo() 
      .Grid<DellZapFast.BackOffice.ViewModels.EventInstance.EventInstanceViewModelMin>() 
      .Name("grid") 
      .Columns(c => 
      { 
       c.Bound(a => a.Country); 
       c.Bound(a => a.Town); 
       c.Bound(a => a.StartDate).Format("{0:d}"); 
       c.Bound(a => a.EndDate).Format("{0:d}"); 
       c.Bound(a => a.GlobalEventName).Title("Type"); 
       c.Bound(a => a.Id) 
         .Title("Actions") 
         .Sortable(false) 
         .Filterable(false) 
         .Width(180) 
         .ClientTemplate 
         (
          "<button class='btn btn-default' data-toggle='modal' rel='tooltip' data-original-title='Dashboard' title='Dashboard' onclick='goToDashboard(\"" + "#=Id#" + "\")'><span class='glyphicon glyphicon-dashboard'></span></button>" + 
          "<button class='btn btn-default' data-toggle='modal' rel='tooltip' data-original-title='Edit this event Instance' title='Edit this eventInstance' data-target='\\#editeventInstance' onclick='getEditeventInstance(\"" + @Url.RouteUrl("EditEventInstance", new { eventInstanceId = "#=Id#" }) + "\")'><span class='glyphicon glyphicon-edit'></span></button>" + 
          "<button class='btn btn-default' data-toggle='modal' rel='tooltip' data-original-title='Copy this event Instance' title='Copy this event Instance' data-target='\\#copyEventInstance' onclick='getCopyEventInstance(\"" + @Url.RouteUrl("CopyEventInstance", new { eventInstanceId = "#=Id#" }) + "\")'><span class='glyphicon glyphicon-export'></span></button>" + 
          "<button type='button' class='btn btn-default' data-toggle='modal' rel='tooltip' data-original-title='Delete this event' title='Delete this event' data-target='\\#deleteeventInstance' onclick='deleteeventInstance(\"" + @Url.Action("delete", "EventInstance", new { eventInstanceId = "#=Id#" }) + "\");'><span class='glyphicon glyphicon-remove'></span></button>" 
        ); 
      }) 
     .CellAction(cell => 
     { 
      // if (cell.Column.Title == "Registered") 
      cell.HtmlAttributes["style"] = "background:red;"; 
     }) 
     .Scrollable(s => s.Height("auto")) 
     .Sortable() 
     .Groupable() 
     .Filterable() 
     .Pageable(p => p.Refresh(true).ButtonCount(3)) 
     .Deferred() 
     .DataSource(dataSource => dataSource 
      .Ajax() 
      .Read(read => read.Action("GetEvents", "eventInstance")) 
      .PageSize(50) 
     ) 
     .ToolBar(toolbar => 
        toolbar.Template(
        @<text> 
         @if (@ViewBag.NumberOfEventsArchived > 0) 
         { 
          <button id="btn-event-archived" class="btn btn-default"> @ViewBag.NumberOfEventsArchived Archived </button> 
         } 
        </text>) 
             ) 
         .Deferred() 
      .Render(); 

}

ここで私はtelerikのドキュメントから取ったものだ:

  .CellAction(cell => 
     { 

      cell.HtmlAttributes["style"] = "background:red;"; 
     }) 

CellActionのラムダ私のグリッドの各セルに対して呼び出されるはずですが、何も起こりません。私がCellActionラムダにブレークポイントを置くと、ブレークは起こりません。 私は何のエラーも出ません。何もしません。 私のコードは、テキストの色の代わりに背景の色を変更するはずですが、私はドキュメントからこのコードを取り出して、それがなぜ機能しないのか理解しようとします。

答えて

1

注意CellActionは、サーバー側のデータバインディングにのみ適用されます。
例:単純にjavascriptのバインドのいずれかのイベントをサブスクライブし、そこにセルスタイルを変更、結合、AJAXについては

@(Html.Kendo().Grid(Model.Data)  
     .Name("Grid") 
     .Columns(columns => { 
      columns.Bound(c => c.Id); 
      columns.Bound(c => c.Name).HtmlAttributes(new { style = "background:red;" }); 
     }) 
     .CellAction(cell => 
     { 
      if (cell.Column.Title == "Name") 
      { 
       cell.HtmlAttributes["style"] = "background:blue;"; 
      } 
     }) 
     .Pageable() 
     .Sortable() 
     .Scrollable() 
     .Filterable() 
     .Groupable() 
    ) 

関連する問題