Version 3.16.0
Show:

DataTable.BodyView.Formatters Class

Registry of function producing cell formatting functions. Allows for names to be used in the column definition formatter property:

{key:"myColumn", formatter:"date"}

These functions are not meant to be used directly. Instead, they will be automatically called when their names are used as values for the formatter property in a columnd definition. They will be called just once per rendering cycle and will receive the column configuration. They are expected to return a function that will then be called once per row and will do the actual formatting. They are expected to do all the preparatory once-per-render work so that the actual formatting function doesn't need to repeat it.

Item Index

Methods

Properties

Methods

_createTFootNode

() Node protected

Provided by the datatable-foot module.

Defined in datatable/js/foot.js:77

Available since 3.11.0

Creates the <tfoot> node that will store the footer rows and cells.

Returns:

Node:

_date

(
  • format
)
Function private static

Returns a date formatting function based on the given format.

Parameters:

  • format String

    The format spec definition.

Returns:

Function: A formatter function that formats numerical data as currency.

boolean

(
  • col
)
Function static

Returns a formatter function that returns the texts "true" or "false" and assigns the CSS classNames yui3-datatable-true or yui3-datatable-false based on the value of the cell.

If either a booleanLabels configuration object is defined for the column or a booleanLabels configuration attribute is defined for the datatable, the formatter will use the values for the properties true or false of either of those objects as the text to show.

It returns nulls or undefineds unchanged so that the emptyCellValue configuration attribute will eventually apply.

 {key:"active", formatter: "boolean", booleanLabels: {
     "true": "yes",
     "false": "no"
 }}

Parameters:

  • col Object

    The column definition.

Returns:

Function: A formatter function that formats boolean data.

button

(
  • col
)
Function static

Returns a formatter that produces a BUTTON element using the value of the buttonLabel column definition attribute as its label or the text Click if not found.

Applies the CSS className yui3-datatable-button to the cell.

Parameters:

  • col Object

    The column definition.

Returns:

Function: A formatter function that produces a <button> element.

currency

(
  • col
)
Function static

Returns a formatter function that formats values as currency using the Number.format method. It looks for the format to apply in the currencyFormat property of the column or in the currencyFormat attribute of the whole table.

{key: "amount", formatter: "currency", currencyFormat: {
    decimalPlaces:2,
    decimalSeparator: ",",
    thousandsSeparator: ".",
    suffix: "&euro;"
}}

See Number.format for the available format specs.

Anything that cannot be parsed as a number will be returned unchanged.

Applies the CSS className yui3-datatable-currency to the cell.

Parameters:

  • col Object

    The column definition.

Returns:

Function: A formatter function that formats numerical data as currency.

date

(
  • col
)
Function static

Returns a date formatting function. It looks for the format to apply in the dateFormat property of the column or in the dateFormat attribute of the whole table.

{key: "DOB", formatter: "date", dateFormat: "%I:%M:%S %p"}

See Date.format for the available format specs.

Anything that is not a date is returned unchanged.

Applies the CSS className yui3-datatable-date to the cell.

Parameters:

  • col Object

    The column definition.

Returns:

Function: A formatter function that formats dates.

email

(
  • col
)
Function static

Returns a function that produces email links. If the column definition contains a property linkFrom it will use the value in that field for the link, otherwise, the same column value will be used for both link and text.

{key: "contact", formatter: "email", linkFrom: "contactEmail"}

It will use the respective emptyCellValue column configuration attribute for each of the value and the link if either is empty. If the link value is still empty, it will return the value with no link.

Applies the CSS className yui3-datatable-email to the cell.

Parameters:

  • col Object

    The column definition.

Returns:

Function: A formatter function that adds a mailto: link to the value.

getClassName

(
  • token
)
String protected

Provided by the datatable-foot module.

Defined in datatable/js/foot.js:27

Available since 3.11.0

Returns the generated CSS classname based on the input. If the host attribute is configured, it will attempt to relay to its getClassName or use its static NAME property as a string base.

If host is absent or has neither method nor NAME, a CSS classname will be generated using this class's NAME.

Parameters:

  • token String multiple

    Any number of token strings to assemble the classname from.

Returns:

initializer

(
  • config
)
protected

Provided by the datatable-foot module.

Defined in datatable/js/foot.js:91

Available since 3.11.0

Initializes the instance. Reads the following configuration properties:

  • host - The object to serve as source of truth for column info

Parameters:

  • config Object

    Configuration data

localDate

() Function static

Returns a date-only (no time part) formatting function using the current locale.

{key: "DOB", formatter: "localDate"}

Anything that is not a date is returned unchanged.

Applies the CSS className yui3-datatable-date to the cell.

Returns:

Function: A formatter function that formats dates.

localDateTime

() Function static

Returns a date formatting function using the current locale.

{key: "DOB", formatter: "localDateTime"}

Anything that is not a date is returned unchanged.

Applies the CSS className yui3-datatable-date to the cell.

Returns:

Function: A formatter function that formats dates.

localTime

() Function static

Returns a time-only (no date part) formatting function using the current locale.

{key: "startTime", formatter: "localTime"}

Anything that is not a date is returned unchanged.

Applies the CSS className yui3-datatable-date to the cell.

Returns:

Function: A formatter function that formats dates.

lookup

(
  • col
)
Function static

Returns a formatter function that returns texts from a lookup table based on the stored value.

It looks for the translation to apply in the lookupTable property of the column in either of these two formats:

{key: "status", formatter: "lookup", lookupTable: {
    0: "unknown",
    1: "requested",
    2: "approved",
    3: "delivered"
}},
{key: "otherStatus", formatter: "lookup", lookupTable: [
    {value:0, text: "unknown"},
    {value:1, text: "requested"},
    {value:2, text: "approved"},
    {value:3, text: "delivered"}
]}

Applies the CSS className yui3-datatable-lookup to the cell.

Parameters:

  • col Object

    The column definition

Returns:

Function: A formatter function that returns the text associated with value.

number

(
  • col
)
Function static

Returns a formatter function that formats values using the Number.format method. It looks for the format to apply in the numberFormat property of the column or in the numberFormat attribute of the whole table.

 {key: "weight", formatter: "number", numberFormat: {
     decimalPlaces:2,
     decimalSeparator: ",",
     thousandsSeparator: ",",
     suffix: "kg"
 }}

See Number.format for the available format specs.

Anything that cannot be parsed as a number will be returned unchanged.

Applies the CSS className yui3-datatable-number to the cell.

Parameters:

  • col Object

    The column definition.

Returns:

Function: A formatter function that formats numerical data as currency.

render

() FooterView chainable

Provided by the datatable-foot module.

Defined in datatable/js/foot.js:58

Available since 3.11.0

Creates the <tfoot> Node and inserts it after the <thead> Node.

Returns:

FooterView: The instance

Properties

TFOOT_TEMPLATE

String

Provided by the datatable-foot module.

Defined in datatable/js/foot.js:15

Available since 3.11.0

HTML templates used to create the <tfoot> containing the table footers.

Default: '<tfoot class="{className}"/>'