Table Javascript API

Example

Set the autoLoadState property.

 <smart-table auto-load-state></smart-table>

Set the autoLoadState property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.autoLoadState = false;

Get the autoLoadState property.

 const table = document.querySelector('smart-table');

 let autoLoadState = table.autoLoadState;

Example

Set the autoSaveState property.

 <smart-table auto-save-state></smart-table>

Set the autoSaveState property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.autoSaveState = false;

Get the autoSaveState property.

 const table = document.querySelector('smart-table');

 let autoSaveState = table.autoSaveState;

Example

Set the columnMinWidth property.

 <smart-table column-min-width='100'></smart-table>

Set the columnMinWidth property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.columnMinWidth = 20px;

Get the columnMinWidth property.

 const table = document.querySelector('smart-table');

 let columnMinWidth = table.columnMinWidth;

Example

Set the columnReorder property.

 <smart-table column-reorder></smart-table>

Set the columnReorder property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.columnReorder = false;

Get the columnReorder property.

 const table = document.querySelector('smart-table');

 let columnReorder = table.columnReorder;

Example

Set the columnResize property.

 <smart-table column-resize></smart-table>

Set the columnResize property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.columnResize = false;

Get the columnResize property.

 const table = document.querySelector('smart-table');

 let columnResize = table.columnResize;

Example

Set the columnResizeNormalize property.

 <smart-table column-resize-normalize></smart-table>

Set the columnResizeNormalize property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.columnResizeNormalize = false;

Get the columnResizeNormalize property.

 const table = document.querySelector('smart-table');

 let columnResizeNormalize = table.columnResizeNormalize;

Example

Set the columnResizeFeedback property.

 <smart-table column-resize-feedback></smart-table>

Set the columnResizeFeedback property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.columnResizeFeedback = false;

Get the columnResizeFeedback property.

 const table = document.querySelector('smart-table');

 let columnResizeFeedback = table.columnResizeFeedback;

Example

Set the columnMenu property.

 <smart-table column-menu></smart-table>

Set the columnMenu property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.columnMenu = true;

Get the columnMenu property.

 const table = document.querySelector('smart-table');

 let columnMenu = table.columnMenu;

Example

Set the columnSizeMode property.

 <smart-table column-size-mode='auto'></smart-table>

Set the columnSizeMode property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.columnSizeMode = 'default';

Get the columnSizeMode property.

 const table = document.querySelector('smart-table');

 let columnSizeMode = table.columnSizeMode;

Example

Set the conditionalFormattingButton property.

 <smart-table conditional-formatting-button></smart-table>

Set the conditionalFormattingButton property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.conditionalFormattingButton = false;

Get the conditionalFormattingButton property.

 const table = document.querySelector('smart-table');

 let conditionalFormattingButton = table.conditionalFormattingButton;

Example

Set the deferredScrollDelay property.

 <smart-table deferred-scroll-delay='1'></smart-table>

Set the deferredScrollDelay property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.deferredScrollDelay = 0;

Get the deferredScrollDelay property.

 const table = document.querySelector('smart-table');

 let deferredScrollDelay = table.deferredScrollDelay;

Example

Set the dataRowId property.

 <smart-table data-row-id='ID'></smart-table>

Set the dataRowId property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.dataRowId = 'uid';

Get the dataRowId property.

 const table = document.querySelector('smart-table');

 let dataRowId = table.dataRowId;

Example

Set the dataTransform property.

 <smart-table data-transform='dataTransformCallback'></smart-table>

Set the dataTransform property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.dataTransform = dataTransform;

Get the dataTransform property.

 const table = document.querySelector('smart-table');

 let dataTransform = table.dataTransform;

Example

Set the disabled property.

 <smart-table disabled></smart-table>

Set the disabled property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.disabled = false;

Get the disabled property.

 const table = document.querySelector('smart-table');

 let disabled = table.disabled;

Example

Set the editing property.

 <smart-table editing></smart-table>

Set the editing property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.editing = false;

Get the editing property.

 const table = document.querySelector('smart-table');

 let editing = table.editing;

Example

Set the editMode property.

 <smart-table edit-mode='row'></smart-table>

Set the editMode property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.editMode = 'cell';

Get the editMode property.

 const table = document.querySelector('smart-table');

 let editMode = table.editMode;

