Kendo grid MVVM not functioning properly [Collapse , rendering row]

[Neeraj]

Hello,
              I have created sample problem in I have used row
  Following :

1) The DataSource is grouped by  PricingPCC Column which collapse. 
2) And want to increase Segment Column tried hardcoded 150-300px that work either.
3) Mismatch in width of table header and row data Row data render below column header properly

[Neeraj]

I found the solution to for # row and column header were not aligned. It was due that grouping header took extra <td> tag, so added 1 extra in my row template.

 Please reply  Grouping column  collapse row.

[Stefan]

Hello, Neeraj,

I'm glad to hear that the issue is resolved.

The grouping the can be done initially via the group property of the dataSource, and the rows can be collapsed using the collapseGroup method of the Grid on the dataBound event:

https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/methods/collapsegroup

https://docs.telerik.com/kendo-ui/api/javascript/data/datasource#configuration-group

https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/events/databound

I made an MVVM example demonstrating this:

https://dojo.telerik.com/OMEKOB

I hope this is helpful.

Regards,
Stefan
Progress Telerik

[Neeraj]

Hello thanks for  I have used collapse Group method mentioned in my sample  The new link is  grid collapse  not working

[Stefan]

Hello, Neeraj,

Could you please advise which link is not working as all of them a working on my end?

I will be expecting the details and assist further.

Regards,
Stefan
Progress Telerik

[Neeraj]

Hello, try this   I am also attaching video file in .zip to show the problem in my side. Open.htm file to run ( in-video description: On click of arrow in grouping the row  collapse )

[Georgi]

Hello Neeraj,

Thank you for the provided video.

The described behavior is expected since rowTemplate is used and within the template no k-group-cell is defined.

e.g.

#= new Array($("\#TSTGrid").data('kendoGrid').dataSource.group().length + 1).join('<td class="k-group-cell"></td>') #

I have modified the sample from the video and now collapsing and expanding groups works as expected:

• https://dojo.telerik.com/iBEXa/11

Regards,
Georgi
Progress Telerik