optikalefx / OpenJS-Grid

OpenJS Grid is the easiest jQuery Grid ever. With very little work you can have a data grid that can do everything from sorting and searching to complex database queries. Best of all, its open source. So you can learn how it's all done.
http://square-bracket.com/openjs
MIT License
96 stars 46 forks source link

Auto Column Sizes Broken #7

Closed kooliokey closed 11 years ago

kooliokey commented 11 years ago

I have a grid that I want the column widths to be automatically created to fill the table's width, which it is not currently doing when the table is initially generated. This is what the table looks like on page load: vc_2

If I click or drag on a column AFTER the table is initially loaded then it does fill it out correctly: vc_3

The issue still exists if defining the width of one or two of the columns. I've customized the CSS for the grid, but I wouldn't think the problem would be in there.

I briefly looked at the JS code to try to find where the issue might be, but didn't see anything obvious.

I have been able to test this in Chrome and Safari on Mac OS 10.8.2.

optikalefx commented 11 years ago

so you have a default installation with no custom widths, and its not stretching to fit the container?

kooliokey commented 11 years ago

I've made a few changes to the PHP class, changed the page count in the grid.js (From my other open issue) and use my own CSS stylesheet to match my app.

I wouldn't think any of my changes would have affected it, but I could be wrong. Let me know if theres any code snippets you need to see to be of help.

optikalefx commented 11 years ago

Sure Ill check this out asap. Thanks!

kooliokey commented 11 years ago

Okay. It seems like your code is fine. The page that I use the table on also has tabs that show/hide divs. The grid is inside one of those divs and it works fine if I move it outside that div on the same page, or to another page. Something about that div or tab script is interfering, but I don't know what.

What is a little odd is that it works fine after resizing a column.

optikalefx commented 11 years ago

must be something messing it up initially, and then my equalize function is setting up right

kooliokey commented 11 years ago

Maybe, I even tried calling the equalize function in grid.js after the _afterLoad() and before triggering loadComplete and it didn't fix it.

kooliokey commented 11 years ago

Sorry for assaulting you with comments...but...I think the problem is how the grid responds when it is hidden. The tabs use display:none on all the tabs except the one that is open on page load. If I put the grid in a tab that is hidden at first, it doesn't size correctly. If I put it outside of the tabs completely or in the tab that is shown on page load it sizes perfectly.

I don't know if that counts as a bug in the code for the grid or the tabs or if its just a nagging technicality of working with display:none. Maybe there is a way the grid's code could be altered to compensate for it?

optikalefx commented 11 years ago

So that makes sense in a way. If the grid is hidden, elements don't have width or height. The way to get around this is to use visible : hidden instead of display none. That probably doesn't quite solve your problem though. Ill try to play with a tab situation and see what happens

optikalefx commented 11 years ago

this should be fixed in the latest version