Example

Set the expandHierarchy property.

 <smart-table expand-hierarchy></smart-table>

Set the expandHierarchy property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.expandHierarchy = false;

Get the expandHierarchy property.

 const table = document.querySelector('smart-table');

 let expandHierarchy = table.expandHierarchy;

Example

Set the filtering property.

 <smart-table filtering></smart-table>

Set the filtering property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.filtering = false;

Get the filtering property.

 const table = document.querySelector('smart-table');

 let filtering = table.filtering;

Example

Set the filterRow property.

 <smart-table filter-row></smart-table>

Set the filterRow property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.filterRow = false;

Get the filterRow property.

 const table = document.querySelector('smart-table');

 let filterRow = table.filterRow;

Example

Set the filterOperator property.

 <smart-table filter-operator></smart-table>

Set the filterOperator property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.filterOperator = false;

Get the filterOperator property.

 const table = document.querySelector('smart-table');

 let filterOperator = table.filterOperator;

Example

Set the filterTemplate property.

 <smart-table filter-template='customFilterTemplate'></smart-table>

Set the filterTemplate property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.filterTemplate = 'myFilterTemplate';

Get the filterTemplate property.

 const table = document.querySelector('smart-table');

 let filterTemplate = table.filterTemplate;

Example

Set the footerRow property.

 <smart-table footer-row='customFooterRow'></smart-table>

Set the footerRow property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.footerRow = 'myFooterRow';

Get the footerRow property.

 const table = document.querySelector('smart-table');

 let footerRow = table.footerRow;

Example

Set the formulas property.

 <smart-table formulas></smart-table>

Set the formulas property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.formulas = false;

Get the formulas property.

 const table = document.querySelector('smart-table');

 let formulas = table.formulas;

Example

Set the freezeFooter property.

 <smart-table freeze-footer></smart-table>

Set the freezeFooter property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.freezeFooter = false;

Get the freezeFooter property.

 const table = document.querySelector('smart-table');

 let freezeFooter = table.freezeFooter;

Example

Set the freezeHeader property.

 <smart-table freeze-header></smart-table>

Set the freezeHeader property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.freezeHeader = false;

Get the freezeHeader property.

 const table = document.querySelector('smart-table');

 let freezeHeader = table.freezeHeader;

Example

Set the grouping property.

 <smart-table grouping></smart-table>

Set the grouping property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.grouping = false;

Get the grouping property.

 const table = document.querySelector('smart-table');

 let grouping = table.grouping;

Example

Set the headerRow property.

 <smart-table header-row='customHeaderRowTemplate'></smart-table>

Set the headerRow property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.headerRow = function (header) { header.classList.add('custom-style-header'); };

Get the headerRow property.

 const table = document.querySelector('smart-table');

 let headerRow = table.headerRow;

Example

Set the keyboardNavigation property.

 <smart-table keyboard-navigation></smart-table>

Set the keyboardNavigation property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.keyboardNavigation = false;

Get the keyboardNavigation property.

 const table = document.querySelector('smart-table');

 let keyboardNavigation = table.keyboardNavigation;

Example

Set the hideSelectionColumn property.

 <smart-table hide-selection-column></smart-table>

Set the hideSelectionColumn property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.hideSelectionColumn = false;

Get the hideSelectionColumn property.

 const table = document.querySelector('smart-table');

 let hideSelectionColumn = table.hideSelectionColumn;

Example

Set the loadColumnStateBehavior property.

 <smart-table load-column-state-behavior='implementationOnly'></smart-table>

Set the loadColumnStateBehavior property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.loadColumnStateBehavior = 'stateOnly';

Get the loadColumnStateBehavior property.

 const table = document.querySelector('smart-table');

 let loadColumnStateBehavior = table.loadColumnStateBehavior;

Example

Set the locale property.

 <smart-table locale='de'></smart-table>

Set the locale property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.locale = 'fr';

Get the locale property.

 const table = document.querySelector('smart-table');

 let locale = table.locale;

Example

