telerik-grid onRowSelect如何获取id?

时间:2010-12-10 12:56:32

标签: asp.net-mvc telerik-grid

您好我是asp.net mvc和telerik控件的新手。当我点击行时,我怎么能得到o.Id值?

 <%= Html.Telerik().Grid(Model)                    
                    .Name("RolesGrid")
                    .DataKeys(keys => keys.Add(o => o.Id))                               
                    .Selectable()                    
                    .Columns(columns =>
                    {
                        columns.Bound(o => o.Name);
                        columns.Bound(o => o.Description);

                    })
                    .Pageable()                       
                    .ClientEvents(events => events                    
                    .OnRowSelect("onRowSelect"))

             %>

在js代码中:

 function onRowSelect(e)   {
        var ordersGrid = $('#RolesGrid').data('tGrid');  
        var row = e.row;
        var dataItem = ordersGrid.dataItem(row);
        alert(dataItem);
    }

但是dataItem为null,并且生成的html文件中没有id值。谢谢,抱歉我的英文不好

4 个答案:

答案 0 :(得分:12)

所以我毕竟获得身份证的最佳方式是:

  1. 将onRowSelect函数绑定到网格
  2. 在onRowSelect中编写下一个代码

    var dataItem = jQuery('#MyGridId').data('tGrid').dataItem(e.row);     
    alert(dataItem['Id']);
    

    dataItem是一个具有网格模型所有属性的地图,因此您可以得到所有想要的内容

  3. 多数,谢谢

答案 1 :(得分:10)

来自telerik grid demo

您必须将Telerik网格中的Id作为隐藏列。

// ...
.DataKeys(keys => keys.Add(o => o.Id))                               
.Selectable()
.Columns(columns =>
    {
        columns.Bound(o => o.Id).Hidden();
        columns.Bound(o => o.Name);
        columns.Bound(o => o.Description);
    })
// ...
.ClientEvents(events => events.OnRowSelect("onRowSelect"))

它将呈现

<td style="display: none; ...">...</td>

然后你就这样得到它:

function onRowSelect(e)   {
    var id = e.row.cells[0].innerHTML;
    // ...
}

注意:

  • 我知道,这太丑了。
  • 我不知道为什么如果没有记录的方法来获取定义的键值,telerik会强制您调用.DataKeys(...)方法。
  • 如果使用分组或其他功能,则会变得更加棘手,因为隐藏的列位置会因分组排列而异。

答案 2 :(得分:1)

我发现了一种稍微优雅的方法来借鉴mmutilva的答案。

首先以相同的方式放入隐藏列和更改事件:

.DataKeys(keys => keys.Add(o => o.Id))                               
.Selectable()
.Columns(columns =>
    {
        columns.Bound(o => o.Id).Hidden();
        columns.Bound(o => o.Name);
        columns.Bound(o => o.Description);
    })
.ClientEvents(events => events.OnRowSelect("onRowSelect"))

但是在javascript函数中,有一种更好的方法来实际选择对象然后隐藏的行:

    function onRowSelect(e)   {
        var grid = e.sender;
        var currentitem = grid.dataItem(this.select());
        var Id = currentitem.Id;
        //then do whatever with the ID variable
    }

Source

答案 3 :(得分:0)

将onRowSelect上的函数更改为:

function onRowSelect(sender, args){...}

发件人将成为网格,您可以通过args确定选择了哪个项目。

查看Telerik帮助网站,了解有关如何使用客户端API获取数据的详细信息: http://www.telerik.com/help