We are dealing with grid resize column,
Is there a way to set maximum width? and also is there a way to resize just 1 column only affecting neighboring column (horizontal scroll disabled)
Also I would like to customize reordering animation.
4 Answers, 1 is accepted
Hi Ivan,
Thank you for the provided screenshot.
From the provided information it seems that the requirements aren't possible to be achieved with the current built-in functionality of the Grid. Let me provide a bit more details so that we can clarify the requirement.
We aren't sure what you mean with the following sentence:
"and also is there a way to resize just 1 column only affecting neighboring column (horizontal scroll disabled)"
Could I ask you to provide a bit more details about the specific use-case scenario that will help us to better understand it. Thank you.
Judging by the provided screenshot it, it seems that the Grid content overflows which is indeed undesired. However, by default that shouldn't happen as if the total width of all columns is more than the actual width of the Grid, then a horizontal scrollbar appears which allows the user to scroll to the columns which aren't currently visible. Please check the following article demonstrating all scenarios when it comes to configuring the column widths:
https://www.telerik.com/kendo-angular-ui/components/grid/columns/width/
About the desired maximum width feature, it isn't currently supported. However, we have currently a feature request that can be voted for at the following link:
Once the feature requests gathers a significant amount of votes we can proceed with adding it to our future development plans.
About the reordering animation, there isn't an option that allows to customize it at the moment. Please feel free to log a new feature request about it in our public Feedback Portal or let me know if it is required that I do this on your behalf. Thank you.
To sum up, I understand that this may be disappointing but it seems that the required features aren't currently available. Thus at this point we can track their demand and eventually add them to our future development plans. Feel free to write back with some more details in case we couldn't understand the requirement properly. Thank you.
Regards,
Svetlin
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.
https://primefaces.org/primeng/showcase/#/table/colresize
Check out the first example "fit mode" vs "expand mode"
Where you only change size of 1 column only, Is that possible?
Any way to handle an event while resizing is being done?
About reordering... Can we append column drag element to header instead of body?
Hi Ivan,
I will provide answers to each question separately. But in the future please open separate threads for questions that aren't related to each other. Thank you in advance. That will help us to keep a clean history of the forum and provide a better support service in general.
About the columns resizing, the Grid behaves like a regular HTML table element. If the widths of all columns are set and their total width is greater than the total Grid width then a horizontal scrollbar will appear. If the total width of the columns is less than the actual width of the Grid then there will be added white space to the end of the Grid to fill in the extra space left. Please check that behavior in the following example which resembles the referenced behavior:
https://stackblitz.com/edit/angular-lq858o?file=app/app.component.ts
Any way to handle an event while resizing is being done?
I am afraid that we will need some more details on this matter in order to get a better understanding of the use - case scenario. In general the Grid will emit any event whenever it is triggered. But if the user is resizing a column it wouldn't be possible for the user to trigger another event until the resizing is over.
About reordering... Can we append column drag element to header instead of body?
In theory that would be possible by using some custom JavaScript in order to modify the DOM on (columnReorder) event of the Grid. However, that doesn't seem to be a good option as the (columnReorder) event is fired multiple times while dragging and the generated DOM would have to be updated each time which may lead to some undesired blinking or performance issues. Indeed such functionality isn't a built-in feature of the Grid and implementing it would be in the hands of the developer.
In case further information or assistance is required for any of the questions please open a separate private thread where we can discuss the options. Thank you.
Regards,
Svetlin
Progress Telerik
Our thoughts here at Progress are with those affected by the outbreak.