Cannot get and manipulate with internal kendoGrid instance

[Vladyslav]

I've created a grid and customized it very much.

I'm using grouping data by default and have created a very specific group header (see code below).

01.kendoGrid = new kendo.ui.Grid(selector, {
02.    dataSource: getDataSource(),
03.    columns: [
04.    ...
05.        {
06.            field: column.field,
07.            hidden: true,
08.            aggregates: ['count'],
09.            groupHeaderTemplate: '#= createGroupRow("' + column.field + '", value) #'
10.        },
11.    ...
12.    ],
13.    ...
14.});

And createGroupRow function:

01.function createGroupRow(field, value) {
02.    ...
03.    var html = host.document.createElement('div');
04.    groups[value].gridObject = new kendo.ui.Grid($(html), {
05.        dataSource: [localData],
06.        columns: columnService.CreateInnerColumns(),
07.        scrollable: false
08.    });
09.
10.    return $(html).html(); // or html.outerHTML
11.}

'host' is the current 'window' object.

Rendering is finishing successful and everything seems to be fine... until I try to get this internal grid object.

When I change groups[value].gridObject, nothing happens, absolutely. I try to change to properties, dataSource... rendered grid doesn't want to change. Internally I can see that object actually changed, but nothing happens on the UI.

Also when I try to get object via:

1.$('div').data('kendoGrid')

BEFORE rendering (before calling "return $(html).html()") and it works fine, but AFTER that I always get 'undefined' object.

It seems that kendoGrid is creating in the another scope or something like that, and then I cannot get access to that.

I will really appreciate if ​anyone can help me with that. I just need to create grids in the all group objects and then be able to get this grids and manipulate with it.

Thank you.

[Nikolay Rusev]

Hello Vladyslav,

 

What this template does is to render the html `return $(html).html()` in the group header. However when you call jQuery html() it will not preserve the reference to the JavaScript object in the data attributes. Thus you will not be able to get reference to the Grid anymore.

 

Here is an example demonstrating what essentially happens - http://dojo.telerik.com/@rusev/OhoBa

 

Unfortunately it is not clear why you create Grid widgets on the fly for group headers and I'm not able to suggest you how to implement the scenario.

 

Regards,
Nikolay Rusev
Telerik

 

 

[Vladyslav]

Hi Nikolay,

Thank you for reply!

As I described in the parallel thread, I need to build group totals in the group header elements (footer template isn't suitable due to client's want). So I resolved this problem as I described in my previous post here.
Is there any change to overcome this behavior and actually get normal grid instance? Maybe do manual reference to JS object in the attributes?

 

Regards,
Vladyslav Ushakov

[Nikolay Rusev]

Hello Vladyslav,

 

It is yet not clear to me why you are adding Grid into groupHeaderTemplate if you only need to show aggregates. The groupHeaderTemplate documentation shows how to add aggregates to it.

 

Am I missing something?

 

Regards,
Nikolay Rusev
Telerik

 

 

[Vladyslav]

Nicolay,

When you use GroupFooter​Template, you can set up pattern for every column in the grid (like in the your example about aggregations). I need actually the same structure (for every column), but in the group header. That's it.

After reading posts here, I understood that Group Header is designed as single ​cell, so it's impossible to set up group header template for every column.

But for me it was very crucial display values in the group headers, so I solved this problem by writing custom group header function, which is building another grid "on the fly". I didn't realize that I would have such problems after.

If you may suggest ​another solution for displaying group header this way I need, I will really appreciate it.

And yeah, of course, I didn't need build grid with one row every time I build group header, but from my side it was the easiest solution. Or you recommend to use just specific template (with simplest table) and fill it with correct data (without inner kendoGrid)?

 

Really appreciate for answers,
Vladyslav Ushakov

[Nikolay Rusev]

Hello Vladyslav,

 

Indeed group header is rendered as one cell with its content in paragraph. However you could implement the template in following manner - http://dojo.telerik.com/@rusev/eWURe. In this case you will have to adjust the first cell colspan.

 

Regards,
Nikolay Rusev
Telerik