Hi, interesting component, Is there a way to drop a component in a given p

Directory sortable-layout
1

Hi, interesting component,

Is there a way to drop a component in a given position?

Thanks

2

Hi, I’m not sure of what you want.

You want to force to drop a component in a certain position or you want to drop from the server side?

3

Hi, thanks for the reply,

what i need is to drag ( clone ) a component from another layout that contans a list of items and drop it into a sortable layout at the mouse position.

Thanks

4

Hi,

I’ve created 2 issues related to your question:

I’ve also updated the readme.

5

Thanks, it will be very usefull.

regards

6

You can try the version 0.4.0.
Here an example of code:
https://github.com/jcgueriaud1/sortable-layout/blob/master/sortable-layout-demo/src/main/java/org/vaadin/jchristophe/TwoLayoutsView.java

7

Hi, using the clone function seems that the component is cloned in the origin list and not in destination.

My configuration

Origin

SortableConfig paletteStructureConfig = new SortableConfig();
paletteStructureConfig.setGroupName("rows-dragdrop");
paletteStructureConfig.addDragInGroupName("rows-dragdrop");
paletteStructureConfig.allowDragIn(false);
paletteStructureConfig.setSort(false);
paletteStructureConfig.allowDragOut(false);
paletteStructureConfig.cloneOnDragOut(true);
paletteStructureConfig.setAnimation(150);

SortableLayout rowsSortableLayout = new SortableLayout(paletteStructures, paletteStructureConfig, rowsSortableGroupStore, e -> this.cloneRowComponent(e));


Destination

SortableConfig rowsSortableConfig = new SortableConfig();


rowsSortableConfig.setGroupName(“rows-dragdrop”);

rowsSortableConfig.allowDragIn(true);

rowsSortableConfig.addDragInGroupName(“rows-dragdrop”);

rowsSortableConfig.allowDragOut(true);

rowsSortableConfig.setAnimation(150);


SortableLayout rowsSortableLayout = new SortableLayout(canvas, rowsSortableConfig, rowsSortableGroupStore);

rowsSortableLayout.setWidthFull();




private Component cloneRowComponent(Component paletteItem) {


ComponentData componentData = ((PaletteItem)paletteItem).getComponentData();

if (componentData != null) {
    return ddUtils.createRowComponentFromPaletteItem(componentData, eb, customCombos, editorModel);
}

throw new IllegalArgumentException("Error");



}


when i drag a component from origin to destination, the cloneRowComponent is called, the result component is created into the origin sortable ( that is wrong )

in the destination sortable is copied the component I dropped. ( that is wrong )

what I expected was to have the new cloned component into che destination and the origin has to be left in the original position.

any Hint ?

8

Hi,

Yes that's true. The clone is created when I remove the item the old list (then I'm replacing it by a clone in the old list). I think this is due to the javascript library that moves the client side to the new place but I need to check how I can avoid this.

Here is the ticket, I'll investigate https://github.com/jcgueriaud1/sortable-layout/issues/20