Docs Help

Terms, Icons, and Labels

Many classes have shortcut names used when creating (instantiating) a class with a configuration object. The shortcut name is referred to as an alias (or xtype if the class extends Ext.Component). The alias/xtype is listed next to the class name of applicable classes for quick reference.

Access Levels

Framework classes or their members may be specified as private or protected. Else, the class / member is public. Public, protected, and private are access descriptors used to convey how and when the class or class member should be used.

Member Types

Member Syntax

Below is an example class member that we can disect to show the syntax of a class member (the lookupComponent method as viewed from the Ext.button.Button class in this case).

lookupComponent ( item ) : Ext.Component
protected

Called when a raw config object is added to this container either during initialization of the items config, or when new items are added), or {@link #insert inserted.

This method converts the passed object into an instanced child component.

This may be overridden in subclasses when special processing needs to be applied to child creation.

Parameters

item :  Object

The config object being added.

Returns
Ext.Component

The component to be added.

Let's look at each part of the member row:

Member Flags

The API documentation uses a number of flags to further commnicate the class member's function and intent. The label may be represented by a text label, an abbreviation, or an icon.

Class Icons

- Indicates a framework class

- A singleton framework class. *See the singleton flag for more information

- A component-type framework class (any class within the Ext JS framework that extends Ext.Component)

- Indicates that the class, member, or guide is new in the currently viewed version

Member Icons

- Indicates a class member of type config

- Indicates a class member of type property

- Indicates a class member of type method

- Indicates a class member of type event

- Indicates a class member of type theme variable

- Indicates a class member of type theme mixin

- Indicates that the class, member, or guide is new in the currently viewed version

Class Member Quick-Nav Menu

Just below the class name on an API doc page is a row of buttons corresponding to the types of members owned by the current class. Each button shows a count of members by type (this count is updated as filters are applied). Clicking the button will navigate you to that member section. Hovering over the member-type button will reveal a popup menu of all members of that type for quick navigation.

Getter and Setter Methods

Getting and setter methods that correlate to a class config option will show up in the methods section as well as in the configs section of both the API doc and the member-type menus just beneath the config they work with. The getter and setter method documentation will be found in the config row for easy reference.

History Bar

Your page history is kept in localstorage and displayed (using the available real estate) just below the top title bar. By default, the only search results shown are the pages matching the product / version you're currently viewing. You can expand what is displayed by clicking on the button on the right-hand side of the history bar and choosing the "All" radio option. This will show all recent pages in the history bar for all products / versions.

Within the history config menu you will also see a listing of your recent page visits. The results are filtered by the "Current Product / Version" and "All" radio options. Clicking on the button will clear the history bar as well as the history kept in local storage.

If "All" is selected in the history config menu the checkbox option for "Show product details in the history bar" will be enabled. When checked, the product/version for each historic page will show alongside the page name in the history bar. Hovering the cursor over the page names in the history bar will also show the product/version as a tooltip.

Search and Filters

Both API docs and guides can be searched for using the search field at the top of the page.

On API doc pages there is also a filter input field that filters the member rows using the filter string. In addition to filtering by string you can filter the class members by access level, inheritance, and read only. This is done using the checkboxes at the top of the page.

The checkbox at the bottom of the API class navigation tree filters the class list to include or exclude private classes.

Clicking on an empty search field will show your last 10 searches for quick navigation.

API Doc Class Metadata

Each API doc page (with the exception of Javascript primitives pages) has a menu view of metadata relating to that class. This metadata view will have one or more of the following:

Expanding and Collapsing Examples and Class Members

Runnable examples (Fiddles) are expanded on a page by default. You can collapse and expand example code blocks individually using the arrow on the top-left of the code block. You can also toggle the collapse state of all examples using the toggle button on the top-right of the page. The toggle-all state will be remembered between page loads.

Class members are collapsed on a page by default. You can expand and collapse members using the arrow icon on the left of the member row or globally using the expand / collapse all toggle button top-right.

Desktop -vs- Mobile View

Viewing the docs on narrower screens or browsers will result in a view optimized for a smaller form factor. The primary differences between the desktop and "mobile" view are:

Viewing the Class Source

The class source can be viewed by clicking on the class name at the top of an API doc page. The source for class members can be viewed by clicking on the "view source" link on the right-hand side of the member row.

Ext JS 6.2.1 - Modern Toolkit


top

Ext.Date singleton

Hierarchy

Ext.Date

Summary

This class defines some basic methods for handling dates.

The date parsing and formatting syntax contains a subset of PHP's date() function, and the formats that are supported will provide results equivalent to their PHP versions.

The following is a list of all currently supported formats:

 Format      Description                                                               Example returned values
 ------      -----------------------------------------------------------------------   -----------------------
   d         Day of the month, 2 digits with leading zeros                             01 to 31
   D         A short textual representation of the day of the week                     Mon to Sun
   j         Day of the month without leading zeros                                    1 to 31
   l         A full textual representation of the day of the week                      Sunday to Saturday
   N         ISO-8601 numeric representation of the day of the week                    1 (for Monday) through 7 (for Sunday)
   S         English ordinal suffix for the day of the month, 2 characters             st, nd, rd or th. Works well with j
   w         Numeric representation of the day of the week                             0 (for Sunday) to 6 (for Saturday)
   z         The day of the year (starting from 0)                                     0 to 364 (365 in leap years)
   W         ISO-8601 week number of year, weeks starting on Monday                    01 to 53
   F         A full textual representation of a month, such as January or March        January to December
   m         Numeric representation of a month, with leading zeros                     01 to 12
   M         A short textual representation of a month                                 Jan to Dec
   n         Numeric representation of a month, without leading zeros                  1 to 12
   t         Number of days in the given month                                         28 to 31
   L         Whether it's a leap year                                                  1 if it is a leap year, 0 otherwise.
   o         ISO-8601 year number (identical to (Y), but if the ISO week number (W)    Examples: 1998 or 2004
             belongs to the previous or next year, that year is used instead)
   Y         A full numeric representation of a year, 4 digits                         Examples: 1999 or 2003
   y         A two digit representation of a year                                      Examples: 99 or 03
   a         Lowercase Ante meridiem and Post meridiem                                 am or pm
   A         Uppercase Ante meridiem and Post meridiem                                 AM or PM
   g         12-hour format of an hour without leading zeros                           1 to 12
   G         24-hour format of an hour without leading zeros                           0 to 23
   h         12-hour format of an hour with leading zeros                              01 to 12
   H         24-hour format of an hour with leading zeros                              00 to 23
   i         Minutes, with leading zeros                                               00 to 59
   s         Seconds, with leading zeros                                               00 to 59
   u         Decimal fraction of a second                                              Examples:
             (minimum 1 digit, arbitrary number of digits allowed)                     001 (i.e. 0.001s) or
                                                                                       100 (i.e. 0.100s) or
                                                                                       999 (i.e. 0.999s) or
                                                                                       999876543210 (i.e. 0.999876543210s)
   O         Difference to Greenwich time (GMT) in hours and minutes                   Example: +1030
   P         Difference to Greenwich time (GMT) with colon between hours and minutes   Example: -08:00
   T         Timezone abbreviation of the machine running the code                     Examples: EST, MDT, PDT ...
   Z         Timezone offset in seconds (negative if west of UTC, positive if east)    -43200 to 50400
   c         ISO 8601 date represented as the local time with an offset to UTC appended.
             Notes:                                                                    Examples:
             1) If unspecified, the month / day defaults to the current month / day,   1991 or
                the time defaults to midnight, while the timezone defaults to the      1992-10 or
                browser's timezone. If a time is specified, it must include both hours 1993-09-20 or
                and minutes. The "T" delimiter, seconds, milliseconds and timezone     1994-08-19T16:20+01:00 or
                are optional.                                                          1995-07-18T17:21:28-02:00 or
             2) The decimal fraction of a second, if specified, must contain at        1996-06-17T18:22:29.98765+03:00 or
                least 1 digit (there is no limit to the maximum number                 1997-05-16T19:23:30,12345-0400 or
                of digits allowed), and may be delimited by either a '.' or a ','      1998-04-15T20:24:31.2468Z or
             Refer to the examples on the right for the various levels of              1999-03-14T20:24:32Z or
             date-time granularity which are supported, or see                         2000-02-13T21:25:33
             http://www.w3.org/TR/NOTE-datetime for more info.                         2001-01-12 22:26:34
   C         An ISO date string as implemented by the native Date object's             1962-06-17T09:21:34.125Z
             [Date.toISOString](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toISOString)
             method. This outputs the numeric part with *UTC* hour and minute
             values, and indicates this by appending the `'Z'` timezone
             identifier.
   U         Seconds since the Unix Epoch (January 1 1970 00:00:00 GMT)                1193432466 or -2138434463
   MS        Microsoft AJAX serialized dates                                           \/Date(1238606590509)\/ (i.e. UTC milliseconds since epoch) or
                                                                                       \/Date(1238606590509+0800)\/
   time      A javascript millisecond timestamp                                        1350024476440
   timestamp A UNIX timestamp (same as U)                                              1350024866