Set the messages property.

 <smart-table messages='{"he":{"add":"הוסף תנאי","all":"כל העמודות","apply":"להגיש מועמדות","between":"בֵּין","cancel":"לְבַטֵל","clearFilter":"נקה את המסנן","close":"סגור","column":"טור:","condition":"מַצָב:","conditionalFormatting":"עיצוב מותנה","CONTAINS":"מכיל","CONTAINS_CASE_SENSITIVE":"מכיל (רגיש רישיות)","DOES_NOT_CONTAIN":"לא מכיל","DOES_NOT_CONTAIN_CASE_SENSITIVE":"לא מכיל (רגיש רישיות)","EMPTY":"ריק","ENDS_WITH":"נגמר עם","ENDS_WITH_CASE_SENSITIVE":"מסתיים ב (רגיש רישיות)","EQUAL":"שווה","EQUAL_CASE_SENSITIVE":"שווה (רגיש לרישיות","filterCondition":"מצב סינון","filterPlaceholder":"לְסַנֵן","firstButton":"ראשון","fontFamily":"משפחת גופן:","fontSize":"גודל גופן:","format":"פוּרמָט:","formatColumn":"עמוד עמוד","GREATER_THAN":"גדול מ","GREATER_THAN_OR_EQUAL":"גדול או שווה","greaterThan":"גדול מ","highlight":"שִׂיא","invalidValue":"ערך לא תקין","itemsPerPage":"פריטים לעמוד:","lastButton":"אחרון","LESS_THAN":"פחות מ","LESS_THAN_OR_EQUAL":"פחות מ או שווה","lessThan":"פחות מ","nextButton":"הַבָּא","NOT_EMPTY":"לא ריק","NOT_EQUAL":"לא שווה","NOT_NULL":"לא ריק","notEqual":"לא שווה ל","NULL":"null","ok":"בסדר","previousButton":"קודם","remove":"הסר את המצב","secondValue":"ערך שני:","STARTS_WITH":"מתחיל עם","STARTS_WITH_CASE_SENSITIVE":"מתחיל עם (רגיש רישיות)","summaryPrefix":"שֶׁל","text":"טֶקסט","value":"ערך:","with":"עם"}}'></smart-table>

Set the messages property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.messages = {"en":{"add":"Add condition","all":"All columns","apply":"Apply","between":"Between","cancel":"Cancel","clearFilter":"Clear filter","close":"Close","column":"Column:","condition":"Condition:","conditionalFormatting":"Conditional Formatting","CONTAINS":"contains","CONTAINS_CASE_SENSITIVE":"contains (case sensitive)","DOES_NOT_CONTAIN":"does not contain","DOES_NOT_CONTAIN_CASE_SENSITIVE":"does not contain (case sensitive)","EMPTY":"empty","ENDS_WITH":"ends with","ENDS_WITH_CASE_SENSITIVE":"ends with (case sensitive)","EQUAL":"equal","EQUAL_CASE_SENSITIVE":"equal (case sensitive)","filterCondition":"Filter condition","filterPlaceholder":"Filter","firstButton":"First","fontFamily":"Font family:","fontSize":"Font size:","format":"Format:","formatColumn":"Format Column","GREATER_THAN":"greater than","GREATER_THAN_OR_EQUAL":"greater than or equal","greaterThan":"Greater Than","highlight":"Highlight","invalidValue":"Invalid value","itemsPerPage":"Items per page:","lastButton":"Last","LESS_THAN":"less than","LESS_THAN_OR_EQUAL":"less than or equal","lessThan":"Less Than","nextButton":"Next","NOT_EMPTY":"not empty","NOT_EQUAL":"not equal","NOT_NULL":"not null","notEqual":"Not Equal To","NULL":"null","ok":"OK","previousButton":"Previous","remove":"Remove condition","secondValue":"Second value:","STARTS_WITH":"starts with","STARTS_WITH_CASE_SENSITIVE":"starts with (case sensitive)","summaryPrefix":"of","text":"Text","value":"Value:","with":"with"}};

Get the messages property.

 const table = document.querySelector('smart-table');

 let messages = table.messages;

Example

Set the onCellRender property.

 <smart-table on-cell-render='onCellRender'></smart-table>

Set the onCellRender property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.onCellRender = onCellRenderCallback;

Get the onCellRender property.

 const table = document.querySelector('smart-table');

 let onCellRender = table.onCellRender;

Example

Set the onColumnRender property.

 <smart-table on-column-render='onColumnRender'></smart-table>

Set the onColumnRender property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.onColumnRender = onColumnRenderCallback;

