:: Forum >>

Disabling and Enabling Grid

I see many people asking about this, so sharing my 2 cents for it. It simply puts a high z-index DIV over the grid ;-) Works great...

<style>
.aw-grid-mask {position: absolute; z-index: 10000; background-color: #eee; opacity: 0.5; -moz-opacity: 0.5; filter: alpha(opacity=50);}
</style>

function disableGrid(grid) {
if (! grid.maskEl) {
var maskEl = document.createElement('div');
document.body.appendChild(maskEl);
maskEl.className = 'aw-grid-mask';
var gridEl = grid.element();
maskEl.style.left = AW.getLeft(gridEl) + 'px';
maskEl.style.top = AW.getTop(gridEl) + 'px';
maskEl.style.width = gridEl.clientWidth + 'px';
maskEl.style.height = gridEl.clientHeight + 'px';
grid.maskEl = maskEl;
}
grid.maskEl.style.display = 'block';
};

function enableGrid(grid) {
if (grid.maskEl) {
grid.maskEl.style.display = 'none';
}
};
Sudhaker Raj
Tuesday, December 12, 2006
Using patch.

AW.UI.Grid.prototype.disableGrid = function() {
    if (! this._maskEl) {
        var maskEl = document.createElement('div');
        document.body.appendChild(maskEl);
        maskEl.className = 'aw-grid-mask';
        var gridEl = this.element();
        maskEl.style.left = AW.getLeft(gridEl) + 'px';
        maskEl.style.top = AW.getTop(gridEl) + 'px';
        maskEl.style.width = gridEl.clientWidth + 'px';
        maskEl.style.height = gridEl.clientHeight + 'px';
        this._maskEl = maskEl;
    }
    this._maskEl.style.display = 'block';
};

AW.UI.Grid.prototype.enableGrid = function() {
    if (this._maskEl) {
        this._maskEl.style.display = 'none';
    }
};


And use it.
<button onclick="obj.disableGrid()">Disable grid</button>
<button onclick="obj.enableGrid()">Enable grid</button>
Sudhaker Raj
Monday, December 18, 2006

This topic is archived.


Back to support forum

Forum search