This is a discussion thread for
DNDScroll Add-on
. Let me know what you think, any issues you might be having, and if you’d like any additional features. I’m quite busy as a rule so I can’t promise swift solutions, but I’ll get there eventually, I hope. Pull requests are also welcome (please adher to
Vaadin CodingConventions
).
Hi Anna,
I used this addon for my vaadin table Drag & Drop requirement demands to work auto scroll functionality.
This addon have some problem to use. The scenario is scrolling is happening unecessarily while mouse moving without i am selecting a row to use drag & drop. It is not behaving the user friendly.
Vaadin 8 compatible version 2.0.0 released.
Hi, and sorry for the late reply, I have missed this comment for some reason. I haven’t come across this behaviour myself, did you find the underlying cause or is it still a problem?
Right, I’ve been living under a rock these past months (read: been insanely busy with work), had also missed a pull request that told how to reproduce the issue and had a fix for it. The fix is included in version 2.0.1 for Vaadin 8, and will release Vaadin 7 compatible version soon as well. Thanks, qwasli, for the fix!
1.0.2 contains the fix for Vaadin 7
Hi, I am still facing this issue with vaadin 7.7.7. As you mentioned dndscroll-1.0.2 is available? But i am unable to download this addon. Please send me the Downlod link url for this.
Hi! I’m afraid the directory doesn’t have direct links to versions, but if you go to https://vaadin.com/directory#!addon/dndscroll-add-on and…
a) select version 1.0.2 from the version dropdown in the left hand sidebar, just below the icon
or
b) click the Available for 7 link at the bottom of the left-hand sidebar, which does the version selection for you automatically
…you can then download that version by clicking the green Install button on the right.
Hi,
After updating new jar Still the problem is there please check this scenario ex: don’t use drag & drop just select the table row and move the mouse vertically down its auto scrolling is happening.
Sample peice of code which i used is below one.
table = new Table(“BeanItem CONTAINER Example with 1000 records”);
table.setImmediate(true);
table.setEditable(true);
table.setSelectable(true);
table.setMultiSelect(true);
table.setSizeFull();
table.setWidth(“30%”);
table.setDragMode(TableDragMode.ROW);
table.setDropHandler(createDropHandler());
extension = new TableAutoScrollExtension();
extension.extend(table);
/**
* Method to drag & drop
*
* @return DropHandler
*/
protected DropHandler createDropHandler() {
DropHandler tableDropHandler = new DropHandler() {
/**
*
*/
private static final long serialVersionUID = 8497798893717596345L;
/***
* @return AcceptCriterion
*/
@Override
public AcceptCriterion getAcceptCriterion() {
return AcceptAll.get();
}
@Override
public void drop(DragAndDropEvent event) {
TableTransferable transferafleObj = (TableTransferable) event.getTransferable();
// Get the incoming object being dropped
Object sourceItemId = transferafleObj.getItemId();
AbstractSelectTargetDetails dropData = (AbstractSelectTargetDetails) event.getTargetDetails();
Object targetItemId = dropData.getItemIdOver();
// No move if source and target are the same, or there is no
// target
if (sourceItemId == targetItemId || null == targetItemId) {
return;
}
ClaculationBean source = container.getItem(sourceItemId).getBean();
ClaculationBean target = container.getItem(targetItemId).getBean();
ClaculationBean prevTargetItem = container.prevItemId(target);
container.removeItem(sourceItemId);
if (null != prevTargetItem) {
container.addItemAfter(prevTargetItem, source);
} else {
container.addItemAt(0, source);
}
}
};
return tableDropHandler;
}
Thanks, I’ll try to find some time to test that at some point and see if I can figure it out. Couldn’t fit it in today and am not sure about tomorrow either, but I hope I’ll manage to do that sometime this week.
We have seen some oddities, but can’t fully reproduce them yet.
But we do see that tables will scroll regardless of any items being selected, and thus certainly not while being dragged. But is that a bug or a feature? I mean, when there’s a table listing in a scrollbar, it’s sort of nice that it will scroll the table based on positioning the cursor. (I probably should test on iPads and such.)
UPDATE: The issue with scrolling without DND in progress is that if our table shows 8 rows (out of 20 in the Table), when trying to click row 1 or 2 or 7 or 8, the table will autoscroll and thus your click will be on the wrong row if you don’t adjust. So I guess autoscrolling outside of a DND scenario would be better, at least for tables that have selectable rows.
A few oddities we noted were tables scrolling to the bottom on their own. Like we couldn’t get it to stop auto scrolling to the bottom, even if we manually scrolled to the top. A browser refresh resolved it. But like I said before, when we try to make it happen, we cannot, so something might be amiss.
For us, our tables often are not only scrollable with DND, but if you click on them, they open up another window (in case this scenario of being both a table to accept drops and also to allow clicks for more actions matters).
Question: We use your add-on (mostly working great, so thank you for what is an obvious feature that should be Vaadin core) by extending our Table before we initialze the table for DND. It seems to work fine, but wondered if that could be an issue and we’re only supposed to extend the Table after the table is setup for DND. Like perhaps it creates a timing issue???
Sorry, didn’t have time to check this out today after all, had some problems with my NumberField add-on conversion that took longer than expected. Can’t say anything for sure about the order of things, I’ve only tried the extending as the last part version in my demo. I wouldn’t expect the order to matter, but I have to say I can’t remember the implementation details of this area well enough off the top of my head to guarantee it.
I did get the issue reproduced, though, so that’s a good starting point for next week.
Thanks, Anna. It’s a great idea, but I think the real key for scrolling is to ensure it only happens WHILE in Drag and Drop mode. It seems that it will scroll at whim when trying to interact with tables.
Once I see a table in scroll mode, I note that it will scroll just by moving my cursor to the top/bottom 1-2 rows of the table. It will even scroll just before I go to click on a row.
And because web pages are just DIVs (not real windows on top of each other), when I have a popup that covers the table, moving my mouse in the overlay window will cause the table underneath it to scroll as well.
The only thing that seems to make sense to stop all that scrolling is to ensure it will not scroll UNLESS it is currently in DND mode. Hope that helps as the add-on will be terrific once it solves this.
I’m sorry to say that other duties have completely swallowed me again, and I’ll be on vacation for the next two weeks, so it looks like I can’t get to this anytime soon 
If anyone else wants to take a shot at it, pull request are always welcome, but try to keep them as simple as possible and use the old Vaadin
CodingConventions
(feel free to ignore anything that has to do with Java 5) or I just won’t be likely to have time to go through the pull request anytime soon either in order to make a new release. Sorry to leave you hanging, so many things to do, so little time…
Thanks, Anna. What more fun can you have on vacation that coding Vaadin add-ons?
I would take a look at the code, but as I don’t understand how Vaadin auto scrolling works or even determining how to know if dragging is taking place over an element(Table). If anybody has clues or pointers on these topics, I’d be happy to take a look as we really like your addon, but having tables scroll while trying to select rows in a table, and scrolling underlying tables partially obscured by a “window” (dealing with Z axis issues for overlapping DIVs) makes the user experience tricky.
Actually vaadin doesn’t have a drag method inside the Drag & Drop listener we have only drop method, Let us assume If we have drag listener is available in Drag & Drop, we can do inside drag method we can activate auto scroll once user drops the row on his target position deactivate the auto scroll feature i believe its make sense.
That sounds like the issue, though. Many of our Tables have DND activated because those tables support DND even if we have specific expectation that they will reorder via DND. But if you cannot detect that a row has been selected to start the auto-scroll, then Tables wil scroll even though no item has been selected, nor is any item being dragged. Since nothing is dropped, nothing turns off the auto-scrolling.
What’s needed is a way to know that a drag operation has started (or at least an item has been selected) so auto scrolling can then take place, and as you say, it must stop auto scrolling on a drop or an unselect of a row (no rows is selected).
But clicking a row to drag it doesn’t do a table row selection (value change listener event fires on the table), so it needs to ensure no auto scrolling unless it’s been selected for dragging, and a table value change event should not count because selecting a row (in our case to open a popup window to configure something more) itself shouldn’t cause any scrolling.
Hi Anna,
thanks for the Add-on. Is it supposed to work with CustomTable and more importantly with FilteringTable?
Does work great with FilteringTable-Addon after making some adjustments. Thanks!