Start Building Professional
Web Apps Today

layout undock window

I have a layout with 2 panels in it. I want to be able to click down on the header of a panel, and drag it out into an undocked position. How can I do this?

Thanks!

Layout does not support drag-n-drop.

Is there a way to detect a mouse double-click on the header and then call the undock method to undock that cell?

Modify code in dhtmlxlayout.js file like this:

this._buildSurface = function() {
    ...
    // find this
    for (var a in p) {
       ...
       var bar = document.createElement("DIV");
       // add here more code
       bar.a = a;
       bar.ondblclick = function() {
           that.cells(bar.a).undock();
       }
       ...
    }
}

or you can call event handler

    bar.a = a;
    bar.ondblclick = function() {
       that.callEvent("onCellDblClick", [bar.a]);
    }


and then catch this throug attachEvent

    dhxLayout.attachEvent("onCellDblClick", function(cellId){
       dhxLayout.cells(cellId).undock();
    });

I added this:

       bar.a = a;
       bar.ondblclick = function() {
           that.cells(bar.a).undock();
       }
       ...
but no matter which cell header I click (either a or b), it always undocks b.  I am using view 2U.  If I double click on a cell header, that particular cell should become undocked.

Right, sorry, try this:

       bar.a = a;
       bar.ondblclick = function() {
           that.cells(this.a).undock();
       }