Get the onColumnRender property.

 const table = document.querySelector('smart-table');

 let onColumnRender = table.onColumnRender;

Example

Set the onInit property.

 <smart-table on-init='onInit'></smart-table>

Set the onInit property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.onInit = onInitCallback;

Get the onInit property.

 const table = document.querySelector('smart-table');

 let onInit = table.onInit;

Example

Set the pageSize property.

 <smart-table page-size='25'></smart-table>

Set the pageSize property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.pageSize = 50;

Get the pageSize property.

 const table = document.querySelector('smart-table');

 let pageSize = table.pageSize;

Example

Set the pageIndex property.

 <smart-table page-index='1'></smart-table>

Set the pageIndex property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.pageIndex = 7;

Get the pageIndex property.

 const table = document.querySelector('smart-table');

 let pageIndex = table.pageIndex;

Example

Set the paging property.

 <smart-table paging></smart-table>

Set the paging property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.paging = false;

Get the paging property.

 const table = document.querySelector('smart-table');

 let paging = table.paging;

Example

Set the rightToLeft property.

 <smart-table right-to-left></smart-table>

Set the rightToLeft property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.rightToLeft = true;

Get the rightToLeft property.

 const table = document.querySelector('smart-table');

 let rightToLeft = table.rightToLeft;

Example

Set the rowDetailTemplate property.

 <smart-table row-detail-template='
{{number}}
'></smart-table>

Set the rowDetailTemplate property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.rowDetailTemplate = '
{{name}}
';

Get the rowDetailTemplate property.

 const table = document.querySelector('smart-table');

 let rowDetailTemplate = table.rowDetailTemplate;

Example

Set the selected property.

 <smart-table selected='[5, 8, 9]'></smart-table>

Set the selected property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.selected = [0];

Get the selected property.

 const table = document.querySelector('smart-table');

 let selected = table.selected;

Example

Set the selection property.

 <smart-table selection></smart-table>

Set the selection property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.selection = false;

Get the selection property.

 const table = document.querySelector('smart-table');

 let selection = table.selection;

Example

Set the selectionMode property.

 <smart-table selection-mode='extended'></smart-table>

Set the selectionMode property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.selectionMode = 'many';

Get the selectionMode property.

 const table = document.querySelector('smart-table');

 let selectionMode = table.selectionMode;

Example

Set the selectionByHierarchy property.

 <smart-table selection-by-hierarchy></smart-table>

Set the selectionByHierarchy property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.selectionByHierarchy = false;

Get the selectionByHierarchy property.

 const table = document.querySelector('smart-table');

 let selectionByHierarchy = table.selectionByHierarchy;

Example

Set the sort property.

 <smart-table sort='sort'></smart-table>

Set the sort property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.sort = sortCallback;

Get the sort property.

 const table = document.querySelector('smart-table');

 let sort = table.sort;

Example

Set the sortMode property.

 <smart-table sort-mode='one'></smart-table>

Set the sortMode property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.sortMode = 'many';

Get the sortMode property.

 const table = document.querySelector('smart-table');

 let sortMode = table.sortMode;

Example

Set the stateSettings property.

 <smart-table state-settings='['columns', 'expanded', 'selected']'></smart-table>

Set the stateSettings property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.stateSettings = ['columns', 'filtered'];

Get the stateSettings property.

 const table = document.querySelector('smart-table');

 let stateSettings = table.stateSettings;

Example

Set the theme property.

 <smart-table theme='dark'></smart-table>

Set the theme property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.theme = 'red';

Get the theme property.

 const table = document.querySelector('smart-table');

 let theme = table.theme;

Example

Set the tooltip property.

 <smart-table tooltip></smart-table>

Set the tooltip property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.tooltip = false;

Get the tooltip property.

 const table = document.querySelector('smart-table');

 let tooltip = table.tooltip;

Example

Set the virtualization property.

 <smart-table virtualization></smart-table>

Set the virtualization property by using the HTML Element's instance.

 const table = document.querySelector('smart-table');

 table.virtualization = false;

Get the virtualization property.

 const table = document.querySelector('smart-table');

 let virtualization = table.virtualization;

Example

Set up the event handler of cellBeginEdit event.

