如何使kendo网格行完全超链接?

时间:2015-11-13 21:20:38

标签: asp.net asp.net-mvc kendo-ui telerik kendo-grid

我已经使我的kendo网格行可选,但在谷歌搜索之后我找不到任何能告诉我如何使该行成为超链接的内容。我希望有人能够点击该行的任意位置并转到提供的网址。我尝试了行模板,这打破了我的网格。这是在asp.net MVC中完成的。

 @(Html.Kendo().Grid<EmployeeMasterView>()
              .Name("grid")
              .Columns(columns =>
              {
                  columns.Bound(e => e.EmployeePicture).ClientTemplate("<img src='" + Url.Content("~/Content/img/#: EmployeePicture#") + "' height='50px' width='50px' />").Title("Picture").Width(100);
                  columns.Bound(e => e.FirstName).Width(120).ClientTemplate("<a href='" + Url.Action("Index", "Employees", new {E="#: EmployeeID#" }) + "' >#: FirstName#</a>");
                  columns.Bound(e => e.LastName).Width(120);
                  columns.Bound(e => e.EmployeeID).Width(120);
                  columns.Bound(e => e.Email).Width(200);
                  columns.Bound(e => e.Department).Width(155);
                  columns.Bound(e => e.StrGender).Title("Gender").Hidden(true);
                  columns.Bound(e => e.BlnInactive).Title("Inactive").Hidden(true).ClientTemplate("<input type='checkbox' #= BlnInactive ? checked='checked' : '' # disabled='disabled'></input>");
              })
              .Sortable()
              .Selectable()
              .Scrollable()
              .Groupable()
              .ColumnMenu()
                //.Pageable()
              .Filterable()
              .ClientDetailTemplateId("template")
              .HtmlAttributes(new { style = "height:600px;" })
              .Reorderable(reorder => reorder.Columns(true))
              .Resizable(resize => resize.Columns(true))
              .DataSource(dataSource => dataSource
                  .Ajax()
                  //  .PageSize(10)
                          .Read(read => read.Action("DetailTemplate_Employees", "Employees"))

              )
              .Events(events => events.DataBound("dataBound"))
        )

2 个答案:

答案 0 :(得分:0)

您可以处理更改事件

{{1}}

然后在更改事件javascript中,获取所选行的dataItem,找到该URL并启动它。

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-change

答案 1 :(得分:0)

使用行模板,您正走在正确的道路上。您应该能够自定义http://demos.telerik.com/aspnet-mvc/grid/rowtemplate中的示例以满足您的目的。

如果您遇到问题,请发布您的代码,以便我们查看。