Question

How to set detect with draggable function, When check the box the draggable function still not work.

http://jsfiddle.net/KPnRc/

HTML

<div class="drag" style="width:100px; height:100px; background:blue;"></div>
Lock:<input name="lock" id="lock" type="checkbox" value="0" />

JS

if($('#lock').is(':checked') == true){

    $(".drag").draggable();

}

Answer 1

You need to bind your javascript in an onchange event
Here is a fiddle example http://jsfiddle.net/KPnRc/6/

$(document).ready(function () {                 // When the document is ready
    $('.drag').draggable();                     // Initialize the .drag element with draggable
    $('#lock').on('change', function (evt) {    //Bind a function to the checkbox
        if($(this).is(':checked') == true) { //if checked then disable draggable
            $('.drag').draggable('disable');
        }
        else {                                  //else enable draggable.
            $('.drag').draggable('enable');
        }
    });
});