Moving Elements

INTONE

Hello in my application I use the following code to make the modal wider and separated into two side:

.DTED_Lightbox_Wrapper {
    left: 1em !important;
    right: 1em !important;
    margin-left: 0 !important;
    width: auto !important;
}
.DTE_Form_Content {
    position: relative;
    padding: 10px;
    width: 50% !important;
    border-right: 1px solid #ccc;
    float: left;
    box-sizing: border-box;
}
.DTE_Form_Content2 {
    position: relative;
    padding: 10px;
    width: 50% !important;
    float: right;
    box-sizing: border-box;
    
}


editor.on( 'open', function () {
        if((editor.mode) !== "delete"){
           
            $("<div class='DTE_Form_Content2'></div>").insertAfter(".DTE_Form_Content");

          }
})

I now want move to some of the editor.fields to .DTE_Form_Content2. I have tried:

$( editor.node(['rightsManagement.rightsManagementID','rightsManagement.rightsManagement','rightsManagement.users','rightsManagement.contacts','rightsManagement.country','rightsManagement.parishStateProvince','rightsManagement.caseManagers','rightsManagement.calendar','rightsManagement.requests','rightsManagement.tasks','rightsManagement.cases','rightsManagement.communication','rightsManagement.accounts','rightsManagement.hr','rightsManagement.reports','rightsManagement.judgementSearch']) ).clone().appendTo("DTE_Form_Content2"); 

$( editor.node(['rightsManagement.rightsManagementID','rightsManagement.rightsManagement','rightsManagement.users','rightsManagement.contacts','rightsManagement.country','rightsManagement.parishStateProvince','rightsManagement.caseManagers','rightsManagement.calendar','rightsManagement.requests','rightsManagement.tasks','rightsManagement.cases','rightsManagement.communication','rightsManagement.accounts','rightsManagement.hr','rightsManagement.reports','rightsManagement.judgementSearch']) ).appendTo("DTE_Form_Content2"); 

  $('select', editor.node( 'rightsManagement.rightsManagementID' ) ).clone().appendTo("DTE_Form_Content2");

I even tried using the following on an individual editor element like so:

   $( ".rightsManagementID" ).appendTo("DTE_Form_Content2");
   

None of this work. How can this be done?

allan

You'll need to listen for the displayOrder event and perform any DOM modifications you require for the form inside that event handler. It is triggered immediately after Editor does a display update.

Allan