const table = document.querySelector('smart-table');
table.addEventListener('cellBeginEdit', function (event) {
    const detail = event.detail,
        id = detail.id,
        dataField = detail.dataField,
        row = detail.row,
        value = detail.value;

	// event handling code goes here.
})

Example

Set up the event handler of cellClick event.

const table = document.querySelector('smart-table');
table.addEventListener('cellClick', function (event) {
    const detail = event.detail,
        id = detail.id,
        dataField = detail.dataField,
        row = detail.row,
        value = detail.value,
        originalEvent = detail.originalEvent;

	// event handling code goes here.
})

Example

Set up the event handler of cellEndEdit event.

const table = document.querySelector('smart-table');
table.addEventListener('cellEndEdit', function (event) {
    const detail = event.detail,
        id = detail.id,
        dataField = detail.dataField,
        row = detail.row,
        value = detail.value;

	// event handling code goes here.
})

Example

Set up the event handler of change event.

const table = document.querySelector('smart-table');
table.addEventListener('change', function (event) {
    const detail = event.detail,
        type = detail.type;

	// event handling code goes here.
})

Example

Set up the event handler of collapse event.

const table = document.querySelector('smart-table');
table.addEventListener('collapse', function (event) {
    const detail = event.detail,
        id = detail.id,
        record = detail.record;

	// event handling code goes here.
})

Example

Set up the event handler of expand event.

const table = document.querySelector('smart-table');
table.addEventListener('expand', function (event) {
    const detail = event.detail,
        id = detail.id,
        record = detail.record;

	// event handling code goes here.
})

Example

Set up the event handler of columnClick event.

const table = document.querySelector('smart-table');
table.addEventListener('columnClick', function (event) {
    const detail = event.detail,
        dataField = detail.dataField;

	// event handling code goes here.
})

Example

Set up the event handler of closeColumnMenu event.

const table = document.querySelector('smart-table');
table.addEventListener('closeColumnMenu', function (event) {
    const detail = event.detail,
        dataField = detail.dataField;

	// event handling code goes here.
})

Example

Set up the event handler of columnResize event.

const table = document.querySelector('smart-table');
table.addEventListener('columnResize', function (event) {
    const detail = event.detail,
        dataField = detail.dataField,
        headerCellElement = detail.headerCellElement,
        width = detail.width;

	// event handling code goes here.
})

Example

Set up the event handler of filter event.

const table = document.querySelector('smart-table');
table.addEventListener('filter', function (event) {
    const detail = event.detail,
        action = detail.action,
        filters = detail.filters;

	// event handling code goes here.
})

Example

Set up the event handler of group event.

const table = document.querySelector('smart-table');
table.addEventListener('group', function (event) {
    const detail = event.detail,
        action = detail.action,
        dataField = detail.dataField,
        label = detail.label,
        path = detail.path;

	// event handling code goes here.
})

Example

Set up the event handler of openColumnMenu event.

const table = document.querySelector('smart-table');
table.addEventListener('openColumnMenu', function (event) {
    const detail = event.detail,
        dataField = detail.dataField;

	// event handling code goes here.
})

Example

Set up the event handler of page event.

const table = document.querySelector('smart-table');
table.addEventListener('page', function (event) {
    const detail = event.detail,
        action = detail.action;

	// event handling code goes here.
})

Example

Set up the event handler of rowBeginEdit event.

const table = document.querySelector('smart-table');
table.addEventListener('rowBeginEdit', function (event) {
    const detail = event.detail,
        id = detail.id,
        row = detail.row;

	// event handling code goes here.
})

Example

Set up the event handler of rowEndEdit event.

const table = document.querySelector('smart-table');
table.addEventListener('rowEndEdit', function (event) {
    const detail = event.detail,
        id = detail.id,
        row = detail.row;

	// event handling code goes here.
})

Example

Set up the event handler of sort event.

const table = document.querySelector('smart-table');
table.addEventListener('sort', function (event) {
    const detail = event.detail,
        columns = detail.columns,
        sortDataFields = detail.sortDataFields,
        sortOrders = detail.sortOrders,
        sortDataTypes = detail.sortDataTypes,
        type = detail.type;

	// event handling code goes here.
})

Invoke the addRow method.

const table = document.querySelector('smart-table');
table.addRow({"firstName":"Peter","lastName":"Fuller"});

Invoke the addFilter method.

const table = document.querySelector('smart-table');
table.addFilter("'firstName', filterGroup");

