GridView

GridView class, a child class of GridBase.

Signature:

export declare class GridView extends GridBase

Extends: GridBase

Remarks

[Superclass]

GridBase

The constructor for this class is marked as internal. Third-party code should not call the constructor directly or create subclasses that extend the GridView class.

Events

Properties

Methods

Events Desc

onCollapsed

Callback notifying that grouped rows are collapsed

Type - (grid: GridView, itemIndex: number) => void

Remarks:

[Parameter list]

grid - GridView control

itemIndex - itemIndex of the collapsed group item

Example:

gridView.onCollapsed = function(grid, itemIndex) {
 console.log('Collapsed at: ' + itemIndex)
};

onCollapse

Callback to determine grouped row folding

Type - (grid: GridView, itemIndex: number) => boolean

Remarks:

[Parameter list]

grid - GridView control

itemIndex - itemIndex of the group item to collapse

Example:

gridView.onCollapsing = function(grid, itemIndex) {
 if (itemIndex % 2 === 0) {
 return false;
 }
};

onExpanded

Callback notifying that grouped rows have been expanded

Type - (grid: GridView, itemIndex: number) => void

Remarks:

[Parameter list]

grid - GridView control

itemIndex - id of the expanded group item

Example:

gridView.onExpanded = function(grid, itemIndex) {
 console.log('Expanded at: ' + itemIndex)
};

onExpanding

Callback to determine grouped row expansion

Type - (grid: GridView, itemIndex: number) => boolean

Remarks:

[Parameter list]

grid - GridView control

itemIndex - itemIndex of the group item to expand

Example:

gridView.onExpanding = function(grid, itemIndex) {
 if (itemIndex % 2 === 0) {
 return false;
 }
};

onGrouped

Callback notifying that grouping has occurred

Type - (grid: GridView) => void

Remarks:

[Parameter list]

grid - GridView control

Example:

gridView.onGrouped = function(grid) {
 console.log("I am Grouped!");
};

onGrouping

Callback to determine grouping

Type - (grid: GridView, fields: number[]) => boolean

Remarks:

[Parameter list]

grid - GridView control

fields - indices of the fields being grouped

[Return value] - Whether to execute grouping. If false is returned, grouping is canceled.

Example:

gridView.onGrouping = function(grid, fields) {
 alert("onGrouping event occurred. Returns false.");
 return false;
};

onPageChanged

When the grid is in Paging state, a callback notifies that you have moved to another page.

Type - (grid: GridView, page: number) => void

Remarks:

[Parameter list]

grid - GridView control

page - index of the newly moved page

Example:

gridView.onPageChanged = function(grid, page) {
 if(page % 2 === 0) {
 console.log('even number changed!')
 }
};

onPageChanging

When the grid is in paging state, a callback that determines page movement.

Type - (grid: GridView, page: number) => boolean

Remarks:

[Parameter list]

grid - GridView control

page - index of the new page to be moved to

[Return value] - If false is returned, the page movement is canceled.

Example:

gridView.onPageChanging = function(grid, page) {
 if(page % 2 === 0) {
 return true;
 }
 return false;
};

onPageCountChanged

When the grid is in the Paging state, a callback notifies that you have moved to another page along with the number of pages that have changed.

Type - (grid: GridView, pageCount: number) => void

Remarks:

[Parameter list]

grid - GridView control

pageCount - Number of changed pages

Example:

gridView.onPageCountChanged = function(grid, pageCount) {
 console.log('pageCount: ' + pageCount);
};

Properties Desc

filterMode

Operation mode of filter after data modification

Type - FilterMode

Remarks:

If 'explicit' is used, filtering will only be performed if filtered data is modified explicitly.

Example:

gridView.filterMode = 'explicit';

filterOr

Whether to set the filter condition between columns to or.

Type - boolean

Remarks:

If set to true, filtering between filters for each column is reflected and displayed as an or condition.

Example:

gridView.filterOr = true;

groupingOptions

Setting information regarding row grouping set in the grid

Type - GroupingOptions

Remarks:

GroupingOptions Returns an object. You can get or set the properties of GroupingOptions.

Example:

gridView.groupingOptions.linear = true;

