Fixed row height on grid.
Do not modify the row height of the displayed grid.
When you modify the contents of a cell, the height of the rows in the columns that are fixed and those that are not fixed is different.
I hope the row height of the grid remains the same when modifying cells.
Please solve the problem.
Hi TaeWook,
Greetings from Syncfusion support.
Query : Frozen Column Row Height
Based on your query, we understand that you are experiencing an issue with the frozen columns feature and row height property while performing an edit action. We would like to inform you that this is the expected behavior. When you perform an edit action, the form is rendered based on the default row height, which may cause a variation in the row height. However, once the data is updated, it will revert to the defined row height.
Regards,
Vinitha Balasubramanian
Will that solve this problem later?
Is there a way to increase the height of the fixed column when modifying the cell?
TaeWook,
Before proceeding with your query, could you please provide us with the following details:
There is a grid fixed with the 'frozen column'.
The grid also has a row height of 20 fixed.
When modifying a cell, the selected cell appears to be greatly expanded.
I hope that the row height of the fixed column also looks extended when the cell is in modified mode.
Hi TaeWook,
Query: FrozenColumn Row Height.
We have thoroughly reviewed your requirement and achieved your requirement by using rowSelected event and conditionally changing the height of the row which is in edit state. We have prepared a code snippet that will help you achieve your requirement. You can find the code snippet and the sample link below.
[index.js]
function rowSelected(args) { if ((args.previousRowIndex == undefined || args.rowIndex == args.previousRowIndex) && grid.isEdit) { for (let i=0; i<grid.getSelectedRows().length;i++) { grid.getSelectedRows()[i].style.height = 34 + 'px'; } } else { for (let i=0; i<grid.element.querySelectorAll('.e-row').length;i++) { grid.element.querySelectorAll('.e-row')[i].style.height = 20 + 'px'; } } } |
Sample: https://stackblitz.com/edit/ulntyz-innrcm?file=index.js
Please let us know if you have any further queries. We are always here to help.
Regards,
Santhosh I