Question

I made a quick list, which you can drag to a trash can (which removes it).

Everything works when you press "ok", and the item gets removed as it is told to. Although if you press "cancel" to the confirm popup, the item shows up in the trash, and instead I want it to go back to where it was in the list.

JSFiddle: http://jsfiddle.net/Gdze8/2/

Javascript:

   $( init )

    function init() {
    $(".contentItem").draggable({
        revert: 'invalid'
    });
    $(".list4").droppable( {
        accept: ".contentItem",

        drop: function(event, ui) {
            ui.draggable.hide();
            if (confirm("Are you sure you want to delete?")){
            ui.draggable.remove();

            bottomInfo ();
        } else {
            ui.draggable.show();
        }
        return false;
        }
    });
    }
Was it helpful?

Solution

You'll add the confirm on the draggable instead, reverting if the confirm was not confirmed etc :

$(".contentItem").draggable({
    revert : function(event, ui) {
        var state = confirm("Are you sure you want to delete?");
        if (state) $(this).remove();
        return !state;
    }
});

FIDDLE

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top