Last date modified: 2026-Jul-14

ColumnsApi

API exposed in ITEM_LIST_MODIFY_COLUMNS event handler to modify columns metadata.

Methods

setCustomFormatter(columnName, formatterAction) ⇒ undefined
Sets custom formatter with the specified format action for the column.
setFilterDataSource(columnName, filterDataSource) ⇒ undefined
Sets custom filter data source to particular column.
setLinkFormatter(columnName, options) ⇒ undefined
Sets link formatter with the specified options for the column.
removeColumn(columnName) ⇒ undefined
Removes a specific column.
setColumnTitle(columnName, title) ⇒ undefined
Sets the title to specified column.

Properties Details

setCustomFormatter(columnName, formatterAction) ⇒ undefined

Sets custom formatter with the specified format action for the column.

Param Type Description
columnName String The name of the column on which to set the formatter set. The column name comes from the name of the Field in the View the item list is displaying.
formatterAction function Formatter action to execute on format call. It has the following parameters:
- content <String|Number> - the item list cell content to format.
- rowDataItem <Object> - the related data item for the row of data in the item list.

Example

Copy 
// Example 1
// Say we have item list row data of the format { "LinkName": "Google", "LinkUrl": "https://google.com" }
// and want to display only a single column in the table of link elements.
eventHandlers[eventNames.ITEM_LIST_MODIFY_COLUMNS] = function(columnsApi, view) {
    // Check for a specific a specific item list in the layout
    if (view.Name !== "Hyperlinks") { return ; }

    function cellContentFormatter(content, rowDataItem) {
        // content: "Google"
        // rowDataItem: { "LinkName": "Google", "LinkUrl": "https://google.com" }
        var anchor = document.createElement("a");
        anchor.innerText = content;
        anchor.href = rowDataItem["LinkUrl"];
        return anchor;
    }

    columnsApi.setCustomFormatter("LinkName", cellContentFormatter);
};

// Example 2
// Say we have item list row data of the format { "FirstName": "Salt", "LastName": "Pepper" }
// and want to display only a single column with the full name.
eventHandlers[eventNames.ITEM_LIST_MODIFY_COLUMNS] = function(columnsApi, view) {
    // Check for a specific a specific item list in the layout
    if (view.Name !== "Full Names") { return ; }

    function cellContentFormatter(content, rowDataItem) {
        // content: "Salt"
        // rowDataItem: { "FirstName": "Salt", "LastName": "Pepper" }return rowDataItem["FirstName"] + " " + rowDataItem["LastName"];
        return rowDataItem["FirstName"] + " " + rowDataItem["LastName"];
    }

    columnsApi.setCustomFormatter("FirstName", cellContentFormatter);
};

setFilterDataSource(columnName, filterDataSource) ⇒ undefined

Sets custom filter data source to particular column.

Param Type Description
columnName String Name of column.
filterDataSource Object Object containing data filter data source.

setLinkFormatter(columnName, options) ⇒ undefined

Sets link formatter with the specified options for the column.

Param Type Description
columnName String The name of the column on which to set the formatter. The column name comes from the name of the Field in the View the item list is displaying.
options Object Options of link formatter.
options.onClick function An action executed for an onclick event. It has the following parameters:
- rowDataItem <object> - A related data item.
- getContent <function> - Optional. A function expected to return a string value for the text of the link. If this is not defined, the value for the column in rowDataItem is used.

Example

Copy 
// Say we have item list row data of the format { "FirstName": "Salt", "LastName": "Pepper" } and
// want to display the first name as a link that, when clicked, shows an alert with the last name.
eventHandlers[eventNames.ITEM_LIST_MODIFY_COLUMNS] = function(columnsApi, view) {
    // Check for a specific a specific item list in the layout.
    if (view.Name !== "First Names") { return ; }

    function clickAction(rowDataItem) {    // onClick function is called with the row data item
        alert(rowDataItem["LastName"]);
    }

    columnsApi.setLinkFormatter("FirstName", {
        onClick: clickAction,
    });
};

removeColumn(columnName) ⇒ undefined

Removes a specific column.

Param Type Description
columnName String The name of the column to remove. The column name comes from the name of the Field in the View the item list is displaying.

Example

Copy 
// Say we have item list row data of the format { "FirstName": "Salt", "LastName": "Pepper" } and
// the View the item list uses displays both first and last names. However the item list in the
// layout should only show last names.
eventHandlers[eventNames.ITEM_LIST_MODIFY_COLUMNS] = function(columnsApi, view) {
    // Check for a specific a specific item list in the layout.
    if (view.Name !== "Names") {  return ; }

    columnsApi.removeColumn("FirstName");
}

setColumnTitle(columnName, title) ⇒ undefined

Sets the title to specified column.

Param Type Description
columnName String The name of the column on which to set the title. The column name comes from the name of the Field in the View the item list is displaying.
title String The title to set on the column.

Example

Copy 
eventHandlers[eventNames.ITEM_LIST_MODIFY_COLUMNS] = function(columnsApi, view) {
    // Check for a specific a specific item list in the layout
    if (view.ObjectTypeID !== convenienceApi.constants.ARTIFACT_TYPE.USER) { return ; }

    columnsApi.setColumnTitle("Preview Security", "Preview User Security");
};
Return to top of the page
Feedback