import Grid from 'kqwebmap-project/src_en/ui/Grid.js'

public class | source

Grid

Represents a ui Grid

See:

./manual/Grid.html

Constructor Summary

Public Constructor
public	constructor(id: String, options: Object) Constructor

Method Summary

Public Methods
public	clearSelection(): Null Clears the currently selected table rows or cells
public	dataItem(row: Object): Object Returns the data item to which the specified table row is bound.
public	items(): Array Obtains an Array of the DOM elements, which correspond to the data items.
public	select(rows: Object): Object Gets or sets the table rows (or cells) which are selected.
public	setDataSource(dataSource: Array): Null Sets the data source of the widget.
public	setOptions(options: Object): Null Sets the data source of the widget.

Public Constructors

public constructor(id: String, options: Object) source

Constructor

Params:

Name	Type	Attribute	Description
id	String		grid id
options	Object		config params
options.allowCopy	Boolean		if set to true and selection of the Grid is enabled the user could copy the selection into the clipboard.
options.columns	Array		the configuration of the grid columns. An array of JavaScript objects or strings.
options.columns.attributes	Object		HTML attributes of the table cell (<td>) rendered for the column.
options.columns.field	String		the field to which the column is bound, the value of this field is displayed in the column's cells during data binding
options.columns.headerAttributes	Object		HTML attributes of the column header, the grid renders a table header cell (<th>) for every column.
options.columns.minResizableWidth	Number		the pixel screen width below which the user will not be able to resize the column via the UI.
options.columns.selectable	Boolean		if set to true the grid will render a select column with checkboxes in each cell, thus enabling multi-row selection, the header checkbox allows users to select/deselect all the rows on the current page.
options.columns.title	String		the text that is displayed in the column header cell. If not set the field is used.
options.columns.width	Number		the width of the column, numeric values are treated as pixels.
options.dataSource	Array		the data source of the widget which is used render table rows,can be a JavaScript object which represents a valid data source configuration, a JavaScript array
options.height	Number		the height of the grid, numeric values are treated as pixels.
options.pageable	Boolean \| Object		if set to true the grid will display a pager, by default paging is disabled, can be set to a JavaScript object which represents the pager configuration.
options.pageable.pageSize	Number		if set to true the grid will display a pager, by default paging is disabled, can be set to a JavaScript object which represents the pager configuration.
options.pageable.pageSizes	Array		display a drop-down which allows the user to pick a page size, by default the page size drop-down is not displayed.
options.pageable.refresh	Boolean		if set to true the pager will display the refresh button, clicking the refresh button will refresh the grid, by default the refresh button is not displayed.
options.pageable.info	Boolean		if set to true the pager will display information about the current page and total number of data items, by default the paging information is displayed.
options.pageable.messages	Object		the text messages displayed in pager, use this option to customize or localize the pager messages.
options.pageable.messages.display	String		the pager info text. Contains three placeholders: {0} - the first data item index {1} - the last data item index {2} - the total number of data items
options.pageable.messages.empty	String		the text displayed when the grid is empty.
options.pageable.messages.first	String		the tooltip of the button which goes to the first page.
options.pageable.messages.last	String		the tooltip of the button which goes to the last page.
options.pageable.messages.next	String		the Tooltip of the button which goes to the next page.
options.pageable.messages.previous	String		the Tooltip of the button which goes to the previous page.
options.pageable.messages.refresh	String		the Tooltip of the refresh button.
options.resizable	Boolean		if set to true, users can resize columns by dragging the edges (resize handles) of their header cells.
options.scrollable	Boolean		if set to true the grid will display a scrollbar when the total row height (or width) exceeds the grid height (or width), by default scrolling is enabled.
options.selectable	Boolean \| String		if set to true the user would be able to select grid rows， by default selection is disabled. Can also be set to the following string values: "row" - the user can select a single row. "cell" - the user can select a single cell. "multiple, row" - the user can select multiple rows. "multiple, cell" - the user can select multiple cells.
options.change	function(e: Object): null		fired when the user selects a table row or cell in the grid.

Public Methods

public clearSelection(): Null source

Clears the currently selected table rows or cells

Return:

Null

public dataItem(row: Object): Object source

Returns the data item to which the specified table row is bound.

Params:

Name	Type	Attribute	Description
row	Object		A string, DOM element or jQuery object which represents the table row. A string is treated as a jQuery selector.

Return:

Object

public items(): Array source

Obtains an Array of the DOM elements, which correspond to the data items.

Return:

Array

The currently rendered data table rows (<tr> elements).

public select(rows: Object): Object source

Gets or sets the table rows (or cells) which are selected.

Params:

Name	Type	Attribute	Description
rows	Object		A string, DOM element or jQuery object which represents the table row(s) or cell(s). A string is treated as a jQuery selector.

Return:

Object

jQuery the selected table rows or cells.

public setDataSource(dataSource: Array): Null source

Sets the data source of the widget.

Params:

Name	Type	Attribute	Description
dataSource	Array		The data source to which the widget should be bound.

Return:

Null

public setOptions(options: Object): Null source

Sets the data source of the widget.

Params:

Name	Type	Attribute	Description
options	Object		The configuration options to be set.

Return:

Null