Search code examples
extjstimefield

How to keep the format of ExtJS timefield in 24hours


I am trying to create a timefield combo box with extJS. I have done this successfully but now I have a problem when I get the value that I select in the combo box. First the code for making the timefield:

 items :[{
    fieldLabel: 'Start Time',
    name: 'startTime',
    xtype: 'timefield',
    id: 'startTime',
    format: 'H:i',
    altFormats:'H:i',
    increment: 30
        }]

What I want is to get the value in a 24h format. In order to get the value from the time field I use this code:

    var startTime = Ext.getCmp('startTime').getSubmitValue();

The problem is that instead of getting the time in 24hour format, the values are transformed into 12 hours format. For example, while I select from the combo the time: 00:00 when I use getSubmitValue() the value is transformed into 12:00 AM, which is not very useful in my case.

My question is: Is there a way to keep the format of the time exactly how it is in the combo box? That would be a 24hour format.

I hope it's clear what I am trying to say.

Thanks Dimitris


Solution

  • The reason is simple.
    getValue returns date object, getSubmitValue returns formatted date.
    You just need to format a date received by getValue method.

    var field = Ext.getCmp('startTime');
    var value = field.getValue();
    var formattedValue = Ext.Date.format(value, 'H:i');
    

    Sample here