ASP.NET MVCのKendo UIグリッドにアンカーリンク列を追加する方法

Question

ASP.NET MVC Kendo UIの新機能。私はASP.NET MVC 5を使用しています。ただし、「kendo.mvc.ui.fluent.gridboundColumnBuilder.ClientTemplate（String） 'には無効な引数がいくつかあります」のようなエラーが発生しています。 以下は私のコードです。

@(Html.Kendo().Grid<Music.DataAccess.Models.Genre>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Name).ClientTemplate(Html.ActionLink(c => c.Name, "Browse", new { genre = c.Name }));                
        columns.Bound(c => c.Description).Width(190);            
    })
    .HtmlAttributes(new { style = "height: 380px;" })
    .Scrollable()
    .Groupable()
    .Sortable()
    .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(5))
    .Filterable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .Read(read => read.Action("Genres_Read", "Store"))
            )
)

.

そしてここで私のジャンルモデル

 public class Genre
{
    public int GenreId { get; set; }
    [DisplayName("Genre Name")]
    public string Name { get; set; }
    public string Description { get; set; }

    public List<Album> Albums { get; set; }
}

.

誰かが私を助けてもらえますか？

Answer 1

このようなものになるでしょう：

@(Html.Kendo().Grid<Music.DataAccess.Models.Genre>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.Name).ClientTemplate("<a href='" + Url.Action("Browse") + "/?#= Name #'>Edit</a>");
        columns.Bound(c => c.Description).Width(190);            
    })
    .HtmlAttributes(new { style = "height: 380px;" })
    .Scrollable()
    .Groupable()
    .Sortable()
    .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(5))
    .Filterable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .Read(read => read.Action("Genres_Read", "Store"))
            )
)

.

Answer 2

列のクライアントテンプレートは、文字列または関数としてのJavaScriptの束を受け入れます。

個人的には、扱いやすいので、物事のフォーマット側をJavaScript関数に引き出すことをお勧めします。

だから、このようなものが機能するはずです：

グリッドカラム

columns.Bound(c => c.Name).ClientTemplate("#=getActionLink(data.Name)#")

.

JavaScript関数

function getActionLink(data)
{
 var link = "@Url.Action("YourActionHere","YourControllerHere")" + "/" + data;
 var returntext = "<a href='" + link + "'>" + data + "</a>";

return returntext;
}

.

明らかにあなたがそれを必要とする方法についてカスタマイズしますが、これはあなたのために働くべきです。