Invoke the addGroup method.

const table = document.querySelector('smart-table');
table.addGroup("firstName");

Invoke the beginEdit method.

const table = document.querySelector('smart-table');
table.beginEdit("3, 'lastName'");

Invoke the beginUpdate method.

const table = document.querySelector('smart-table');
table.beginUpdate();

Invoke the cancelEdit method.

const table = document.querySelector('smart-table');
table.cancelEdit();

Invoke the clearFilters method.

const table = document.querySelector('smart-table');
table.clearFilters();

Invoke the clearGrouping method.

const table = document.querySelector('smart-table');
table.clearGrouping();

Invoke the clearSelection method.

const table = document.querySelector('smart-table');
table.clearSelection();

Invoke the clearSort method.

const table = document.querySelector('smart-table');
table.clearSort();

Invoke the collapseAllRows method.

const table = document.querySelector('smart-table');
table.collapseAllRows();

Invoke the collapseAllGroups method.

const table = document.querySelector('smart-table');
table.collapseAllGroups();

Invoke the collapseAllRowDetails method.

const table = document.querySelector('smart-table');
table.collapseAllRowDetails();

Invoke the collapseGroup method.

const table = document.querySelector('smart-table');
table.collapseGroup("1.2");

Invoke the collapseRow method.

const table = document.querySelector('smart-table');
table.collapseRow(11);

Invoke the disableSelect method.

const table = document.querySelector('smart-table');
table.disableSelect(2);

Invoke the enableSelect method.

const table = document.querySelector('smart-table');
table.enableSelect(2);

Invoke the endEdit method.

const table = document.querySelector('smart-table');
table.endEdit();

Invoke the endUpdate method.

const table = document.querySelector('smart-table');
table.endUpdate();

Invoke the expandAllRows method.

const table = document.querySelector('smart-table');
table.expandAllRows();

Invoke the expandAllGroups method.

const table = document.querySelector('smart-table');
table.expandAllGroups();

Invoke the expandAllRowDetails method.

const table = document.querySelector('smart-table');
table.expandAllRowDetails();

Invoke the expandGroup method.

const table = document.querySelector('smart-table');
table.expandGroup("1.2");

Invoke the expandRow method.

const table = document.querySelector('smart-table');
table.expandRow(8);

Invoke the exportData method.

const table = document.querySelector('smart-table');
const result = table.exportData("html","my-table");

Invoke the getSelection method.

const table = document.querySelector('smart-table');
const result = table.getSelection();

Invoke the getState method.

const table = document.querySelector('smart-table');
const result = table.getState("");

Invoke the getValue method.

const table = document.querySelector('smart-table');
const result = table.getValue("3, 'lastName'");

Invoke the getColumnProperty method.

const table = document.querySelector('smart-table');
const result = table.getColumnProperty("firstName","width");

Invoke the isGroupExpanded method.

const table = document.querySelector('smart-table');
const result = table.isGroupExpanded("1.2");

Invoke the loadState method.

const table = document.querySelector('smart-table');
table.loadState();

Invoke the navigateTo method.

const table = document.querySelector('smart-table');
table.navigateTo();

Invoke the refresh method.

const table = document.querySelector('smart-table');
table.refresh();

Invoke the removeFilter method.

const table = document.querySelector('smart-table');
table.removeFilter();

Invoke the removeGroup method.

const table = document.querySelector('smart-table');
table.removeGroup();

Invoke the removeRow method.

const table = document.querySelector('smart-table');
table.removeRow(1);

Invoke the saveState method.

const table = document.querySelector('smart-table');
const result = table.saveState("");

Invoke the select method.

const table = document.querySelector('smart-table');
table.select(2);

Invoke the setValue method.

const table = document.querySelector('smart-table');
table.setValue("3, 'lastName', 'Green'");

Invoke the sortBy method.

const table = document.querySelector('smart-table');
table.sortBy("firstName");

Invoke the setColumnProperty method.

const table = document.querySelector('smart-table');
table.setColumnProperty("firstName","width","300");

Invoke the updateRow method.

const table = document.querySelector('smart-table');
table.updateRow(3,{"firstName":"Peter","lastName":"Fuller"});

Invoke the unselect method.

const table = document.querySelector('smart-table');
table.unselect(5);