Kendo UI Grid中的自定义命令

Question

我想写一些代码，通过使用Action方法可以显示我的项目的详细信息。

@(Html.Kendo().Grid<Jahan.Blog.Model.Article>() 
      .Name("ArticleAdmin").Navigatable() 
      .Resizable(c => c.Columns(true)) 
      .HtmlAttributes(new { @class = "cursorLink", @style = "width: 1000px;height:auto;overflow: scroll;" }) 
      .Columns(columns => 
      { 
       columns.Bound(p => p.UserId).Width(100); 
       columns.Bound(p => p.Title).Width(200); 
       columns.Bound(p => p.LikeCounter).Width(100); 
       columns.Bound(p => p.RateCounter).Width(100); 
       columns.Bound(p => p.IsActive).Encoded(false).ClientTemplate("<img src='/Content/#= IsActive ? 'tick.png' : 'cross.png' #''>").Width(80); 
       columns.Bound(p => p.IsActiveNewComment).Encoded(false).ClientTemplate("#= showActivationStatusIcon(IsActiveNewComment) #").Width(170); 
       columns.Bound(p => p.CreatedDate).Width(160).Format("{0:G}"); 
       columns.Bound(p => p.ModifiedDate).Width(160).Format("{0:G}"); 
       columns.Command(command => command.Destroy()).Width(170); 
       columns.Command(command => command.Custom("ViewDetails").Click("showDetails")).Width(60); 
      }) 
      .ToolBar(toolbar => 
      { 
       toolbar.Create(); 
       toolbar.Save(); 
      }) 
      .Editable(editable => editable.Mode(GridEditMode.InCell)) 
      .Pageable() 
      .Navigatable() 
      .Sortable() 
      .Scrollable() 
      .DataSource(dataSource => dataSource 
       .Ajax() 
       .Batch(true) 
       .PageSize(20) 
       .ServerOperation(false) 
       .Events(events => events.Error("error_handler")) 
       .Model(model => model.Id(p => p.Id)) 
       .Create("Editing_Create", "ArticleAdmin") 
       .Read("Editing_Read", "ArticleAdmin") 
       .Update("Editing_Update", "ArticleAdmin") 
       .Destroy("Editing_Destroy", "ArticleAdmin") 
     )) 

为了实现这个目标，我使用了自定义命令。

columns.Command(command => command.Custom("ViewDetails").Click("showDetails")).Width(60); 

function showDetails() { 
    // what code should be written here? 
    // var action = '@Url.Action("Details", "ArticleAdmin")'; 
} 

另一方面，如何以正确的方式从javascript函数调用操作方法？ 或者我如何为每一行创建ActionLink？

Answer 1

columns.Template(x => { }).ClientTemplate("<a href='" + Url.Action("Details", "ArticleAdmin") + "/#=Id#'>Details</a>").Width(60);