Example usage (note that you must escape format specifiers with '\' to render them as character literals):

// Sample date:
// 'Wed Jan 10 2007 15:05:01 GMT-0600 (Central Standard Time)'

var dt = new Date('1/10/2007 03:05:01 PM GMT-0600');
console.log(Ext.Date.format(dt, 'Y-m-d'));                          // 2007-01-10
console.log(Ext.Date.format(dt, 'F j, Y, g:i a'));                  // January 10, 2007, 3:05 pm
console.log(Ext.Date.format(dt, 'l, \\t\\he jS \\of F Y h:i:s A')); // Wednesday, the 10th of January 2007 03:05:01 PM

Here are some standard date/time patterns that you might find helpful. They are not part of the source of Ext.Date, but to use them you can simply copy this block of code into any script that is included after Ext.Date and they will also become globally available on the Date object. Feel free to add or remove patterns as needed in your code.

Ext.Date.patterns = {
    ISO8601Long:"Y-m-d H:i:s",
    ISO8601Short:"Y-m-d",
    ShortDate: "n/j/Y",
    LongDate: "l, F d, Y",
    FullDateTime: "l, F d, Y g:i:s A",
    MonthDay: "F d",
    ShortTime: "g:i A",
    LongTime: "g:i:s A",
    SortableDateTime: "Y-m-d\\TH:i:s",
    UniversalSortableDateTime: "Y-m-d H:i:sO",
    YearMonth: "F, Y"
};

Example usage:

var dt = new Date();
console.log(Ext.Date.format(dt, Ext.Date.patterns.ShortDate));

Developer-written, custom formats may be used by supplying both a formatting and a parsing function which perform to specialized requirements. The functions are stored in parseFunctions and formatFunctions.

No members found using the current filters

properties

Instance Properties

DAY : String

Date interval constant.

Defaults to:

"d"

dayNames : String[]

An array of textual day names. Override these values for international dates.

Example:

Ext.Date.dayNames = [
    'SundayInYourLang',
    'MondayInYourLang'
    // ...
];

Defaults to:

[
    "Sunday",
    "Monday",
    "Tuesday",
    "Wednesday",
    "Thursday",
    "Friday",
    "Saturday"
]

DAYS_IN_WEEK : Number

The number of days in a week.

Defaults to:

7

defaultFormat : String

The date format string that the Ext.util.Format#dateRenderer and Ext.util.Format#date functions use. See Ext.Date for details.

This may be overridden in a locale file.

Defaults to:

"m/d/Y"

defaults : Object

An object hash containing default date values used during date parsing.

The following properties are available:

  • y: Number - The default year value. Defaults to undefined.
  • m: Number - The default 1-based month value. Defaults to undefined.
  • d: Number - The default day value. Defaults to undefined.
  • h: Number - The default hour value. Defaults to undefined.
  • i: Number - The default minute value. Defaults to undefined.
  • s: Number - The default second value. Defaults to undefined.
  • ms: Number - The default millisecond value. Defaults to undefined.

Override these properties to customize the default date values used by the parse method.

Note: In countries which experience Daylight Saving Time (i.e. DST), the h, i, s and ms properties may coincide with the exact time in which DST takes effect. It is the responsibility of the developer to account for this.

Example Usage:

// set default day value to the first day of the month
Ext.Date.defaults.d = 1;

// parse a February date string containing only year and month values.
// setting the default day value to 1 prevents weird date rollover issues
// when attempting to parse the following date string on, for example, March 31st 2009.
Ext.Date.parse('2009-02', 'Y-m'); // returns a Date object representing February 1st 2009.

Defaults to:

{}

firstDayOfWeek : Number

The day on which the week starts. 0 being Sunday, through 6 being Saturday.

This may be overridden in a locale file.

Defaults to:

0

formatCodes : Object

The base format-code to formatting-function hashmap used by the format method. Formatting functions are strings (or functions which return strings) which will return the appropriate value when evaluated in the context of the Date object from which the format method is called. Add to / override these mappings for custom date formatting.

Note: Ext.Date.format() treats characters as literals if an appropriate mapping cannot be found.

Example:

Ext.Date.formatCodes.x = "Ext.util.Format.leftPad(this.getDate(), 2, '0')";
console.log(Ext.Date.format(new Date(), 'X'); // returns the current day of the month

Defaults to:

{
    d: "Ext.String.leftPad(m.getDate(), 2, '0')",
    D: "Ext.Date.getShortDayName(m.getDay())",
    // get localized short day name
    j: "m.getDate()",
    l: "Ext.Date.dayNames[m.getDay()]",
    N: "(m.getDay() ? m.getDay() : 7)",
    S: "Ext.Date.getSuffix(m)",
    w: "m.getDay()",
    z: "Ext.Date.getDayOfYear(m)",
    W: "Ext.String.leftPad(Ext.Date.getWeekOfYear(m), 2, '0')",
    F: "Ext.Date.monthNames[m.getMonth()]",
    m: "Ext.String.leftPad(m.getMonth() + 1, 2, '0')",
    M: "Ext.Date.getShortMonthName(m.getMonth())",
    // get localized short month name
    n: "(m.getMonth() + 1)",
    t: "Ext.Date.getDaysInMonth(m)",
    L: "(Ext.Date.isLeapYear(m) ? 1 : 0)",
    o: "(m.getFullYear() + (Ext.Date.getWeekOfYear(m) == 1 && m.getMonth() > 0 ? +1 : (Ext.Date.getWeekOfYear(m) >= 52 && m.getMonth() < 11 ? -1 : 0)))",
    Y: "Ext.String.leftPad(m.getFullYear(), 4, '0')",
    y: "('' + m.getFullYear()).substring(2, 4)",
    a: "(m.getHours() < 12 ? 'am' : 'pm')",
    A: "(m.getHours() < 12 ? 'AM' : 'PM')",
    g: "((m.getHours() % 12) ? m.getHours() % 12 : 12)",
    G: "m.getHours()",
    h: "Ext.String.leftPad((m.getHours() % 12) ? m.getHours() % 12 : 12, 2, '0')",
    H: "Ext.String.leftPad(m.getHours(), 2, '0')",
    i: "Ext.String.leftPad(m.getMinutes(), 2, '0')",
    s: "Ext.String.leftPad(m.getSeconds(), 2, '0')",
    u: "Ext.String.leftPad(m.getMilliseconds(), 3, '0')",
    O: "Ext.Date.getGMTOffset(m)",
    P: "Ext.Date.getGMTOffset(m, true)",
    T: "Ext.Date.getTimezone(m)",
    Z: "(m.getTimezoneOffset() * -60)",
    c: function() {
        // ISO-8601 -- GMT format
        var c = "Y-m-dTH:i:sP",
            code = [],
            i,
            l = c.length,
            e;
        for (i = 0; i < l; ++i) {
            e = c.charAt(i);
            code.push(e === "T" ? "'T'" : utilDate.getFormatCode(e));
        }
        // treat T as a character literal
        return code.join(" + ");
    },
    C: function() {
        // ISO-1601 -- browser format. UTC numerics with the 'Z' TZ id.
        return 'm.toISOString()';
    },
    U: "Math.round(m.getTime() / 1000)"
}

formatFunctions : Object

An object hash in which each property is a date formatting function. The property name is the format string which corresponds to the produced formatted date string.

This object is automatically populated with date formatting functions as date formats are requested for Ext standard formatting strings.

Custom formatting functions may be inserted into this object, keyed by a name which from then on may be used as a format string to format.

Example:

Ext.Date.formatFunctions['x-date-format'] = myDateFormatter;

A formatting function should return a string representation of the Date object which is the scope (this) of the function.

To enable date strings to also be parsed according to that format, a corresponding parsing function must be placed into the parseFunctions property.

Defaults to:

{
    "MS": function() {
        // UTC milliseconds since Unix epoch (MS-AJAX serialized date format (MRSF))
        return '\\/Date(' + this.getTime() + ')\\/';
    },
    "time": function() {
        return this.getTime().toString();
    },
    "timestamp": function() {
        return utilDate.format(this, 'U');
    }
}

HOUR : String

Date interval constant.

Defaults to:

"h"

MAX_DAYS_IN_MONTH : Number

The maximum number of days in a month.

Defaults to:

31

MILLI : String

Date interval constant.

Defaults to:

"ms"

MINUTE : String

Date interval constant.

Defaults to:

"mi"

MONTH : String

Date interval constant.

Defaults to:

"mo"

monthNames : String[]

An array of textual month names. Override these values for international dates.

Example:

Ext.Date.monthNames = [
    'JanInYourLang',
    'FebInYourLang'
    // ...
];

Defaults to:

[
    "January",
    "February",
    "March",
    "April",
    "May",
    "June",
    "July",
    "August",
    "September",
    "October",
    "November",
    "December"
]

monthNumbers : Object

An object hash of zero-based JavaScript month numbers (with short month names as keys).

Note: keys are case-sensitive.

Override these values for international dates.

Example:

Ext.Date.monthNumbers = {
    'LongJanNameInYourLang': 0,
    'ShortJanNameInYourLang':0,
    'LongFebNameInYourLang':1,
    'ShortFebNameInYourLang':1
    // ...
};

Defaults to:

{
    January: 0,
    Jan: 0,
    February: 1,
    Feb: 1,
    March: 2,
    Mar: 2,
    April: 3,
    Apr: 3,
    May: 4,
    June: 5,
    Jun: 5,
    July: 6,
    Jul: 6,
    August: 7,
    Aug: 7,
    September: 8,
    Sep: 8,
    October: 9,
    Oct: 9,
    November: 10,
    Nov: 10,
    December: 11,
    Dec: 11
}

MONTHS_IN_YEAR : Number

The number of months in a year.

Defaults to:

12

now

Defaults to:

nativeDate.now

parseCodes
private pri

Defaults to:

{
    // Notes:
    // g = {Number} calculation group (0 or 1. only group 1 contributes to
    // date calculations.)
    // c = {String} calculation method (required for group 1. null for group 0.
    // {0} = currentGroup - position in regex result array)
    // s = {String} regex pattern. all matches are stored in results[], and are
    // accessible by the calculation mapped to 'c'
    d: {
        g: 1,
        c: "d = parseInt(results[{0}], 10);\n",
        s: "(3[0-1]|[1-2][0-9]|0[1-9])"
    },
    // day of month with leading zeroes (01 - 31)
    j: {
        g: 1,
        c: "d = parseInt(results[{0}], 10);\n",
        s: "(3[0-1]|[1-2][0-9]|[1-9])"
    },
    // day of month without leading zeroes (1 - 31)
    D: function() {
        for (var a = [],
            i = 0; i < 7; a.push(utilDate.getShortDayName(i)) , ++i){}
        // get localised short day names
        return {
            g: 0,
            c: null,
            s: "(?:" + a.join("|") + ")"
        };
    },
    l: function() {
        return {
            g: 0,
            c: null,
            s: "(?:" + utilDate.dayNames.join("|") + ")"
        };
    },
    N: {
        g: 0,
        c: null,
        s: "[1-7]"
    },
    // ISO-8601 day number (1 (monday) - 7 (sunday))
    //<locale type="object" property="parseCodes">
    S: {
        g: 0,
        c: null,
        s: "(?:st|nd|rd|th)"
    },
    //</locale>
    w: {
        g: 0,
        c: null,
        s: "[0-6]"
    },
    // JavaScript day number (0 (sunday) - 6 (saturday))
    z: {
        g: 1,
        c: "z = parseInt(results[{0}], 10);\n",
        s: "(\\d{1,3})"
    },
    // day of the year (0 - 364 (365 in leap years))
    W: {
        g: 1,
        c: "W = parseInt(results[{0}], 10);\n",
        s: "(\\d{2})"
    },
    // ISO-8601 week number (with leading zero)
    F: function() {
        return {
            g: 1,
            c: "m = parseInt(me.getMonthNumber(results[{0}]), 10);\n",
            // get localised month number
            s: "(" + utilDate.monthNames.join("|") + ")"
        };
    },
    M: function() {
        for (var a = [],
            i = 0; i < 12; a.push(utilDate.getShortMonthName(i)) , ++i){}
        // get localised short month names
        return Ext.applyIf({
            s: "(" + a.join("|") + ")"
        }, utilDate.formatCodeToRegex("F"));
    },
    m: {
        g: 1,
        c: "m = parseInt(results[{0}], 10) - 1;\n",
        s: "(1[0-2]|0[1-9])"
    },
    // month number with leading zeros (01 - 12)
    n: {
        g: 1,
        c: "m = parseInt(results[{0}], 10) - 1;\n",
        s: "(1[0-2]|[1-9])"
    },
    // month number without leading zeros (1 - 12)
    t: {
        g: 0,
        c: null,
        s: "(?:\\d{2})"
    },
    // no. of days in the month (28 - 31)
    L: {
        g: 0,
        c: null,
        s: "(?:1|0)"
    },
    o: {
        g: 1,
        c: "y = parseInt(results[{0}], 10);\n",
        s: "(\\d{4})"
    },
    // ISO-8601 year number (with leading zero)
    Y: {
        g: 1,
        c: "y = parseInt(results[{0}], 10);\n",
        s: "(\\d{4})"
    },
    // 4-digit year
    y: {
        g: 1,
        c: "var ty = parseInt(results[{0}], 10);\n" + "y = ty > me.y2kYear ? 1900 + ty : 2000 + ty;\n",
        // 2-digit year
        s: "(\\d{2})"
    },
    /**
         * In the am/pm parsing routines, we allow both upper and lower case
         * even though it doesn't exactly match the spec. It gives much more flexibility
         * in being able to specify case insensitive regexes.
         */
    //<locale type="object" property="parseCodes">
    a: {
        g: 1,
        c: "if (/(am)/i.test(results[{0}])) {\n" + "if (!h || h == 12) { h = 0; }\n" + "} else { if (!h || h < 12) { h = (h || 0) + 12; }}",
        s: "(am|pm|AM|PM)",
        calcAtEnd: true
    },
    //</locale>
    //<locale type="object" property="parseCodes">
    A: {
        g: 1,
        c: "if (/(am)/i.test(results[{0}])) {\n" + "if (!h || h == 12) { h = 0; }\n" + "} else { if (!h || h < 12) { h = (h || 0) + 12; }}",
        s: "(AM|PM|am|pm)",
        calcAtEnd: true
    },
    //</locale>
    g: {
        g: 1,
        c: "h = parseInt(results[{0}], 10);\n",
        s: "(1[0-2]|[0-9])"
    },
    //  12-hr format of an hour without leading zeroes (1 - 12)
    G: {
        g: 1,
        c: "h = parseInt(results[{0}], 10);\n",
        s: "(2[0-3]|1[0-9]|[0-9])"
    },
    // 24-hr format of an hour without leading zeroes (0 - 23)
    h: {
        g: 1,
        c: "h = parseInt(results[{0}], 10);\n",
        s: "(1[0-2]|0[1-9])"
    },
    //  12-hr format of an hour with leading zeroes (01 - 12)
    H: {
        g: 1,
        c: "h = parseInt(results[{0}], 10);\n",
        s: "(2[0-3]|[0-1][0-9])"
    },
    //  24-hr format of an hour with leading zeroes (00 - 23)
    i: {
        g: 1,
        c: "i = parseInt(results[{0}], 10);\n",
        s: "([0-5][0-9])"
    },
    // minutes with leading zeros (00 - 59)
    s: {
        g: 1,
        c: "s = parseInt(results[{0}], 10);\n",
        s: "([0-5][0-9])"
    },
    // seconds with leading zeros (00 - 59)
    u: {
        g: 1,
        c: "ms = results[{0}]; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n",
        s: "(\\d+)"
    },
    // decimal fraction of a second (minimum = 1 digit, maximum = unlimited)
    O: {
        g: 1,
        c: [
            "o = results[{0}];",
            "var sn = o.substring(0,1),",
            // get + / - sign
            "hr = o.substring(1,3)*1 + Math.floor(o.substring(3,5) / 60),",
            // get hours (performs minutes-to-hour conversion also, just in case)
            "mn = o.substring(3,5) % 60;",
            // get minutes
            "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + Ext.String.leftPad(hr, 2, '0') + Ext.String.leftPad(mn, 2, '0')) : null;\n"
        ].join(// -12hrs <= GMT offset <= 14hrs
        "\n"),
        s: "([+-]\\d{4})"
    },
    // GMT offset in hrs and mins
    P: {
        g: 1,
        c: [
            "o = results[{0}];",
            "var sn = o.substring(0,1),",
            // get + / - sign
            "hr = o.substring(1,3)*1 + Math.floor(o.substring(4,6) / 60),",
            // get hours (performs minutes-to-hour conversion also, just in case)
            "mn = o.substring(4,6) % 60;",
            // get minutes
            "o = ((-12 <= (hr*60 + mn)/60) && ((hr*60 + mn)/60 <= 14))? (sn + Ext.String.leftPad(hr, 2, '0') + Ext.String.leftPad(mn, 2, '0')) : null;\n"
        ].join(// -12hrs <= GMT offset <= 14hrs
        "\n"),
        s: "([+-]\\d{2}:\\d{2})"
    },
    // GMT offset in hrs and mins (with colon separator)
    T: {
        g: 0,
        c: null,
        s: "[A-Z]{1,5}"
    },
    // timezone abbrev. may be between 1 - 5 chars
    Z: {
        g: 1,
        c: "zz = results[{0}] * 1;\n" + // -43200 <= UTC offset <= 50400
        "zz = (-43200 <= zz && zz <= 50400)? zz : null;\n",
        s: "([+-]?\\d{1,5})"
    },
    // leading '+' sign is optional for UTC offset
    c: function() {
        var calc = [],
            arr = [
                utilDate.formatCodeToRegex("Y", 1),
                // year
                utilDate.formatCodeToRegex("m", 2),
                // month
                utilDate.formatCodeToRegex("d", 3),
                // day
                utilDate.formatCodeToRegex("H", 4),
                // hour
                utilDate.formatCodeToRegex("i", 5),
                // minute
                utilDate.formatCodeToRegex("s", 6),
                // second
                {
                    c: "ms = results[7] || '0'; ms = parseInt(ms, 10)/Math.pow(10, ms.length - 3);\n"
                },
                // decimal fraction of a second (minimum = 1 digit, maximum = unlimited)
                {
                    c: [
                        // allow either "Z" (i.e. UTC) or "-0530" or "+08:00" (i.e. UTC offset) timezone delimiters. assumes local timezone if no timezone is specified
                        "if(results[8]) {",
                        // timezone specified
                        "if(results[8] == 'Z'){",
                        "zz = 0;",
                        // UTC
                        "}else if (results[8].indexOf(':') > -1){",
                        utilDate.formatCodeToRegex("P", 8).c,
                        // timezone offset with colon separator
                        "}else{",
                        utilDate.formatCodeToRegex("O", 8).c,
                        // timezone offset without colon separator
                        "}",
                        "}"
                    ].join('\n')
                }
            ],
            i, l;
        for (i = 0 , l = arr.length; i < l; ++i) {
            calc.push(arr[i].c);
        }
        return {
            g: 1,
            c: calc.join(""),
            s: [
                arr[0].s,
                // year (required)
                "(?:",
                "-",
                arr[1].s,
                // month (optional)
                "(?:",
                "-",
                arr[2].s,
                // day (optional)
                "(?:",
                "(?:T| )?",
                // time delimiter -- either a "T" or a single blank space
                arr[3].s,
                ":",
                arr[4].s,
                // hour AND minute, delimited by a single colon (optional). MUST be preceded by either a "T" or a single blank space
                "(?::",
                arr[5].s,
                ")?",
                // seconds (optional)
                "(?:(?:\\.|,)(\\d+))?",
                // decimal fraction of a second (e.g. ",12345" or ".98765") (optional)
                "(Z|(?:[-+]\\d{2}(?::)?\\d{2}))?",
                // "Z" (UTC) or "-0530" (UTC offset without colon delimiter) or "+08:00" (UTC offset with colon delimiter) (optional)
                ")?",
                ")?",
                ")?"
            ].join("")
        };
    },
    U: {
        g: 1,
        c: "u = parseInt(results[{0}], 10);\n",
        s: "(-?\\d+)"
    }
}

parseFunctions : Object

An object hash in which each property is a date parsing function. The property name is the format string which that function parses.

This object is automatically populated with date parsing functions as date formats are requested for Ext standard formatting strings.

Custom parsing functions may be inserted into this object, keyed by a name which from then on may be used as a format string to parse.

Example:

Ext.Date.parseFunctions['x-date-format'] = myDateParser;

A parsing function should return a Date object, and is passed the following parameters:

  • date: String - The date string to parse.
  • strict: Boolean - true to validate date strings while parsing (i.e. prevent JavaScript Date "rollover"). The default must be false. Invalid date strings should return null when parsed.

To enable Dates to also be formatted according to that format, a corresponding formatting function must be placed into the formatFunctions property.

Defaults to:

{
    "MS": function(input, strict) {
        // note: the timezone offset is ignored since the MS Ajax server sends
        // a UTC milliseconds-since-Unix-epoch value (negative values are allowed)
        var r = (input || '').match(MSFormatRe);
        return r ? new nativeDate(((r[1] || '') + r[2]) * 1) : null;
    },
    "time": function(input, strict) {
        var num = parseInt(input, 10);
        if (num || num === 0) {
            return new nativeDate(num);
        }
        return null;
    },
    "timestamp": function(input, strict) {
        var num = parseInt(input, 10);
        if (num || num === 0) {
            return new nativeDate(num * 1000);
        }
        return null;
    }
}

SECOND : String

Date interval constant.

Defaults to:

"s"

useStrict : Boolean

Global flag which determines if strict date parsing should be used. Strict date parsing will not roll-over invalid dates, which is the default behavior of JavaScript Date objects. (see parse for more information)

Defaults to:

false

weekendDays : Number[]

The days on which weekend falls. 0 being Sunday, through 6 being Saturday.

This may be overridden in a locale file.

Defaults to:

[
    0,
    6
]

YEAR : String

Date interval constant.

Defaults to:

"y"

methods

Instance Methods

add ( date, interval, value, [preventDstAdjust] ) : Date

Provides a convenient method for performing basic date arithmetic. This method does not modify the Date instance being called - it creates and returns a new Date instance containing the resulting date value.

Examples:

// Basic usage:
var dt = Ext.Date.add(new Date('10/29/2006'), Ext.Date.DAY, 5);
console.log(dt); // returns 'Fri Nov 03 2006 00:00:00'

// Negative values will be subtracted:
var dt2 = Ext.Date.add(new Date('10/1/2006'), Ext.Date.DAY, -5);
console.log(dt2); // returns 'Tue Sep 26 2006 00:00:00'

 // Decimal values can be used:
var dt3 = Ext.Date.add(new Date('10/1/2006'), Ext.Date.DAY, 1.25);
console.log(dt3); // returns 'Mon Oct 02 2006 06:00:00'

Parameters

date :  Date

The date to modify

interval :  String

A valid date interval enum value.

value :  Number

The amount to add to the current date.

preventDstAdjust :  Boolean (optional)

true to prevent adjustments when crossing daylight savings boundaries.

Defaults to: false

Returns

:Date

The new Date instance.

align ( date, unit, step ) : Date

Align the date to unit.

Parameters

date :  Date

The date to be aligned.

unit :  String

The unit. This unit is compatible with the date interval constants.

step :  Number

Returns

:Date

The aligned date.

between ( date, start, end ) : Boolean

Checks if a date falls on or between the given start and end dates.

Parameters

date :  Date

The date to check

start :  Date

Start date

end :  Date

End date

Returns

:Boolean

true if this date falls on or between the given start and end dates.

clearTime ( date, [clone] ) : Date

Attempts to clear all time information from this Date by setting the time to midnight of the same day, automatically adjusting for Daylight Saving Time (DST) where applicable.

Note: DST timezone information for the browser's host operating system is assumed to be up-to-date.

Parameters

date :  Date

The date

clone :  Boolean (optional)

true to create a clone of this date, clear the time and return it.

Defaults to: false

Returns

:Date

this or the clone.

clone ( date ) : Date

Creates and returns a new Date instance with the exact same date value as the called instance. Dates are copied and passed by reference, so if a copied date variable is modified later, the original variable will also be changed. When the intention is to create a new variable that will not modify the original instance, you should create a clone.

Example of correctly cloning a date:

//wrong way:
var orig = new Date('10/1/2006');
var copy = orig;
copy.setDate(5);
console.log(orig);  // returns 'Thu Oct 05 2006'!

//correct way:
var orig = new Date('10/1/2006'),
    copy = Ext.Date.clone(orig);
copy.setDate(5);
console.log(orig);  // returns 'Thu Oct 01 2006'

Parameters

date :  Date

The date.

Returns

:Date

The new Date instance.

createFormat ( format )
private pri

Parameters

format :  Object

createParser ( format )
private pri

Parameters

format :  Object

dateFormat ( date, format )
private pri

Parameters

date :  Object

format :  Object

diff ( min, max, unit ) : Number

Calculate how many units are there between two time.

Parameters

min :  Date

The first time.

max :  Date

The second time.

unit :  String

The unit. This unit is compatible with the date interval constants.

Returns

:Number

The maximum number n of units that min + n * unit <= max.

format ( date, format ) : String

Formats a date given the supplied format string.

Parameters

date :  Date

The date to format

format :  String

The format string

Returns

:String

The formatted date or an empty string if date parameter is not a JavaScript Date object

formatCodeToRegex ( character, currentGroup )
private pri

Parameters

character :  Object

currentGroup :  Object

formatContainsDateInfo ( format ) : Boolean

Checks if the specified format contains information about anything other than the time.

Parameters

format :  String

The format to check

Returns

:Boolean

True if the format contains information about date/day information.

formatContainsHourInfo ( format ) : Boolean

Checks if the specified format contains hour information

Parameters

format :  String

The format to check

Returns

:Boolean

True if the format contains hour information

getDayOfYear ( date ) : Number

Get the numeric day number of the year, adjusted for leap year.

Parameters

date :  Date

The date

Returns

:Number

0 to 364 (365 in leap years).

getDaysInMonth ( date ) : Number

Get the number of days in the current month, adjusted for leap year.

Parameters

date :  Date

The date

Returns

:Number

The number of days in the month.

getElapsed ( dateA, [dateB] ) : Number

Returns the number of milliseconds between two dates.

Parameters

dateA :  Date

The first date.

dateB :  Date (optional)

The second date.

Defaults to: new Date()

Returns

:Number

The difference in milliseconds

getFirstDateOfMonth ( date ) : Date

Get the date of the first day of the month in which this date resides.

Parameters

date :  Date

The date

Returns

:Date

getFirstDayOfMonth ( date ) : Number

Get the first day of the current month, adjusted for leap year. The returned value is the numeric day index within the week (0-6) which can be used in conjunction with the monthNames array to retrieve the textual day name.

var dt = new Date('1/10/2007'), firstDay = Ext.Date.getFirstDayOfMonth(dt);

console.log(Ext.Date.dayNames[firstDay]); // output: 'Monday'

Parameters

date :  Date

The date

Returns

:Number

The day number (0-6).

getFormatCode ( character )
private pri

Parameters

character :  Object

getGMTOffset ( date, [colon] ) : String

Get the offset from GMT of the current date (equivalent to the format specifier 'O').

Parameters

date :  Date

The date

colon :  Boolean (optional)

true to separate the hours and minutes with a colon.

Defaults to: false

Returns

:String

The 4-character offset string prefixed with + or - (e.g. '-0600').

getLastDateOfMonth ( date ) : Date

Get the date of the last day of the month in which this date resides.

Parameters

date :  Date

The date

Returns

:Date

getLastDayOfMonth ( date ) : Number

Get the last day of the current month, adjusted for leap year. The returned value is the numeric day index within the week (0-6) which can be used in conjunction with the monthNames array to retrieve the textual day name.

var dt = new Date('1/10/2007'), lastDay = Ext.Date.getLastDayOfMonth(dt);

console.log(Ext.Date.dayNames[lastDay]); // output: 'Wednesday'

Parameters

date :  Date

The date

Returns

:Number

The day number (0-6).

getMonthNumber ( name ) : Number

Get the zero-based JavaScript month number for the given short/full month name. Override this function for international dates.

Parameters

name :  String

The short/full month name.

Returns

:Number

The zero-based JavaScript month number.

getShortDayName ( day ) : String

Get the short day name for the given day number. Override this function for international dates.

Parameters

day :  Number

A zero-based JavaScript day number.

Returns

:String

The short day name.

getShortMonthName ( month ) : String

Get the short month name for the given month number. Override this function for international dates.

Parameters

month :  Number

A zero-based JavaScript month number.

Returns

:String

The short month name.

getSuffix ( date ) : String

Get the English ordinal suffix of the current day (equivalent to the format specifier 'S').

Parameters

date :  Date

The date

Returns

:String

'st, 'nd', 'rd' or 'th'.

getTimezone ( date ) : String

Get the timezone abbreviation of the current date (equivalent to the format specifier 'T').

Note: The date string returned by the JavaScript Date object's toString() method varies between browsers (e.g. FF vs IE) and system region settings (e.g. IE in Asia vs IE in America). For a given date string e.g. "Thu Oct 25 2007 22:55:35 GMT+0800 (Malay Peninsula Standard Time)", getTimezone() first tries to get the timezone abbreviation from between a pair of parentheses (which may or may not be present), failing which it proceeds to get the timezone abbreviation from the GMT offset portion of the date string.

Parameters

date :  Date

The date

Returns

:String

The abbreviated timezone name (e.g. 'CST', 'PDT', 'EDT', 'MPST' ...).

getWeekOfYear ( date ) : Number

Get the numeric ISO-8601 week number of the year. (equivalent to the format specifier 'W', but without a leading zero).

Parameters

date :  Date

The date.

Returns

:Number

1 to 53.

isDST ( date ) : Boolean

Checks if the current date is affected by Daylight Saving Time (DST).

Parameters

date :  Date

The date

Returns

:Boolean

true if the current date is affected by DST.

isEqual ( date1, date2 ) : Boolean

Compares if two dates are equal by comparing their values.

Parameters

date1 :  Date

date2 :  Date

Returns

:Boolean

true if the date values are equal

isLeapYear ( date ) : Boolean

Checks if the current date falls within a leap year.

Parameters

date :  Date

The date

Returns

:Boolean

true if the current date falls within a leap year, false otherwise.

isValid ( year, month, day, [hour], [minute], [second], [millisecond] ) : Boolean

Checks if the passed Date parameters will cause a JavaScript Date "rollover".

Parameters

year :  Number

4-digit year.

month :  Number

1-based month-of-year.

day :  Number

Day of month.

hour :  Number (optional)

Hour.

minute :  Number (optional)

Minute.

second :  Number (optional)

Second.

millisecond :  Number (optional)

Millisecond.

Returns

:Boolean

true if the passed parameters do not cause a Date "rollover", false otherwise.

isWeekend ( date ) : Boolean

Checks if the date is a weekend day. Uses weekendDays.

Available since: 6.2.0

Parameters

date :  Date

The date.

Returns

:Boolean

true if the day falls on a weekend.

localToUtc ( d ) : Date

Converts the passed local date into a UTC date. For example, if the passed date is: Wed Jun 01 2016 00:00:00 GMT+1000 (AUS Eastern Standard Time), then the returned date will be Wed Jun 01 2016 10:00:00 GMT+1000 (AUS Eastern Standard Time).

Available since: 6.2.0

Parameters

d :  Date

The date to convert.

Returns

:Date

The date as UTC. Does not modify the passed date.

parse ( input, format, [strict] ) : Date/null

Parses the passed string using the specified date format. Note that this function expects normal calendar dates, meaning that months are 1-based (i.e. 1 = January). The defaults hash will be used for any date value (i.e. year, month, day, hour, minute, second or millisecond) which cannot be found in the passed string. If a corresponding default date value has not been specified in the defaults hash, the current date's year, month, day or DST-adjusted zero-hour time value will be used instead. Keep in mind that the input date string must precisely match the specified format string in order for the parse operation to be successful (failed parse operations return a null value).

Example:

//dt = Fri May 25 2007 (current date)
var dt = new Date();

//dt = Thu May 25 2006 (today&#39;s month/day in 2006)
dt = Ext.Date.parse("2006", "Y");

//dt = Sun Jan 15 2006 (all date parts specified)
dt = Ext.Date.parse("2006-01-15", "Y-m-d");

//dt = Sun Jan 15 2006 15:20:01
dt = Ext.Date.parse("2006-01-15 3:20:01 PM", "Y-m-d g:i:s A");

// attempt to parse Sun Feb 29 2006 03:20:01 in strict mode
dt = Ext.Date.parse("2006-02-29 03:20:01", "Y-m-d H:i:s", true); // returns null

Parameters

input :  String

The raw date string.

format :  String

The expected date string format.

strict :  Boolean (optional)

true to validate date strings while parsing (i.e. prevents JavaScript Date "rollover"). Invalid date strings will return null when parsed.

Defaults to: false

Returns

:Date/null

The parsed Date, or null if an invalid date string.

subtract ( date, interval, value, [preventDstAdjust] ) : Date

Provides a convenient method for performing basic date arithmetic. This method does not modify the Date instance being called - it creates and returns a new Date instance containing the resulting date value.

Examples:

// Basic usage:
var dt = Ext.Date.subtract(new Date('10/29/2006'), Ext.Date.DAY, 5);
console.log(dt); // returns 'Tue Oct 24 2006 00:00:00'

// Negative values will be added:
var dt2 = Ext.Date.subtract(new Date('10/1/2006'), Ext.Date.DAY, -5);
console.log(dt2); // returns 'Fri Oct 6 2006 00:00:00'

 // Decimal values can be used:
var dt3 = Ext.Date.subtract(new Date('10/1/2006'), Ext.Date.DAY, 1.25);
console.log(dt3); // returns 'Fri Sep 29 2006 06:00:00'

Parameters

date :  Date

The date to modify

interval :  String

A valid date interval enum value.

value :  Number

The amount to subtract from the current date.

preventDstAdjust :  Boolean (optional)

true to prevent adjustments when crossing daylight savings boundaries.

Defaults to: false

Returns

:Date

The new Date instance.

toString ( date )
private pri

Parameters

date :  Object

unescapeFormat ( format ) : String

Removes all escaping for a date format string. In date formats, using a '\' can be used to escape special characters.

Parameters

format :  String

The format to unescape

Returns

:String

The unescaped format

utc ( year, month, day, [hour], [min], [s], [ms] ) : Date

Create a UTC date.

Available since: 6.2.0

Parameters

year :  Number

The year.

month :  Number

The month.

day :  Number

The day.

hour :  Number (optional)

The hour.

Defaults to: 0

min :  Number (optional)

The minutes.

Defaults to: 0

s :  Number (optional)

The seconds.

Defaults to: 0

ms :  Number (optional)

The milliseconds.

Defaults to: 0

Returns

:Date

The UTC date.

utcToLocal ( d ) : Date

Converts the passed UTC date into a local date. For example, if the passed date is: Wed Jun 01 2016 00:10:00 GMT+1000 (AUS Eastern Standard Time), then the returned date will be Wed Jun 01 2016 00:00:00 GMT+1000 (AUS Eastern Standard Time).

Available since: 6.2.0

Parameters

d :  Date

The date to convert.

Returns

:Date

The date as a local. Does not modify the passed date.

xf ( format )
private pri

Parameters

format :  Object

Create private copy of Ext JS's Ext.util.Format.format() method

  • to remove unnecessary dependency
  • to resolve namespace conflict with MS-Ajax's implementation

Ext JS 6.2.1 - Modern Toolkit