search

nicolaskruchten / pivottable

Open-source Javascript Pivot Table (aka Pivot Grid, Pivot Chart, Cross-Tab) implementation with drag'n'drop.
https://pivottable.js.org/
MIT License
4.36k stars 1.08k forks source link

Problem: Unable to put a field in a proper place #534

Open EtagiBI opened 8 years ago

EtagiBI commented 8 years ago

I've stumbled upon a minor yet constant problem. If I have more than two fields in columns of my table, I'm unable to put any third field in the first place (very left side of columns). A blue target area just doesn't appear there... The only way to reorder fields properly is to remove them all from columns and start 'cobbling' from scratch.

nicolaskruchten commented 8 years ago

Odd... What versions of what operating system and browser are you using?

EtagiBI commented 8 years ago

Doesn't matter. We use different Oss (Windows 8.1, Linux Mint), browsers (Chrome, FireFox). I can upload a video showing the problem 'in action'.

nicolaskruchten commented 8 years ago

I'm going to need to see a video to understand the issue, yes :) thanks!

EtagiBI commented 8 years ago

Here we go: https://sendvid.com/h9xxhzv4

Thanks in advance for your attention!

nicolaskruchten commented 8 years ago

OK, I understand now, thanks for the video!

Can you confirm that this happens for you on the following example page? http://nicolas.kruchten.com/pivottable/examples/mps.html

If not, then the problem is in the styling that you are using...

EtagiBI commented 8 years ago

Well, we use a customized code, but swithching off the styling doesn't help. I can send you our .js & .css files to examine, if you have time for it.

nicolaskruchten commented 8 years ago

First, could you please tell me if you can reproduce the issue with the example page? :)

EtagiBI commented 8 years ago

Sort of. Example page contains a 'lite' version of pivo table, so I can only reproduce lags when dragging. Quite demonstrative, though: http://giphy.com/gifs/l0HlGMgKf7q1AbnEI

nicolaskruchten commented 8 years ago

Hmmm. What do you mean about the example being "lite"? I'm afraid I don't follow...

Also, I believe that the issue is with the actual path that your mouse takes: if you drag straight across, always keeping your mouse within the droppable area, this never happens on the example page (at least for me on Chrome/OSX) but if you drag your mouse out of the droppable area and back in, or wave the mouse around to the left of the droppable area but not in it, then indeed, the element will not be dropped in the left-most position. When you bring the mouse back into the droppable area near the left edge, then the dashed rectangle appears and you can drop in the left-most position.

For your original video, I believe that the green element is 'blocking' the droppable area and thus preventing this behaviour.

EtagiBI commented 7 years ago

Further tests showed that green element isn't the issue. As for "lite", our table is heavy-loaded with data (~100 Mbytes), whereas your example table seems to be much lighter in use (back-end load?).

nicolaskruchten commented 7 years ago

I'm afraid I cannot replicate your behaviour even with very large files. I'm not sure what you mean by "back-end load" ... This library does not interact with a server back-end and no processing happens during drag'n'drop (which is handled by the underlying jQuery library anyway).