Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set jquery-ui draggable revert to true if after a validation i decide to move the element back?

I'm looking for a way to trigger the event from revert status if something doesnt validate, for example if the element doenst exist it will create it from another list, but if it already exists it should go to else and returns the element to its original position:

$( "#catalog ul" ).droppable({
        tolerance: 'fit',
        activeClass: "ui-state-default",
        hoverClass: "ui-state-hover",
        accept: ":not(.ui-sortable-helper)",
        drop: function( event, ui ) {
            //check if already exists
            if($(this).find("#"+$(ui.draggable).attr("id")).length==0){
                $( "<li id="+$(ui.draggable).attr("id")+"></li>" ).text( ui.draggable.text() ).appendTo( this )
                .draggable({
                    revert: 'invalid',
                    stop: function(){
                        $(this).draggable('option','revert','invalid');
                    }
                }).droppable({
                    greedy: true,
                    tolerance: 'touch',
                    drop: function(event,ui){
                        ui.draggable.draggable('option','revert',true);
                    }
                });
            }else{
                //want to make the object go back by setting true to revert
                return false;
            }
        }
    })
like image 532
kenji Avatar asked Mar 31 '12 22:03

kenji


1 Answers

Thanks Kenji, this indeed works:

ui.draggable.draggable('option','revert',true); 

I also struggled with this for a morning until finding your post, thanks

like image 189
Nick Avatar answered Apr 15 '23 17:04

Nick