groupPanel

Group Panel model set in grid

Type - GroupPanel

Remarks:

Returns a GroupPanel object. You can get or set the properties of GroupPanel.

Example:

gridView.groupPanel.visible = true;

groupSummaryMode

How to calculate the sum of row grouped columns

Type - SummaryMode

Remarks:

It can be changed by assigning a value. Set to the value of SummaryMode.

Example:

gridView.groupSummaryMode = 'aggregate';

rowGroup

Rowgroup model set up in grid

Type - RowGroup

Remarks:

RowGroup Returns an object. You can get or set RowGroup properties.

Example:

gridView.rowGroup.mergeMode = true;

Method Desc

beginAppendRow

Add a new data row after the last data row in the grid.

[Parameter list]

data - DataValues

Default: null, data to be added to new row

[Return value] - number

Example:

gridView.beginAppendRow();

beginInsertRow

Creates a new data row before or after the data row entered as an index in the grid.

[Parameter List]

itemIndex - number

Default: -1, base data row. Creates a new data row before this row.

shift - boolean

Default: false, true: Create after data row.

data - DataValues

Default: null, data to be added to new row

[return value] - number

Remarks:

If the grid is in edit mode or there is no data, it will not be added. If itemIndex is not entered or -1 is entered, it will be created in the currently selected row.

Example:

gridView.beginInsertRow();

beginUpdateRow

Changes the data row corresponding to the entered index to edit status.

[Parameter List]

itemIndex - number

The index of the row. If not specified, focus row.

[Return Value] - void

Example:

gridView.beginUpdateRow();

collapse

지정한 itemIndex의 그룹을 접는다.

[매개변수 목록]

itemIndex - number

행의 인덱스

level - number

-1이면 선택된 행을 포함하는 그룹중 접혀있지 않은 그룹을 접는다. 1이상의 값이 입력되면 입력된 level에 해당하는 그룹을 접는다.

[반환값] - void

Remarks:

지정한 행이 row이거나 footer이면 행의 그룹을 접는다. 그룹이 접혀있는 경우 상위 그룹을 접는다.

collapseAll

Collapse the root group.

[Parameter List]

recursive - boolean

Default: false, Whether descendant groups included in the group are collapsed. When true, descendant groups included in the group are also in a collapsed state.

[Return Value] - void

Example:

gridView.collapseAll();

collapseGroup

Collapses the specified group.

[Parameter List]

itemIndex - number

Index on the grid for that group

recursive - boolean

Whether or not descendant groups included in the group are collapsed. When true, if the state is already collapsed, nothing is done.

force - boolean

Default value: false, whether descendants are collapsed when recursive is true even if they are already collapsed.

[Return Value] - void

Remarks:

If the specified item does not exist or is not a group, nothing happens.

Example:

gridView.collapseGroup(2, true);

collapseParent

Collapses the parent of the specified group.

[Parameter List]

itemIndex - number

Index on the grid for that group

recursive - boolean

Whether or not the descendant group included in the parent group is collapsed. When true, if the state is already collapsed, nothing is done.

force - boolean

Default value: false, whether the descendants of the parent group are collapsed when recursive is true even if they are already collapsed.

[Return Value] - void

Remarks:

If the specified item or its parent does not exist or is not a group, nothing happens.

Example:

gridView.collapseParent(2, true);

expand

지정한 행의 그룹을 펼친다.

[매개변수 목록]

itemIndex - number

행의 인덱스

level - number

level을 지정하면 해당 level까지 펼친다.

[반환값] - void

Remarks:

지정한 행이 그룹아이템이 아니면 상위 그룹을 펼친다.

expandAll

Expand the root group.

[Parameter List]

recursive - boolean

Default: false, Whether to expand descendant groups included in the group.

level - number

Default: undefined, undefined: If recursive is true, expand all descendants.

[Return Value] - void

Remarks:

When recursive is true, if you specify a level, it expands to that level.

Example:

gridView.expandAll();

expandGroup

Expands the specified group.

[Parameter List]

itemIndex - number

Index on the grid for that group

recursive - boolean

Whether to expand descendant groups included in the group

