CODEWITHSUNDEEP
javascriptreactjsreact-virtualized
Gohmz
Gohmz

Reputation: 1286

React-Virtualized : CellRender goes under next Row

I'm build app with React-virtualized Table. I added some custom cell render inside each Row. Like Label, or some Img.

Everything works great, but there's a weird behavior.

Inside one cell, I added a simple Dropdown to let user choose some value. Actually, my dropdown render go UNDER the next row. After a click, the dropdown expand and keep under next row.

Is there something that I missed ? Is it normal behavior ?

Upvotes: 0

Views: 410

Answers (1)

bvaughn
bvaughn

Reputation: 13487

The dropdown menu is getting clipped by the parent row's overflow: hidden style. (It may also be obscured by the following row's background-color if you've set one.)

Here's an example of what I'm talking about wrt clipping: http://plnkr.co/edit/9iMzJh?p=preview

I suggest using something react-portal to avoid clipping problems. I've used this before with Table and have been pretty happy with it.

Upvotes: 2

Related Questions