ng-grid with ui-bootstrap: Grids in hidden tabs are not shown

[zussel]

Having multiple grids on a page each in a seperate tab, data of hidden grids is not shown. It appears when resizing the window.

See it here: http://plnkr.co/edit/S1Po1qugA03Ntc4vF0nt?p=preview

I tried to use the select event, but that works only with one hidden grid not with multiple grids.

[AlJohri]

I think this is the same issue as #50

Not sure if there is a fix yet?

[efraimip]

I'm also having this issue....
tried all the various suggested fixes -- !important on height/min-height, etc. -- they dont work.
without putting a watcher on it, which is a very bad way to fix it, seems hard to solve this.

[anthony-foulfoin]

I'm having this issue too with Google chrome..

[getuliojr]

I´ve just checked this problem. It is related by the fact that the class ng-hide from angular is using a tag display:none !important and this was making it impossible to get the real width. I just sent a pull request #991 to fix it. It adds an !important to the element at the moment of getting the width, so it gets the real value and remove it after that.

[ronghub]

getuliojr, in my case, your fix somehow minimized the number of pixels the width is off from the real width. I will try and debug this to see why.

[ronghub]

Another solution is to override angular ng-hide and create a custom show directive to mimic original ng-show. But this doesn't work in all cases.

[AlJohri]

@ronghub I'm using ng-show and I still get the same error. Could you elaborate on your fix?

Source Code:
#991 (comment)

[ronghub]

@AlJohri I am not encountering the same issue as you are. For me, the ng-grid in tabs (angular ui) are rendering, but the columns are exceeding the grid width.

[getuliojr]

I had a similar problem with bootstrap3, but ng-grid was inside a class="row". Now it is not anymore and everything is working fine. If you could post your html I can see what else might have been impacting your layout.

[AlJohri]

My grid is in a col-sm-7 which in turn is under a row.

Code here: #991 (comment)