How to check whether ui-draggable is destroyed in jquery?

Question

I have an element which is draggable. And I am conditionally destroying the ui-draggable from the element. If the checkbox is checked then apply ui-draggable and if not then destroy it. Now what I want to check whether the ui-draggable is destroyed. I want to return true if it is and if not then false.

jQuery

$("#movable").click(function () {
    if ($("#movable").is(':checked')) {
        $("#cont > #text").draggable({
            scroll: true,
            containment: '#cont'
        });
    }
    else {
        $("#cont > #text").draggable("destroy");
    }
});


$("#text").click(function () {

    //Here i want to check is draggable destroyed from the element or not.

});

Mark Up

<input type="checkbox" id="movable" style="margin-top:10px;" />

<div id="cont">
    <div id="text">Hello World</div>
<div>

Any help would be appreciated.. Thanks

Answer 1

Here's one way to do it:

$("#movable").click(function () {
    if ($("#movable").is(':checked')) {
        $("#cont > #text").data('destroyed', false).draggable({
            scroll: true,
            containment: '#cont'
        });
    }
    else {
        $("#cont > #text").data('destroyed', true).draggable("destroy");
    }
});


$("#text").click(function () {
    var isDestroyed = $("#cont > #text").data('destroyed');
});