0
I am creating my own template filter in primeNg Datatable. It working 
without any issue.
But when I use the same template on virtual scroll it is being cut buy table 
body. Not visible. I tried multiple hit and trial but no luck.

I added <template pTemplate = "body">``<template pTemplate = "header">

but none of them working i tried all possble CSS as well.
Please see the plunk without virtual and with virtual scroll:

Plunk without virtual scroll Div visible

Plunk with virtual scroll Div not visible

DirtyMind
  • 2,353
  • 2
  • 22
  • 43

1 Answers1

0
Some how i manage to solve this issue. Using position fixed and z-index: 1
I have added z-index because in real app it was behind the table rows.
plunker is updated now with sol.


<div *ngIf='showDiv' style=" width: 150px; height: 200px;
                        position:fixed;
                        z-index: 1;
                        border:1px solid grey;
                        overflow: visible;
                        background-color: ghostwhite;">

updated plunk working

DirtyMind
  • 2,353
  • 2
  • 22
  • 43
  • Hope this will help someone to create there own custom filter box. If someone have better alternate solution please post your answer. – DirtyMind Aug 11 '17 at 20:18