AshesOfOwls / jquery.shapeshift

A dynamic grid system with drag and drop functionality.
http://ashesofowls.github.com/jquery.shapeshift/
MIT License
1.67k stars 311 forks source link

Unable to cancel drop #70

Closed justinkneff closed 10 years ago

justinkneff commented 11 years ago

After the drag has been initiated there is no documented way to cancel the event and revert the draggable to its origin. Examples of this are when the item is dropped on a target there is some manual validation that occurs. The validation evaluates the contents of the draggable to determine validity of it being on the location. In my case it calls a web-handler and does server side validation. Even hooking into default jquery drop events does not prevent the ss-accept event from occuring after the droppable "Drop" function is called on the droppable

ellioseven commented 10 years ago

Hi there,

I managed to come up with a little work around for this:

$(".droparea").on('ss-added', function( e,selected ){
    if( $(this).height() > 230 ){
        $(selected).remove();
        $(this).trigger("ss-rearrange");
    }
});

Above:

When item is added, and if the height of the item is over 230, remove it then re-arrange the container.

You could simply rewrite your condition to meet your needs.

justinkneff commented 10 years ago

II like the solution you provided. I actually found a really informational post by the jquery team on how cancelling is not good practice. bugs.jqueryui.com/ticket/8414 I end up notifying the user that the data did not validate. Although the reason I will try your provided solution is it can do both of notify why the data reverted, not just notify them. I'll update with a close comment later after testing this out.

justinkneff commented 10 years ago

Closing due to the documentation of jquery pointing to better design implementation. I change the css design hightlighting the box, putting a red border, and throw an alert when dropped and the drop was "invalid".