FixedHeader and Column Filters

p.dobrev

Hi guys,
I have a weird bug when using FixedHeader and having custom column filters like in this example

The problem is that when you are writing "fast"... meaning typing at normal speed, sometimes it misses out the letters you had entered. It's really uncomfortable, because suddenly the word you are typing is missing letters.

I believe it's due to update and blur methods in FixedHeader, because the outline blinks on each keyup. When I turn off the FixedHeader there is no outline blink or any other problems.

Anyone has a workaround or a solution? Thanks in advance!

Regards,
Plamen Dobrev

kthorngren

Are you using server side processing? If so it could be the delay in fetching the data. You can use something like searchDelay to help. If this doesn't help please post a link to your page or a test case replicating the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

p.dobrev

Hi @kthorngren

I have provided test case in my original post, there is a link to live.datatables.net, but here is it, unformatted: http://live.datatables.net/hepeqiro/1/edit

I do not use server side processing, it's standard pre-filled table, just as in the test case. The problem is only when FixedHeader is active!

Regards,
Plamen

kthorngren

I tried the test case but it doesn't seem to have a delay. Do you experience a delay with the test case? If you do please provide the steps to replicate the delay.

EDIT: I do see the outline blinking but no slowdown in typing.

Kevin

p.dobrev

It's very very inconsistent, try to type down long word several times into different inputs and I am sure it will skip a letter at some point. Another time it happens is when
I try to clear the input with CTRL+A and BACKSPACE pressed quickly. It skips the BACKSPACE inconsistently.

kthorngren

The blinking is annoying for sure I'll let the developers @allan or @colin take a look. Maybe they will notice something with their code that can be chagned.

Kevin

p.dobrev

Alrighty, I will wait.

Thanks, Kevin! Have a great day!

Regards,
Plamen

p.dobrev

Hey guys,
Just to mention that the bug is also here: https://datatables.net/extensions/fixedheader/examples/options/columnFiltering.html

colin

Yep, thanks, I mentioned that one to Allan as I spotted that myself. It's on his list so he'll get back soon,

Colin

p.dobrev

Alright, thanks for the info @colin

Good luck @allan

And @colin @allan Thank you so much for this amazing plugin! It's amazing what have you done and how effortless is to use.

Regards,
Plamen Dobrev

allan

Hi Plamen,

Thanks for reporting this to us. I've just committed a fix for the issue and it will be in the nightly shortly.

Allan

p.dobrev

Hi @allan

Thanks a lot for the quick response! I managed to update with NPM and now it works as expected... If you don't count the strange errors that overall doesn't break it

Basically when I scroll down (the header becomes fixed) and in a column filter write something that does NOT exist (like "dasdas" in the Name column) there is an error "Uncaught TypeError: Cannot read property 'top' of undefined at FixedHeader._positions"

Then when I clear the filter input and scroll down again it gives an error "Uncaught DOMException: Failed to execute 'appendChild' on 'Node': The node to be removed is no longer a child of this node. Perhaps it was moved in a 'blur' event handler?"

http://live.datatables.net/kezafohu/3/edit here is a test case

But in overall, even though those errors, it works as expected
Regards,
Plamen

allan

That is a weird one! I couldn't reproduce it at all locally, but 100% could with your example.

I've put a guard around the update and that corrects it now.

Allan

p.dobrev

Yeah, I had to copy parts of my code, because with simpler cases it wasn't bugging.

I tried the updated code, but the second error

Uncaught DOMException: Failed to execute 'appendChild' on 'Node': The node to be removed is no longer a child of this node. Perhaps it was moved in a 'blur' event handler?

When I enter something that doesn't exist and then clear the filter input and scroll down again still persists

allan

Is that happening for you here? The previous version was using the cached old nightly (at least for me). I've just tried Firefox and Chrome and it appears to run okay now.

Allan

p.dobrev

Hey @allan
You can see a quick video I did https://drive.google.com/file/d/1brXYnEpqfm8pDkhzDzBkRqBi7StBqkhr/view
The same happens on my website

kthorngren

I tried the happening for you here example and still see the error. I'm using Chrome on the Mac. In the Name column select Not Contains. Type anything in the filter then clear it. Next scroll up to see the error,

EDIT: I did clear my browser's cache to get the current nightlies.

Kevin