jQuery sortable cancel event if not valid

Question

I have a list which is sortable. Before I start sorting, I want to check if all the elements of that list are valid. If not, cancel the event and leave the list intact.

You can find the code here http://jsfiddle.net/DZYW5/4/

When I use this, the event is canceled, but the element is removed.

start: function (event, ui) {
    if (!valid()) {
        return false;
        // it cancel's but the element is removed...
    }
}

Maybe I should implement a "beforeStart" event? Suggestions?

Answer 1

You can use the cancel method

$("#list").sortable({
    connectWith: ".connectedSortable",
    items: '.sortable-item',
    handle: '.handle',
    placeholder: "ui-state-highlight",
    stop: function (event, ui) {
        console.log('stop')
        if (!valid()) {
            $( this ).sortable( "cancel" );
        }
    }
});

Demo: Fiddle