force - boolean

Default: false, whether to expand descendants when recursive is true even if they are already expanded

level - number

Default: 0, when 0, if recursive is true, all descendants are expanded.

[Return Value] - void

Remarks:

If the specified item does not exist or is not a group, nothing happens. When recursive is true, if you specify a level, it expands to that level.

Example:

gridView.expandGroup(2, true);

expandParent

Expands the parents of the specified group.

[Parameter List]

itemIndex - number

Index on the grid for that group

recursive - boolean

Whether to expand the descendant group included in the parent group

force - boolean

Default value: false, whether to expand the descendants of the parent group when recursive is true even if they are already expanded.

level - number

Default: 0, when 0, if recursive is true, expand all descendants.

[Return Value] - void

Remarks:

If the specified item or its parent does not exist or is not a group, nothing happens. When recursive is true, if you specify a level, it expands to that level.

Example:

gridView.expandParent(2, true);

getCheckedItems

Returns a list of checked items as an array.

[Parameter List]

rowOnly - boolean

Default: true, true: returns only rows, false: also returns non-data areas such as group footer

[return value] - number[]

Example:

let checkedItems = gridView.getCheckedItems();

getCheckedRows

Returns a list of checked data rows.

[Parameter List]

sort - boolean

Default: true, true: Returns in ascending order, false: Returns in the order they appear on the screen.

visibleOnly - boolean

Default value: false, If you enter true, rows that collapse or are not visible during paging are excluded.

allRows - boolean

Default value: false, If you enter true, checked rows of pages that are not visible during paging are also returned.

[return value] - number[]

Example:

let checkedRows = gridView.getCheckedRows();

getDataSource

Returns the DataProvider connected to the grid.

Example:

let ds = gridView.getDataSource();

getGroupFieldNames

Returns the names of grouped fields.

[Parameter List]

original - boolean

Default value: true, true: returns with the specified name, false: returns with uppercase letters.

[Return value] - string[] | number[]

Example:

let GFieldNames = gridView.getGroupFieldNames();

getGroupFields

Returns the indices of grouped fields.

Example:

let GFields = gridView.getGroupFields();

getGroupIndex

Returns the index of the group to which you belong.

[Parameter List]

itemIndex - number

index on grid

[return value] - number

Example:

let GIndex = gridView.getGroupIndex(2);

getGroupingOptions

Returns setting information regarding grid row grouping.

Example:

let groupingOpts = gridView.getGroupingOptions();
groupingOpts.prompt = "I am Group";
gridView.setGroupingOptions(groupingOpts);

getGroupLevel

Returns the group level of the specified field.

[Parameter List]

field - string | number

Field name or index

[return value] - number

Remarks:

The first group level is 1.

Example:

let Glevel = gridView.getGroupLevel('field1');

getGroupLevels

Returns what level it is currently grouped into.

Example:

let Glevels = gridView.getGroupLevels();

getGroupPanel

Returns GroupPanel of the grid.

Example:

let groupPanel = gridView.getGroupPanel();
groupPanel.visible = false;
gridView.setGroupPanel(groupPanel);

getGroupSummaryValue

The result value is retrieved from GroupFooter's expression or valueCallback.

[Parameter List]

model - GridItem

Item model information

column - string | DataColumn

column

summaryIndex - number

index of summary

[Return Value] - any | any[]

Remarks:

This is a value to which numberFormat, prefix, etc. have not been applied. If there are multiple selected footers, they are returned as an array.

getMergedItems

[Parameter List]

itemIndex - number

itemIndex of grid row

column - string

name of column

dataOnly - boolean

Whether to retrieve only data rows default true

force - boolean

true이면 merge된 셀이 아니어도 입력된 itemIndex를 포함하는 배열로 return한다. default true

[return value] - number[]

Remarks:

The itemIndex included in the merged cell is imported into an array.

Example:

let mergeItems = gridView.getMergedItems(1, "column", true, true);
let mergeDataRows = gridView.getRowsOfItems(mergeItems);

getOptions

Returns grid option information.

Remarks:

A grouping property is added to the model returned by GridBase.getOptions().

Example:

let options = gridView.getOptions();

