getVisibleRange();
The getVisibleRange method gets the range of visible cells in the given range.
This method returns an object of the PP.Ui.TabSheetRange type.
To execute the example, the HTML page must contain the TabSheet component named tabSheet (see Example of Creating the TabSheet Component). Determine the range that includes the entire table, fill its visible cells with yellow color and lock them:
// Get table dimensions
var measures = tabSheet.getMeasures();
// Determine index of the last table row
var lastColIndex = measures.getLastColIndex();
// Determine index of the last table column
var lastRowIndex = measures.getLastRowIndex();
// Determine the entire table range
var range = tabSheet.getRange(0, 0, lastColIndex, lastRowIndex);
// Determine the function to fill table cells
var fill = function (range, color) {
// Get a cell array in the range
var cells = range.getCells();
for (var i in cells) {
// Get a separate cell
var cell = cells[i];
// Get cell style
var style = cell.getStyle();
style.Fill.Color = color; // Fill color
cell.setStyle(style); // Set cell style
// Set this style for the table cell too
var style = tabSheet.getModel().getStylesJSON()[0];
var coord = cell.getCoord();
range.getTabSheet().getModel().setStyle(tabSheet.getCell(coord.rowIndex, coord.colIndex), style);
}
};
// Check if this range is totally hidden
if (!range.isWholeHidden()) {
// Get a range of visible cells
var visibleRange = range.getVisibleRange();
// Set yellow fill color for the visible range
this.fill(visibleRange, PP.Color.Colors.yellow);
// Lock visible range cells
visibleRange.setEnabled(False);
};
// Scroll the table to the D column
tabSheet.scrollToColumn(2);
After executing the example the range that includes the entire table is determined, its visible cells are filled with yellow color and locked. Thus, the cells colored in yellow are now unavailable for editing, other cells can be edited. To make the example more visual the table has been scrolled to the column D:

See also: