Drag and drop colour change on snap return to initial position

Feb 28, 2022

Hi heroes

I've created a drag and drop for the learner to sort their top 5 and bottom 5 from 30 choices, with the relevant two targets.  The tool assigns one as 'correct' and the other 'incorrect'.  The drag boxes change colour when dropped. using states.   If the learner wants to change their mind, and return the box to the rest to make another choice [highly likely in this exercise] I've snapped the box to initial position.  So far, so good. But the box changes state to 'incorrect' so retains that colour, even if dragged back from the 'correct' target.  I can understand why that happens, but can't find a workaround.  I tried a trigger that changed the box to the initial state on the user clicking;  it worked, but only until the mouse is released, then it changes back to the 'incorrect' colour.  

Does anyone have a solution other than giving up on the colour change?  I could have lived with their retaining the colour of the initial target, but not all turning 'incorrect'.

Help, please!

2 Replies
Richard Watson

Hello Jenn,

Happy to help. Can you explain a little more about how you are trying to use this interaction?

The logic is a little confusing to me. If the learner is selecting their top 5 values, where does the correct and incorrect logic come in? As it is configured, the learner is always wrong if they drag anything into the Bottom 5 values drop zone.

Help me understand what you are trying to accomplish here and I'm sure we can figure out how to set it up to work for you.


Jenn Bedlington

Hi Richard

I realise I could have set this up from scratch, but thought it might be quicker to use the drag and drop tool.  That means that in terms of the tool of the two destinations, one has to be 'correct' and the other, 'incorrect'.  So, yes, hidden behind the scenes ;you're right that the bottom 5 result in an 'incorrect' answer.  But that doesn't matter, as the learner is not given feedback or told that it's incorrect - it's just a visual representation of their choices.  It all works as required unless they change their minds and want to return one choice and select another,  Then the colour changes as I described above kick in.

What I'm looking for is a trigger to change the state back to normal when the object is returned to its original position.

I suspect building it from scratch might be the easier option!