getPage

Returns the current page number in paging mode.

Example:

let currPage = gridView.getPaging();

getPageCount

Returns the total number of pages when in paging mode.

Example:

let pageCount = gridView.getPageCount();

getPageOfDataRow

Find the page where the row is located.

[Parameter List]

dataRow - number

dataRow of the row you are looking for

[return value] - number

getRowGroup

Returns RowGroup of the grid.

Example:

let rowGroup = gridView.getRowGroup();
rowGroup.levelIndent = false;
gridView.setRowGroup(rowGroup);

groupBy

Row grouping is performed in the order included in the specified field list or in the order after sorting the data.

[Parameter List]

fieldNames - string[]

List of field names. If you want to ungroup, you must enter an empty array.

sorting - boolean

Sort or not

sortDir - SortDirection

[Return Value] - void

Example:

// group settings
gridView.groupBy(["field1", "field2"]);
 
// ungroup
gridView.groupBy([]);

isGrouped

Returns whether the grid is grouped.

Example:

let isGrouped = gridView.isGrouped();

isGroupItem

Returns whether the specified index is a group item.

[Parameter List]

itemIndex - number

index on grid

[return value] - boolean

Example:

let isGroupItem = gridView.isGroupItem(4);

isMergedGrouped

Returns whether the grid is in mergeMode.

Example:

let isMergedGrouped = gridView.isMergedGrouped();

isParentVisible

Returns whether the parent of the specified index is displayed.

[Parameter List]

itemIndex - number

index on grid

[return value] - boolean

Example:

let isParentVis = gridView.isParentVisible(2);

layoutCollapseAll

If expandable of the group layout is set, the group layout is collapsed.

[Parameter List]

recursive - boolean

If there are subgroups, collapse the subgroups as well.

[Return Value] - void

layoutExpandAll

If expandable is set for the group layout, the group layout is expanded.

[Parameter List]

recursive - boolean

If there are subgroups, expand the subgroups as well.

[Return Value] - void

populateMerges

Updates internal merge information when the value returned by DataColumn.mergeCallback changes.

[매개변수 목록]

refresh - boolean

true이면 내부 merge정보를 갱신후 그리드를 다시 그린다. default true

[반환값] - void

setGroupingOptions

Configure grid row grouping.

[Parameter List]

value - GroupingOptions

Information you want to set. It is the same model as GroupingOptions.

[Return Value] - void

Example:

gridView.setGroupingOptions({prompt: "I am Group"});

setGroupPanel

Set the grid GroupPanel.

[Parameter List]

value - GroupPanel

Information like GroupPanel. You only need to pass the property you want to change.

[Return Value] - void

Example:

gridView.setGroupPanel({visible: false});

setOptions

Reset grid option information.

[Parameter List]

options - ViewOptions

Setting information. The grouping property has been added to the same model as the value of GridBase's setOptions().

[Return Value] - void

Remarks:

Unlike getOptions, which returns only grid-level information, this method allows you to reset child components and other execution information at the same time.

Example:

let options = {
     summaryMode: 'aggregate',
     displayOptions: {
         columnResizable : false
     },
     grouping: {
         prompt: 'I am Groop'
     }
};
gridView.setOptions(options);

setPage

Specifies the page to display when in paging mode.

[Parameter List]

page - number

page number

startItem - number

Default: -1, index of the first row to display on this page. If it is -1, it is determined according to the page size specified in setPaging.

[Return Value] - void

Example:

gridView.setPage(4);

setPageCount

Change the number of paging.

[Parameter List]

count - number

New page count

[Return Value] - void

Example:

gridView.setPageCount(20);

setPaging

The grid runs in Paging mode.

[Parameter List]

paging - boolean

Paging mode when true

size - number

Default: 10, number of rows to display per page.

maxCount - number

Default: -1, maximum number of pages

[Return Value] - void

Example:

gridView.setPaging(true);

setRowGroup

Set RowGroup of the grid.

[Parameter List]

value - RowGroup | ConfigObject

RowGroup Setting information such as model. You only need to pass the property you want to change.

[Return Value] - void

Example:

gridView.setRowGroup({levelIndent: false});