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函数调用action方法？或者我如何为每一行创建ActionLink？

Answer 1

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

Kendo UI Grid中的自定义命令

1 个答案: