Overview

This guide is meant to assist in upgrading from ParamQuery Pro 3.4.x to ParamQuery Pro 4.0.0. All changes which are impacted by upgrade are listed below, along with how to upgrade your code. For new features please refer the changeLog included in the SDK.

General Changes

  1. Supoort for IE8 is completely dropped.

  2. Context of detailModel.init, column.filter.listener(s) and column.filter.init is set to grid instance instead of DOM reference.
    DOM reference to current control can be obtained from evt.target in column.filter.listener(s)
    DOM reference to current editor can be obtained from ui.$editor in column.filter.init

  3. All methods which return object instances on which further methods can be invoked have first letter of their names capitalized. So range, selection, history, group are renamed to Range, Selection, History, Group.

  4. Html entities in cell data with dataType: 'string' are escaped while rendering for security. If they are needed on purpose, then use dataType: 'html'. Any html entities added by render or postRender callbacks are not affected.

Grid

Filter

Filter method data parameter name is renamed to rule(s). data parameter has a different meaning and structure in new filter method.

So instead of

grid.filter({
    data: [ {dataIndx: 'dataIndx1', value: 'value1', condition: 'begin' } ]
})

use

grid.filter({
    rule: {dataIndx: 'dataIndx1', value: 'value1', condition: 'begin' }
})

Events

rowList is separated into addList, updateList and deleteList in beforeValidate and change events.

Formula

Instead of defining formula callbacks within the column definitions, they are defined in a separate formulas option.

formulas: [
    [ 'sum', function( rd ){
        return rd.dataIndx1 + rd.dataIndx2 + ... ;
    ],
    //dependant formulas are defined after dependency formulas.
    [ 'avg', function( rd ){
        return (rd.sum / count);
    ]
]
and then name of formulas are assigned as dataIndx to respective columns.
    {
        dataIndx: 'sum',
        title: 'Sum of columns',
        ...
    }


Row grouping

  1. First letter of group() is capitalized, so use grid.Group() instead of grid.group() to get grouping instance.
  2. groupOption() is replaced by Group().option()


Selections

The selections UI and API is changed in this version. Row selections and cell selections are separated so that cell selections can be used along with checkbox row selections and row selections are not affected by key navigation. Row selections are more effective for grid operations while cell selections are for Excel like operations.

  1. Henceforth cell selections are dealt by Range and Selection object while row selections are dealt by SelectionRow object.
  2. Rows are selected by mouse click instead of dragging the mouse. Rows are deselected by Ctrl click or a successive click. Number of rows are selected and deselected by shift click.
  3. Row selections fire beforeRowSelect and rowSelect while range selections fire selectChange and selectEnd events.