2

In angular slickgrid, I am trying to implement force fit column & auto resize column feature with two button click. When I click force fit button, the column of slickgrid fit into the window size. And when I click the auto resize button, disable the force fit and resize the column based on cell content. For this requirement I have implemented following code (snippet). I have checked the same in angular slickgrid demo page, this issue occurred in the page. Kindly suggest the way to fix this issue.

Code Snippet:

public gridOptions: GridOption = {
    gridMenu: {
        hideForceFitButton:true // To hide the force fit checkbox in grid menu
    }
}

onForceFitColumnClick() {
    this.angularGridInstance.slickGrid.setOptions({ forceFitColumns: true })
}

onAutoResizeColumnClick() {
    if (this.angularGridInstance.slickGrid.getOptions()['forceFitColumns']) {
        this.angularGridInstance.slickGrid.setOptions({ forceFitColumns: false })
    }
    this.angularGridInstance.resizerService.resizeColumnsByCellContent(true);
}

Existing Behavior in angular slickgrid demo

Current behavior

1. Click the force fit column button, All slickgrid column are fit into the window

2. Click the auto resize column button, the slickgrid column not resized based on cell content

Expected behavior

1. Click the force fit column button, All slickgrid column are fit into the window

2. Click the auto resize column button, the slickgrid column should resized based on cell content

Step to reproduce my case in angular slickgrid library

  1. Open the shared URL : https://ghiscoding.github.io/Angular-Slickgrid/#/resize-by-content
  2. Resize any column of slickgrid by dragging end of column to check the auto resize feature.
  3. Now click the "Resize by Cell Content" button. Now the resize by cell content working fine.
  4. Now click the grid menu and check the force fit column, and again open grid menu and uncheck the force fit column. Now the force fit column disable.
  5. Now click the "Resize by Cell Content" button. Now the resize by cell content will not work as expect.

Software Version

  • Angular : 13.3.9

  • Angular-Slickgrid : 4.3.1

  • TypeScript : 4.6.4

  • Operating System : Windows 11

  • Node : 14.18.3

  • NPM : 6.14.15

Janisasri Sathasivam
  • 43
  • 3
  • I think you misunderstand the concept, Force Fit Column will always force the fit in the current viewport and **cannot** be used with Resize by Content. You have to choose if you want to use Force Fit **or** Resize by Content, they cannot work together and never will – ghiscoding Apr 06 '23 at 13:28
  • I know both don't work together. But I have disabled force fit before auto resize process. Then it should be work as expected. – Janisasri Sathasivam Apr 06 '23 at 16:03
  • you can hide the Force Fit from the Grid Menu and that's fine, **but** you shouldn't play with the `forceFitColumns` boolean because this conflicts with the Resize by Content and I'm not surprised at all that you have these issues. When you're using `slickGrid.setOptions()` directly, you're bypassing Angular-Slickgrid/Slickgrid-Universal code implementation and that's the probably the cause of the issue and I will not fix that issue. The idea is to set proper flag in grid option and then resize at any time, you can also resize by column header menu or simply double-click between 2 columns – ghiscoding Apr 06 '23 at 19:04
  • and you should follow the same grid options as shown in the example: https://github.com/ghiscoding/Angular-Slickgrid/blob/0454d95ccc7b760224e4c806c538fc9229e6fd15/src/app/examples/grid-resize-by-content.component.ts#L312-L318 – ghiscoding Apr 06 '23 at 19:04
  • I have checked the same in angular slickgrid demo site. I have updated the steps to reproduce the issue in slickgrid demo page. – Janisasri Sathasivam Apr 11 '23 at 17:05

0 Answers0