单击编辑按钮时,Kendoui Grid 获取选定的行 ID

Posted

技术标签:

【中文标题】单击编辑按钮时,Kendoui Grid 获取选定的行 ID【英文标题】:Kendoui Grid Get Selected Row Id when Edit Button is clicked 【发布时间】:2015-10-15 14:28:24 【问题描述】:

我有一个简单的网格,当使用 JQuery 单击编辑按钮时,我在收集 PersonID 时遇到了很多麻烦。我需要 PersonID,因为我要将文件上传添加到内联编辑列,并且我想上传文件并将其与 PersonID 相关联。欢迎大家帮忙:)

@(html.Kendo().Grid<GridCustomPopupTemplate.Models.Person>().Name("Grid")
.DataSource(dataSource => dataSource
    .Ajax()
    .Model(model => model.Id(m => m.PersonID))
        .Read(read => read.Action("GetPersons", "Home"))
        .Update(up => up.Action("UpdatePerson", "Home"))
)

.Columns(columns =>

    columns.Bound(c => c.PersonID).Width(200);
    columns.Bound(c => c.Name);
    columns.Command(cmd => cmd.Edit());
)

.Pageable()
.Sortable()
.Editable(ed => ed.Mode(GridEditMode.InLine))
.Events(ev => ev.Edit("doOnRowSelect"))  
)



<script type="text/javascript">

function doOnRowSelect(e) 

     alert(The #PersonID# of the row which we are going to edit here....)



</script>

【问题讨论】:

【参考方案1】:

我通过使用以下 JavaScript 来完成这项工作:

$("body").on("click", "[role='row']", function (e) 

    var grid = $("#Grid").getKendoGrid();
    var item = grid.dataItem($(e.target).closest("tr"));
    alert(item.PersonID);

);

【讨论】:

【参考方案2】:

在选定的网格行上使用grid.dataitem

var grid = $('#grdMyGrid').data('kendoGrid');
var selectedItem = grid.dataItem(grid.select());

使用 OnChange(e) 处理程序更新。

.OnChange(e=&gt;e.OnChange("grdOnChange")) 中,您可以存储和访问该项目。我确信网格更改将触发另一行中的编辑按钮被选中。

var selectedIndex=0;
function grdOnChange(e) 
   var selectedDataItem = e != null ? e.sender.dataItem(e.sender.select()) : null;

selectedIndex=selectedDataItem.MyModelID;

【讨论】:

这不起作用。该错误表示它无法获取未定义或空引用的属性“值”。然后如果我将以下行添加到网格中 .Selectable() 结果是 selectedItem 为 null :( 如果我将网格更改为 .Events(ev => ev.Edit("doOnRowSelect")) 并单击行(但不是编辑按钮),我可以获得 PersonId。但是我需要在单击编辑按钮时检索 id。感谢收看。

以上是关于单击编辑按钮时,Kendoui Grid 获取选定的行 ID的主要内容,如果未能解决你的问题,请参考以下文章

如何在 KendoUI Tabstrip 中访问 KendoUI Grid 选定行哈希模板(KendoUI)值

如何在使用 ODATA 类型的 KendoUI Grid 更新数据之前要求确认?

Kendo UI:在按钮单击时获取文本框值

如何在 Kendo Grid + Angular 4 中以编程方式设置选定行?

如何在 MVVM-WPF 中获取所选项目

KendoUI Grid 绑定单击双击事件