Skip to main content
Version: v3

Table Columns

Table Columns are added to Rancher via the addTableColumn method.

addTableColumn

(Rancher version v2.7.2)

This method adds a table column to a ResourceTable element-based table on the UI.

Method:

plugin.addTableColumn(where: String, when: LocationConfig, column: TableColumn);

Arguments

where string parameter admissible values for this method:

KeyTypeDescription
TableColumnLocation.RESOURCEStringLocation for a table column on a Resource List View page

when Object admissible values:

LocationConfig as described above for the LocationConfig object.

(From Rancher version v2.13.0)

An addition parameter can be provided which will be used to support the column when server-side pagination is enabled. For more information and other changes required to server-side pagination see here.

(From Rancher version v2.14.0)

when adding a new column to a table on Rancher Dashboard, the default is for the table column to be added just before the Age column.

There's a new property in the configuration object called weight, on which you can specify in which position you want to add the column to. Position 0 will be the first in the table columns order.

plugin.addTableColumn(where: String, when: LocationConfig, column: TableColumn, paginationColumn?: PaginationTableColumn);

TableColumnLocation.RESOURCE column

Table Col

column config object. Admissible parameters for the column with 'TableColumnLocation.RESOURCE' are:

KeyTypeDescription
nameStringLabel for column
weight (From Rancher version v2.14.0)IntOrder/position of the table column added inside a table
labelKeyStringSame as "name" but allows for translation. Will supersede "name"
valueStringObject property to obtain the value from
getValueFunctionSame as "value", but it can be a function. Will supersede "value"
widthIntColumn width (in px). Optional
sortboolean,string,ArrayObject properties to be bound to the table sorting. Optional
searchboolean,string,ArrayObject properties to be bound to the table search. Optional
formatterstringName of a formatter component used to render the cell. Components should be in the extension formatters folder
formatterOptsanyProvide additional values to the formatter component via a formatterOpts component param

Usage example for 'TableColumnLocation.RESOURCE':

plugin.addTableColumn(
TableColumnLocation.RESOURCE,
{ resource: ['configmap'] },
{
name: 'some-prop-col',
labelKey: 'generic.comingSoon',
weight: 2,
getValue: (row: any) => {
return `${ row.id }-DEMO-COL-STRING-ADDED!`;
},
width: 100,
sort: ['stateSort', 'nameSort'],
search: ['stateSort', 'nameSort'],
}
);