This is a migrated thread and some comments may be shown as answers.

Grid column sizing issues since Chrome 65 release

3 Answers 157 Views
Grid
This is a migrated thread and some comments may be shown as answers.
AR
Top achievements
Rank 1
AR asked on 20 Mar 2018, 04:52 PM

Kendo grids in our application are not sizing optimally with Chrome 65.  Our grid columns still size efficiently and as expected in Chrome 64, and the latest of Firefox, IE 11, and Edge. 

Attachment 1 shows one of our grids, rendered in Chrome 65.  Here you can see that the columns which would normally be wider, to accommodate wider text, are too thin, and columns which do not have a lot of text are too wide.

Attachment 2 shows the same grid as rendered in Firefox.  (Also renders this way in Chrome 64, IE 11 and Edge)

Attachment 3 shows that a forced redraw of the grid columns, by executing the following code, corrects the column sizing issues.  Perhaps Chrome has become faster, and exposed a timing issue around column width calculations after options.success is called following a transport.read?

                                                //The following is executed after the return of data from an external query made in
                                                //kendo.data.DataSource.transport.read
                                                //Attachment 1 is from just prior to this code's execution.
                                                //Attachment 2 is from after showColumn(3) is execcuted
                                                window.setTimeout(angular.bind(this,
                                                    () => {
                                                        $("#ehGrid").data("kendoGrid").hideColumn(3);
                                                        window.setTimeout(angular.bind(this,
                                                                () => {
                                                                    $("#ehGrid").data("kendoGrid").showColumn(3);
                                                                }),
                                                            100);
                                                        }),
                                                    300);

This issue is occurring in multiple grids in our app, so having to put this workaround into all our transport.read definitions is not a great solution for us.  Do you have any other suggestions or a fix? 

Kendo 2017.1.223, Angular v1.6.5, Typescript

3 Answers, 1 is accepted

Sort by
0
AR
Top achievements
Rank 1
answered on 20 Mar 2018, 04:57 PM

Apologies, I uploaded the attachments in the wrong order (2 & 3 are swapped):

Attachment 1 = GridColumnSizingBroken_Chrome65.png
Attachment 3 = GridColumnSizingWorkedAround_Chrome65.png
Attachment 2 = GridColumnSizingNormal_Chrome64_Firefox_IE_Edge.png

0
AR
Top achievements
Rank 1
answered on 20 Mar 2018, 04:59 PM

Apologies, I swapped Attachment 2 and 3 when uploading:

Attachment 1 is GridColumnSizingBroken_Chrome65.png
Attachment 3 is GridColumnSizingWorkedAround_Chrome65.png
Attachment 2 is GridColumnSizingNormal_Chrome64_Firefox_IE_Edge.png

0
Stefan
Telerik team
answered on 22 Mar 2018, 08:06 AM
Hello, Alice,

Thank you for the provided screenshots.

I made difference example and the issue was not observed on my end. My Chrome version is 65 as advised.

Could you please share an example where the issue could be observed as I can assume that there is a small detail which we are currently missing.

Thank you in advance for the cooperation.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Grid
Asked by
AR
Top achievements
Rank 1
Answers by
AR
Top achievements
Rank 1
Stefan
Telerik team
Share this question
or