Why do my koGrid columns go super wide when trying to make it narrower, then you can't drag it back

Question

I am posting this in hopes that someone else will be helped.

I have a koGrid (using version 2.1.1) with about 25 columns. I have both width and minWidth set on the columns. When the grid comes up it displays ok but sometimes I want to adjust the column sizes. When I adjust the sizes the columns widths sometimes go crazy wide and you can't put them back.

Answer 1

I looked for hours for a solution and finally figured this out. When you change the width of a column up or down and the size hits the "minWidth" or "maxWidth" threshold, the javascript code that calculates the width can switch to string concatenation.

As a result, if you have a column with a minWidth of 30, when you hit that point, the width gets set to the string "30". When the column sizes are then recalculated, and that column is hit, the math will start to concatenate rather than summing up.

To fix this issue, you need to modify the koGrid source file. In the debug file, search for the window.kg.Column function. About 13 lines into the method, you will find the following two lines:

self.minWidth = !colDef.minWidth ? 50 : colDef.minWidth;
self.maxWidth = !colDef.maxWidth ? 9000 : colDef.maxWidth;

change the code so it converts the min and max widths to integers as follows:

self.minWidth = !colDef.minWidth ? 50 : parseInt(colDef.minWidth, 10);
self.maxWidth = !colDef.maxWidth ? 9000 : parseInt(colDef.maxWidth, 10);

This fixed it for me and my testing did not show any side effects. I hope this helps someone else. Maybe someone will incorporate the fixes into the koGrid code base soon.