Drag & Drop in Vaadin 8.1: Drop Criteria (Script)

Dear Vaadin experts,
while migrating to Framework 8.1 I realized there seem to be no examples for using the drop criteria. On https://vaadin.com/docs/v8/framework/advanced/advanced-dragndrop.html they are only mentioned globally and on https://demo.vaadin.com/sampler/#ui/drag-drop/drag-components-html5 there is no drop criteria used.

In Vaadin 7 there was the method
AcceptCriterion getAcceptCriterion()

of the interface


where the logic could be implemented. The application used


to check if the dragged component could be dropped.
But now in Vaadin 8.1 it seems that I can only either use JavaScript (which I can’t because I have to check some things only known on the server side) or set some payloads on the
. I tried using payloads, but then my components are not draggable anymore!

I have multiple draggable sources and multiple potential drop targets in the application. It would be fine for me to set some organizational tags (as payloads) on the DragSourceExtension so I can check only the payloads, but the component must stay draggable.

Is there any example on how to do this?

Is it possible for you to do the server-side validation in the DropEvent? That is, you can drop, but check the validity after it’s been done (instead of before allowing dropping) and don’t execute the happy-flow drop code if validation fails.

You could of course also create a JavaScript function handler on the server side.


Hi Olli,
that is what I have implemented at the moment, but it is unsatisfactory. In Vaadin 7 the user saw where the drop was possible (blue frames were shown around the components while dragging an item over them) - in Vaadin 8 this should also be possible (using com.vaadin.shared.ui.dnd.criteria.Payload and com.vaadin.shared.ui.dnd.criteria.Criterion) but unfortunately when I add a payload to my DragSourceExtension the component is not draggable anymore…