Kendo UI Grid 按数据项选择 [英] Kendo UI Grid select by data item

问题描述

我有一个包含大型数据源和分页的 Kendo UI 网格.

I have a Kendo UI Grid with a large datasource and paging.

我有一个事件会在我知道要选择的基础数据项的地方触发，但不确定如何以编程方式在网格中分页/选择该项目.如果item不在当前网格页面上，当数据不在当前页面上时，我无法使用datasource.view()来戳穿.

I have an event that fires where I know the underlying data item that I want to select, but am unsure on how to programatically page/select this item in the grid. If the item is not on the current grid page, I cannot use datasource.view() to poke through when the data is not on the current page.

有谁知道我如何通过底层数据源对象选择一个项目?

Does anyone know how I can select an item by its underlying data source object?

我遇到了与@@ 类似的情况:http://jsfiddle.net/Sbb5Z/1050/我可以通过以下方式获取数据项:

I've got a similar situation to where i am at @: http://jsfiddle.net/Sbb5Z/1050/ I can get the data item with the following:

 change: function (e) {
      var selectedRows = this.select();
      var dataItem = this.dataItem(selectedRows[0]);
   }

但是我不知道如何在另一个网格中选择同一行.

But then I don't know how to select the same row in the other grid.

基本上在一个grid的select事件中，我想去另一个grid中选择同一个item.这些不是同一个数据源，因为它们有不同的页面设置，但它们是相同的底层数据数组.

Basically in the select event of one grid, I want to go select the same item in another grid. These are not the same datasource, as they have different page setups, but it is the same underlying data array.

我在目标网格中有数据项 -- 但我不知道如何在目标网格中分页/选择它.

I have the data item in the target grid -- but I have no clue how to page/select it in the target grid.

到目前为止，我想出的最好的方法是创建一个与原始数据源具有相同参数的数据源，并以编程方式对其进行分页，直到找到我要查找的内容.肯定有更好的方法吗?

The best I've come up with sofar is creating a datasource with the same parameters as the original, and paging through it programatically, until I find what I am looking for. Surely there must be a better way?

推荐答案

我从 Telerik 拿回了这个，并且更干净了:

I've gotten this back from Telerik, and is a little cleaner:

http://jsfiddle.net/RZwQ2/

function findDataItem(theGrid, dataItem) {
//get grid datasource
var ds = theGrid.dataSource;

var view = kendo.data.Query.process(ds.data(), {
                filter: ds.filter(),
                sort: ds.sort()
            })
            .data;

var index = -1;
// find the index of the matching dataItem
for (var x = 0; x < view.length; x++) {
    if (view[x].Id == dataItem.Id) {
        index = x;
        break;
    }
}

if (index === -1) {
    return;
}

var page = Math.floor(index / theGrid.dataSource.pageSize());    
var targetIndex = index - (page * theGrid.dataSource.pageSize()) + 1;    
//page is 1-based index    
theGrid.dataSource.page(++page);
//grid wants a html element. tr:eq(x) by itself searches in the first grid!    
var row = $("#grid2").find("tr:eq(" + targetIndex + ")");
theGrid.select(row);

console.log('Found it at Page: ' + page + 'index: ' + targetIndex);

}

这篇关于Kendo UI Grid 按数据项选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！