Autosized width overflows parent div in bootstrap 3. #534
Comments
|
I'm not sure how you got that to work by doing that hack you're doing because it really is defined as a number because it's all calculated in pixel and in the code it then adds if (fixedGridDimensions?.width && gridParentContainerElm?.style) {
gridParentContainerElm.style.width = `${fixedGridDimensions.width}px`;
}The only thing that I could see as maybe possible is to make it a string or number and if it's a string then leave it as it is but if it's a number then add the if (fixedGridDimensions?.width && gridParentContainerElm?.style) {
gridParentContainerElm.style.width = typeof fixedGridDimensions.width === 'string' ? fixedGridDimensions.width : `${fixedGridDimensions.width}px`;
}So I'm surprised your code (hack) actually works, I can only assume that it's probably skipping the |
- fixes Aurelia-Slickgrid issue [#534](ghiscoding/aurelia-slickgrid#534)
* fix(resizer): allow gridHeight/gridWidth to be passed as string - fixes Aurelia-Slickgrid issue [#534](ghiscoding/aurelia-slickgrid#534)
|
After looking at the code, I have no idea how this is working either! I've included the generated HTML below. I removed the actual data rows, but the column headers are there. I don't know if this helps track things down, but it looks like it's simply passing the 100% through. Not sure how that is happening given the code in the resizer though. I'll try stepping into it with a debugger if I get a chance. Regardless, thank you for the change! Do you know when it might be available on npm? Ask an inch, take a mile? :) Thank you for this control, it's really awesome, and I appreciate all the work you put into it! |
|
Hi there, you'll be able to pass a string and if that is the case the Resizer Service won't change it, so passing |
|
closed by PR #284 This is now live with a few other things, see the new version Release 3.5.0 Cheers ⭐ |
|
So I actually just tried setting the |
|
Setting the height to e.g. 100vh could work. I guess your container and or body,HTML dont have height:100% set so the grid doesnt know what the max could be |
|
the thing is that I always enable the auto-resize (with Resizer Service) so I'm not sure if it conflict with that but I can try. I know setting I just tried it and |
|
Yeah thats what i meant, so from your grid all the Containers up to body and html need to have 100% height. The 100vh was just meant as example that applying fixed dimensions with viewport height work, so percentages should work as well if the containers allow for growth. Oh and plus the display property could also matter |
|
I think the
BTW, and slightly related to this, I'm currently working (and soon wrapping it up) on an opt-in resize column by their cell content (asked by the business on our side). The POC is done and working, mainly the unit tests left to write (painful part lol). Slickgrid-Universal PR #309. It's opt-in because it does loop through the dataset (first thousand rows) to calculate widths, so it takes CPU cycle hence the opt-in. The business have grids with so many columns sometime, it's crazy lol |
|
Hey guys, latest release is out and the main feature is what I wrote earlier about, the "Resize Columns by Their Content". |
I'm submitting a Bug report
Your Environment
Context
I'm upgrading from 2.X to 3.X. Previously we set the grid-width="100%" however this has been moved to the gridOptions in Javascript. We are using Typescript and the typings for this property requires it to be a number. If we leave it unset, the automatic sizing of the grid makes it too wide and it overflows outside of the col-sm-12 container div. We are using Bootstrap 3.
If, we update the grid width like this: (this.gridOpts as any).gridWidth = "100%" then it works perfectly and the grid fits within its container's bounds.
Expected Behavior
The grid shouldn't overflow the boundaries of its containing div.
Current Behavior
The grid overflows the with of its container.
Possible Solution
Either it should calculate the proper width based on the size and position of the container, or the typings should be updated to support strings for the width, or an additional parameter for the width units should be added.
Code Sample
The text was updated successfully, but these errors were encountered: