w2grid.addRange

Adds a visible range or ranges to the grid.

addRange(range)

range

object or array, range(s) to add

Returns integer.

Description

This method will only work if your grid is excel-like grid, set .selectType to 'cell'. The method adds a visible range or ranges to the grid by adding items into .ranges array and calling the .refreshRanges() method.

The first and only argument range can be either a range object or an array of range objects to add. Returns the number of ranges it adds.

If you define grid as:

​x
 
let grid = new w2grid({
    name : 'grid',
    selectionType : 'cell',
    columns: [
        { field: 'recid', text: 'ID', size: '50px' },
        { field: 'lname', text: 'Last Name', size: '30%', searchable: true },
        { field: 'fname', text: 'First Name', size: '30%', searchable: true },
        { field: 'email', text: 'Email', size: '40%', searchable: true },
        { field: 'sdate', text: 'End Date', size: '120px' }
    ],
    records: [
        { recid: 1, fname: 'John', lname: 'doe', email: 'vitali@gmail.com', sdate: '1/3/2012' },
        { recid: 2, fname: 'Stuart', lname: 'Motzart', email: 'jdoe@gmail.com', sdate: '2/4/2012' }
    ]
});
​

You can add a range by:

xxxxxxxxxx
 
w2ui.grid.addRange({
    name    : 'range',
    range    : [{ recid: 1, column: 3 }, { recid: 5, column: 5 }],
    style    : 'background-color: rgba(0, 140, 0, 0.1); border: 2px solid green'
});
​

or several at a time:

xxxxxxxxxx
 
w2ui.grid.addRange([
    {
        name    : 'range1',
        range    : [{ recid: 1, column: 3 }, { recid: 5, column: 5 }],
        style    : 'background-color: rgba(0, 140, 0, 0.1); border: 2px solid green'
    },
    {
        name    : 'range2',
        range    : [{ recid: 1, column: 0 }, { recid: 3, column: 0}],
        style    : 'background-color: rgba(140, 0, 0, 0.1); border: 2px solid red'
    }
 ]);
​

See .ranges array for the structure of the ranges object.

w2grid.addRange

Description

User Comments