in this sandbox I’m trying to handle the drop event of a html element (in this ex. a button) into a container.
If the button is clicked, the Task shape is drawn in the container, if it is dropped nothing happens.
Could anyone help me understand?
Thank you in advance.
EDIT 1: first time I use SandBox, I did not save my coding
What do you mean by this? In the Sandbox you shared I can only see a button that can be clicked. Nothing to be dropped.
Did you press
Cmd/Ctrl+S? It looks like the codesandbox I shared recently, so maybe your code changes weren’t saved.
I did not save my code in a new SandBox, I linked @barmac original Sandbox. Sorry for that.
Now, in EDIT 1, you find my Sandbox
You are right. In the first post now I’ve shared the link to the sandbox with my work in it
In the drop event handler, you are calling
createNewDiagram which imports XML. Notice that the actions is asynchronous (
BpmnJS.importXML returns a Promise). So the canvas that you get on the next line refers to an old diagram. The task is drawn on the old canvas/diagram and then you create a new diagram. Notice how it works in this codesandbox.
Still, I don’t see a use case for re-creating the diagram each time you drop something on it
Thank you, that is why I could not see diagramXML on the container.
Actually, I commented out the
handleDroppedModule because I’ve realised that I need to draw different shapes on the same canvas and not to create a new canvas at each drop event.
Yes, rigth I don’t see the point too