angular-ui / ui-grid

UI Grid: an Angular Data Grid
http://ui-grid.info
MIT License
5.39k stars 2.47k forks source link

Dropdown cell template is now shown #3020

Open hikalkan opened 9 years ago

hikalkan commented 9 years ago

Hi,

Similar problem was discussed here: https://github.com/angular-ui/ng-grid/issues/666 But it's old. Now,

When I have a bootstrap bropdown button in a cell template, it is now shown. I created CSS (actually less) for it:

.ui-grid-cell.showMe {
    overflow: visible;

    .ui-grid-cell-contents {
        overflow: visible;
    }
}

and then user showMe as cellClass. The result:

uigrid1

It seems working BUT, still there is a problem with table overflow:

uigrid2

When it overflows from table, it's now shown. How we can solve the problem?

hikalkan commented 9 years ago

Hi,

Could you check it? This is important, because we can not use dropdown button in a grid. And it's widely used to provide actions for a row.

PaulL1 commented 9 years ago

It's almost certainly due to overflow properties on one of the other ui-grid directives, or the z-order thing.

I really suck at css, and I think the other core ui-grid devs feel the same. It's also almost impossible to diagnose something like this without a plunker.

I'd suggest using the Chrome developer tools and working up through the stack to see what overflow properties and other properties are set on the various elements that enclose the cell in question, and see whether editing any of them fixes your problem. If so, then you're into trying to create a css override to give you that effecct.

hikalkan commented 9 years ago

I tried some overflow setting but could not succeed. I just did'nt try to change table's overflow. But I hesitate from changing it since it may break other things. I'll try it also. I'll try z-order also but don't think it's related to z-index.

PaulL1 commented 9 years ago

Any chance of a plunker for this?

enzhouliu commented 9 years ago

i am facing similar problem: http://plnkr.co/L04hy7Ld9NakQC82uS2i

hikalkan commented 9 years ago

My current workaround is:

.ui-grid .dropdown.open {
  position: fixed;
}

but it may also cause other problems in some conditions.

thobiasxp commented 9 years ago

I am facing an issue may be related to this. When there is large amount of data the dropdown button disappears when scrolling down... Similar to the screenshot attached uigrid

mojokum commented 8 years ago

I am also facing the same problem . Can any one support on this issue

image

alacto commented 7 years ago

+1 Would like a resolution to this issue

seriatechnologies-mateen commented 7 years ago

@hikalkan Did you find solution to this problem. I am also facing issues when using a drop-down menu in cell template. The menu is visible when grid is not scrolled. For large set of data, when I scroll the grid, menu is not visible. When observed in chrome developer bar, I can see it at correct location. Tried with z-index but not successful.

Eagerly waiting for some fix.

ismcagdas commented 7 years ago

Hi, this solution is worked for us https://forum.aspnetboilerplate.com/viewtopic.php?f=5&t=2504#p6442.

hikalkan commented 7 years ago

@seriatechnologies-mateen, we are with @ismcagdas

seriatechnologies-mateen commented 7 years ago

@ismcagdas Solution solution you pointed helped me. Thanks. You saved me !!

seriatechnologies-mateen commented 7 years ago

@hikalkan . Got it working now with above solution.

ihappyk commented 7 years ago

should i use the latest version for this..? for me its still not working.

could you please let me know on which version its fixed?

ismcagdas commented 7 years ago

@ihappyk, we have tried with v3.2.1, what is your version ?

ihappyk commented 7 years ago

@ismcagdas i am using v3.1.1 , and now its working.