Question

我正在尝试设置网格的一行（来自客户端）。

这是我的设置：我使用Ajax绑定来加载初始Grid数据。之后，我将根据来自其他控件的事件编辑来自客户端的所有数据。因此，用户可以单击某个其他控件，这会导致在我的Gird上“突出显示”行（而不会实际触及网格）。

我做了一些检查（使用firebug）并且看到创建的表中没有ID或类（交替行除外），所以我没有看到访问该元素的方法。我想使用jQuery并在行上调用.addClass（）和.removeClass（）方法，但我不太清楚如何访问它们。在这一点上，我会采取任何解决方案......所以，这是可能的吗？

提前感谢您的帮助！

Answer 1

我最终使用.ClientTemplate（）将一个隐藏元素添加到隐藏元素，然后通过查找行的parent（）。parent（）来找到它所属的行。

Grid Razor：

@(Html.Telerik().Grid<Multimedia.Web.Models.GroupModel>()
    .Name("group-grid")
    .DataBinding(dataBinding => dataBinding.Ajax().Select("_GroupGridAjaxBinding", "TelerikControls"))

    .Columns(columns =>
    {
        columns.Bound(o => o.GroupNumber).Width("30%");
        columns.Bound(o => o.GroupName).Width("80%").Title("Name");
        columns.Bound(o => o.GroupNumber).Hidden(true).ClientTemplate("<div id='group-row-<#= GroupNumber#>'></div>"); //i will find this <td> by the <div> id
    })

   .Scrollable(scrolling => scrolling.Enabled(true))
   .Sortable(sorting => sorting.Enabled(true))
   .Pageable(paging => paging.Enabled(false))
   .Filterable(filtering => filtering.Enabled(false))
   .Groupable(grouping => grouping.Enabled(false))
   .Footer(false)
)

然后，在我的JavaScript中，我能够使用以下jQuery访问表行：

var groupNum = getGroupNumSomehow();
$('#group-row-' + groupNum).parent().parent().addClass('highlight');

它有效！

Answer 2

您可以始终使用客户端行模板，并在发生这些外部操作时重新绑定网格。这是Telerik在执行ajax绑定时使用的客户端行模板的示例：

<%= Html.Telerik().Grid<Customer>()
   .Name("Grid")
   .DataBinding(dataBinding => dataBinding.Ajax().Select("Action", "Controller"))
   .Columns(columns =>
   {
       columns.Bound(c => c.CustomerID);
       columns.Bound(c => c.ContactName);
       columns.Bound(c => c.Country);
   })
   .ClientRowTemplate(grid => "<ul>" +
           "<li>CustomerID: <#= CustomerID #></li>" +
           "<li>Contact Name: <#= ContactName #></li>" +
           "<li>Country: <#= Country #></li>" +
        "</ul>" 
   )
%>

这可能允许您将信息注入可用于突出显示的每一行。

有关Telerik's site的更多相关文档。

在Telerik MVC Grid中设置单行样式 - 客户端

2 个答案: