Grid Column Resizing when all columns have width set.

[Michael]

I have set all the columns widths in a grid, when I resize one of the columns it seems to resize  the adjacent columns as well. 

When I don't set the column width on the last column it works as expected.
Here is a jsfilddle that has the behavior.
http://jsfiddle.net/mmowery/xpZHN/22/

I have tried to things like changing the scrollable, etc.

Hopefully, I am just missing something obvious.

Thanks in advance,
Michael

[Dimo]

Hello Michael,

The current column configuration is invalid, because the sum of all column widths is smaller than the Grid width. This makes the browser ignore the set widths and expand all columns. However, this breaks the resizing mechanism.

Pixel widths set to all columns should be used only if you want a horizontal scrollbar in the Grid. In your case, please leave at least one column with no width. If you need a resizable Grid in a variable width layout, you can set a min-width style for the component or the <table>.

Greetings,
Dimo
the Telerik team

[Michael]

Dimo,
  Thanks for the reply.  That makes sense and is what I ended up doing.
Thanks,
Michael

[Ray]

When I make a list page, I want to make it possible for the user to drag the column with the total number and save the location of the column, which is now in effect immediately, and next time I come in, the order of the column is still valid. The above is the order I changed.

The final record saved in the database is the one shown above.

Once on this page again, I get the data, as shown in the figure above.

See your example, it is written in this way, but it will never achieve the effect I want!!!

[Why do you just use ID to record its order instead of columne name here? There are many problems with id, for example, I have to drag multiple columns at the same time. Does the order of columns in the back affect the order in the front? It would be better to use column name + order index here.

This is my final effect, but not my order!!!

How can I achieve this effect?

[Konstantin Dikov]

Hi Ray,

Could you please share the example that you are mentioning, where we are suggesting the approach in question? Note that if you need to persist the columns order and restore it on the next page load, you should use the "getOptions/setOptions" methods as shown in the following online demo:

• https://demos.telerik.com/kendo-ui/grid/persist-state

If the requirement is to store the state on each column reorder, you could handle the "columnReorder" event of the Grid and within "setTimeout" function, retrieve the new options:

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

Hope this helps.


Regards,
Konstantin Dikov
Progress Telerik