Ext.util.Format
Files
This class is a centralized place for formatting functions. It includes functions to format various different types of data, such as text, dates and numeric values.
Localization This class contains several options for localization. These can be set once the library has loaded, all calls to the functions from that point will use the locale settings that were specified. Options include: - thousandSeparator - decimalSeparator - currenyPrecision - currencySign - currencyAtEnd This class also uses the default date format defined here: Ext.Date.defaultFormat.
Using with renderers There are two helper functions that return a new function that can be used in conjunction with grid renderers:
columns: [{
dataIndex: 'date',
renderer: Ext.util.Format.dateRenderer('Y-m-d')
}, {
dataIndex: 'time',
renderer: Ext.util.Format.numberRenderer('0.000')
}]
Functions that only take a single argument can also be passed directly:
columns: [{
dataIndex: 'cost',
renderer: Ext.util.Format.usMoney
}, {
dataIndex: 'productCode',
renderer: Ext.util.Format.uppercase
}]
Using with XTemplates XTemplates can also directly use Ext.util.Format functions:
new Ext.XTemplate([
'Date: {startDate:date("Y-m-d")}',
'Cost: {cost:usMoney}'
]);
Available since: 1.1.0
Properties
This may be set to true to make the currency function
append the currency sign to the formatted value.
This may be overridden in a locale file.
Defaults to: false
Available since: 4.0.0
The number of decimal places that the currency function displays.
This may be overridden in a locale file.
Defaults to: 2
Available since: 4.0.0
The currency sign that the currency function displays.
This may be overridden in a locale file.
Defaults to: '$'
Available since: 4.0.0
The character that the number function uses as a decimal point.
This may be overridden in a locale file.
Defaults to: '.'
Available since: 4.0.0
The character that the number function uses as a thousand separator.
This may be overridden in a locale file.
Defaults to: ','
Available since: 4.0.0
Methods
Alias for Ext.String.capitalize.
Capitalize the given string
Available since: 1.1.0
Parameters
- string : String
Returns
Format a number as a currency
Available since: 4.0.0
Parameters
- value : Number/String
The numeric value to format
- sign : String
The currency sign to use (defaults to currencySign)
- decimals : Number
The number of decimals to use for the currency (defaults to currencyPrecision)
- end : Boolean
True if the currency sign should be at the end of the string (defaults to currencyAtEnd)
Returns
- String
The formatted currency string
Formats the passed date using the specified format pattern.
Available since: 1.1.0
Parameters
- value : String/Date
The value to format. If a string is passed, it is converted to a Date by the Javascript Date object's parse() method.
- format : String (optional)
Any valid date format string. Defaults to Ext.Date.defaultFormat.
Returns
- String
The formatted date string.
Returns a date rendering function that can be reused to apply a date format multiple times efficiently
Available since: 1.1.0
Parameters
- format : String
Any valid date format string. Defaults to Ext.Date.defaultFormat.
Returns
- Function
The date formatting function
Alias for Ext.String.ellipsis.
Truncate a string and add an ellipsis ('...') to the end if it exceeds the specified length
Available since: 1.1.0
Parameters
- value : String
The string to truncate
- length : Number
The maximum length to allow before truncating
- word : Boolean
True to try to find a common word break
Returns
- String
The converted text
Alias for Ext.String.format.
Allows you to define a tokenized string and pass an arbitrary number of arguments to replace the tokens. Each token must be unique, and must increment in the format {0}, {1}, etc. Example usage:
var cls = 'my-class', text = 'Some text';
var s = Ext.String.format('<div class="{0}">{1}</div>', cls, text);
// s now contains the string: '<div class="my-class">Some text</div>'
Available since: 4.0.1
Parameters
- string : String
The tokenized string to be formatted
- value1 : String
The value to replace token {0}
- value2 : String
Etc...
Returns
- String
The formatted string
Alias for Ext.String.htmlDecode.
Convert certain characters (&, <, >, and ") from their HTML character equivalents.
Available since: 1.1.0
Parameters
- value : String
The string to decode
Returns
- String
The decoded text
Alias for Ext.String.htmlEncode.
Convert certain characters (&, <, >, and ") to their HTML character equivalents for literal display in web pages.
Available since: 1.1.0
Parameters
- value : String
The string to encode
Returns
- String
The encoded text
Alias for Ext.String.leftPad.
Pads the left side of a string with a specified character. This is especially useful for normalizing number and date strings. Example usage:
var s = Ext.String.leftPad('123', 5, '0');
// s now contains the string: '00123'
Available since: 4.0.1
Parameters
- string : String
The original string
- size : Number
The total length of the output string
- character : String (optional)
The character with which to pad the original string (defaults to empty string " ")
Returns
- String
The padded string
It does simple math for use in a template, for example:
var tpl = new Ext.Template('{value} * 10 = {value:math("* 10")}');
Available since: 3.4.0
Returns
- Function
A function that operates on the passed value.
Formats the passed number according to the passed format string.
The number of digits after the decimal separator character specifies the number of decimal places in the resulting string. The local-specific decimal character is used in the result.
The presence of a thousand separator character in the format string specifies that the locale-specific thousand separator (if any) is inserted separating thousand groups.
By default, "," is expected as the thousand separator, and "." is expected as the decimal separator.
New to Ext JS 4
Locale-specific characters are always used in the formatted output when inserting thousand and decimal separators.
The format string must specify separator characters according to US/UK conventions ("," as the thousand separator, and "." as the decimal separator)
To allow specification of format strings according to local conventions for separator characters, add
the string /i to the end of the format string.
0.00 - (123456.78) show only digits, 2 precision
0.0000 - (123456.7890) show only digits, 4 precision
0,000 - (123,456) show comma and digits, no precision
0,000.00 - (123,456.78) show comma and digits, 2 precision
0,0.00 - (123,456.78) shortcut method, show comma and digits, 2 precision
To allow specification of the formatting string using UK/US grouping characters (,) and decimal (.) for international numbers, add /i to the end. For example: 0.000,00/i
Available since: 3.4.0
Parameters
Returns
- String
The formatted number.
Parses a number or string representing margin sizes into an object. Supports CSS-style margin declarations (e.g. 10, "10", "10 10", "10 10 10" and "10 10 10 10" are all valid options and would return the same result)
Available since: 4.0.0
Parameters
Returns
- Object
An object with margin sizes for top, right, bottom and left
Selectively do a plural form of a word based on a numeric value. For example, in a template, {commentCount:plural("Comment")} would result in "1 Comment" if commentCount was 1 or would be "x Comments" if the value is 0 or greater than 1.
Available since: 3.4.0
Parameters
Alias for Ext.String.trim.
Trims whitespace from either end of a string, leaving spaces within the string intact. Example:
var s = ' foo bar ';
alert('-' + s + '-'); //alerts "- foo bar -"
alert('-' + Ext.String.trim(s) + '-'); //alerts "-foo bar-"
Available since: 1.1.0
Parameters
- string : String
The string to escape
Returns
- String
The trimmed string