FusionGrid Methods

FusionGrid offers a wide variety of methods for controlling and styling your grids. Find the comprehensive list of methods below.

Layout and Viewport

grid.getLayout(property)

Returns the layout that is currently applied. If a parameter is not provided, the entire layout object, with layout type, density, and template, is returned. In addition, if any specific property is mentioned in the parameters, that specific property value is returned.

grid.getLayout('type')
> 'row'COPY

grid.setLayout(config)

Users can set one or more properties of the current layout.

grid.setLayout({
    type: 'row',
    density: 'compact'
});COPY

grid.getAllViewports()

Returns all viewports, both the pre-set ones and any custom viewport.

grid.getCurrentViewport()

Returns the currently applied viewport.

grid.addViewport(viewportName, config)

Adds a new viewport. If the name matches an existing viewport, then the viewport is updated with the new configuration.

grid.addViewport('mobile-landscape', {
    minWidth: 400,
    maxWidth: 600,
    config: {
        layout: {
            type: 'row',
            density: 'compact'
        }
    }   
});COPY

grid.enableAutoViewportSwitch()

Enables automatic switching of viewport.

grid.disableAutoViewportSwitch()

Disables automatic switching of viewport.

grid.sizeColumnsToFit()

Call this method to resize the grid columns to fit the container automatically.

grid.sizeColumnsToContent([[columns]])

Call this method to automatically resize the grid columns according to the cell content. Calling this method without any parameter results in resizing of all columns. If a user wants to resize one or more particular columns specifically, column indices must be passed as an array.

Rows and Columns

grid.getColumns(index)

Get column configuration based on column index. If column index is not provided, then all the columns configurations will be returned.

grid.getColumns(1); // returns column object with index 1COPY

grid.setColumns([array of columns])

Set the columns in a grid. All the columns provided as an argument will get overridden.

var newColumns = [
 { field: 'Rank', width: '70px', },
 { field: "Make", headerText: "Make" }
];
grid.setColumns(newColumns);COPY

grid.getRowOptions(property)

Get row options. If the parameters are left blank, then all row options are returned. Otherwise, individual property values are returned.

grid.getRowOptions('rowHeight')COPY

grid.setRowOptions(key, value)/grid.setRowOptions(object)

Set any row options. There are 2 ways to use this API.

grid.setRowOptions('height', '75px');COPY

grid.setRowOptions({
    height: '75px'
});COPY

We recommend the second method to update multiple properties at once.

Data

grid.getDataTable()

Gets the DataTable currently used in the grid.

setDataTable(dataTable)

Sets the data source of the grid. This data source is essentially a DataTable.

Pagination

grid.getPagination(property)

Gets pagination. If users call this method without any set parameters, then the entire pagination object is returned. Otherwise, individual property can be retrieved.

grid.setPagination(object or key,value)

Set pagination property using this method. You can use either the string-based key-value approach or simply pass the pagination object.

grid.setPagination('showTotal', true);
grid.setPagination({ showTotal: true });COPY

grid.getPageSize()

It shows how many rows are shown per page.

grid.setPageSize(pageSize)

Sets the size of a page.

grid.getCurrentPage()

Gets the index of the current page.

grid.getTotalPages()

Returns the total number of pages in the grid.

grid.getRowCount()

Returns the total number of rows in grid.

grid.jumpToPage(pageNumber)

Jumps to a specific page. Suppose the page number is higher than the total number of pages the last page loads.

grid.jumpToNextPage()

Jumps to next page.

grid.jumpToPreviousPage()

Jumps to the previous page.

grid.jumpToFirstPage()

Goes directly to the first page.

grid.jumpToLastPage()

Goes to the last page.

More Methods

grid.selectAllRows()

Selects all rows, even rows that are not visible due to pagination. Rows that are filtered out are not selected.

grid.deselectAllRows()

Deselects all rows.

grid.selectRows([array of rowIndex])

Selects specific rows by row index.

grid.deselectRows([array of rowIndex])

Deselects specific rows by row index.

grid.getSelectedRows()

Gets all selected rows.

grid.filter(any fusiondatastore filter operators)

Filters the grid.

grid.sort(fusiondatastore sort operator)

Sorts the grid.

grid.on(eventName, listener)

Adds an event listener.

grid.off(eventName, listener)

Removes an event listener.

grid.trigger(eventName)

Triggers and event through the grid.

grid.dispose()

Disposes of the grid by releasing all resources and disposing of all DOM.