Enable disable jquery drag-able

Question

I am working on a print form that will allow the Admin user Change the layout of the print form so I select JQuery Dragable to work and its work fine, but this is one of the problems when Turning on or off the first element in HTML that you can drag and drop, select Disable Style. when Dragable is Disabled, another element will retain its original appearance. I use IE 8. I run the code on Fierfox and Chrome, and the result is that all elements change their style to disable the style. I need Elemnet to keep the original Stayl there.

 

function EnableDragAndDrop(cBox) {
    $("#divDoB").draggable({ disabled: cBox.checked });
    $("#divNationalNo").draggable({ disabled: cBox.checked });
    $("#divSex").draggable({ disabled: cBox.checked });
    $("#divPlaceOfBirth").draggable({ disabled: cBox.checked });
    $("#divIssueDate").draggable({ disabled: cBox.checked });
    $("#divMotherName").draggable({ disabled: cBox.checked });
    $("#divExpDate").draggable({ disabled: cBox.checked });
    $("#divAuthority").draggable({ disabled: cBox.checked });
   $("#divPassportHolderName").draggable({ disabled: cBox.checked });

}

Answer 1

, <div> , class="draggable", , :

function EnableDragAndDrop(cBox) {
  $(".draggable").draggable(cBox.checked ? "disable" : "enable");
}
$(function() {
  $(".draggable").draggable({ containment: '#divDragArea', scroll: false });
});

{disable: boolean} "enable" "disable", , , . , $(function() { });, :)

Answer 2

$ ( "# divDoB" ). draggable ({disabled: true}); JQuery Css, . 35 Disable , " " 1 :)