Using ExtJS 4.2.3, I have FORM with textfield. I need to get value from store to the field. Having problems with my attempt to format data in the desired format. Asking for help with syntax to format data to DD-MM-YYYY.

Data in source: /Date(1417986000000)/

After trying to get data by:

Form_window.query('textfield[name="DateField"]')[0].setValue(NewDATA_store.getAt(1).get('DateData'))

What I get: Mon Dec 08 2014 00:00:00 GMT+0300 (RTZ 2 (winter))

Result what I need: 08.12.2014

Using ExtJS 4.2.3, I have FORM with textfield. I need to get value from store to the field. Having problems with my attempt to format data in the desired format. Asking for help with syntax to format data to DD-MM-YYYY.

Data in source: /Date(1417986000000)/

After trying to get data by:

Form_window.query('textfield[name="DateField"]')[0].setValue(NewDATA_store.getAt(1).get('DateData'))

What I get: Mon Dec 08 2014 00:00:00 GMT+0300 (RTZ 2 (winter))

Result what I need: 08.12.2014

• javascript
• web
• extjs
• extjs4

• 1 You have any special reason to use textfield instead of datefield? docs.sencha./extjs/4.1.3/#!/api/Ext.form.field.Date – jose Commented Dec 26, 2017 at 9:53
• If the field is only to display the date use the datefield with the following configs: readOnly: true, format: 'd-m-Y' – jose Commented Dec 26, 2017 at 10:03

3 Answers 3

Try the following:

var inputDate = new Date('Mon Dec 08 2014 00:00:00 GMT+0300 (RTZ 2 (winter))');
var output = Ext.Date.format(inputDate, 'd.m.Y'); // will output: 08.12.2014

In ExtJS Date singleton class available you need to use Ext.Date.formate() method of this.

A Date class set of useful static methods to deal with date Note that if Ext.Date is required and loaded, it will copy all methods / properties to this object for convenience.

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

//Current date
var dt = new Date();
console.log(Ext.Date.format(dt, 'Y-m-d')); // 2017-12-26
console.log(Ext.Date.format(dt, 'F j, Y, g:i a')); //December 26, 2017, 11:28 am
console.log(Ext.Date.format(dt, 'l, \\t\\he jS \\of F Y h:i:s A')); //Tuesday, the 26th of December 2017 11:28:02 AM

In this FIDDLE, I have create a demo using form, 'textfield' and store. I hope this will help you or guide you.

 Ext.create('Ext.data.Store', {
     storeId: 'dateStore',
     fields: [{
         name: 'DateData',
         type: 'date'
     }],
     data: [{
         DateData: new Date()
     }]
 });

 Ext.create('Ext.form.Panel', {
     title: 'Simple Form',
     bodyPadding: 5,
     width: 350,

     layout: 'anchor',
     defaults: {
         anchor: '100%'
     },

     // The fields
     defaultType: 'textfield',
     items: [{
         fieldLabel: 'Today Date',
         name: 'DateField',
         readOnly: true
     }],
     renderTo: Ext.getBody(),
     listeners: {
         afterrender: function (form) {
             var store = Ext.data.StoreManager.lookup('dateStore'),
                 date = store.getAt(0).get('DateData');

             form.down('[name=DateField]').setValue(Ext.Date.format(date, 'd.m.Y'));
         }
     }
 });

I make your solution using ES6. let is like var but only gets the context where the let declaration is declared. sometimes a function, other times a for, if... var declaration gets the context of their parent function. that means that doesn't respect fors or ifs or others just functions. The function that I provide is working.

let formatDate = (param) => {
  let day = param.getDate() < 10 ? '0' + param.getDate() : param.getDate();
  let month = (param.getMonth()+1);
  let year = param.getFullYear();

  return day +"."+ month +"."+ year;
}

let date = new Date("Mon Dec 08 2014 00:00:00 GMT+0300 (RTZ 2 (winter))");

window.console.log(formatDate(date));