Results 1 to 2 of 2

Thread: Timefield Custom Values

  1. #1
    Sencha User
    Join Date
    Jun 2009
    Vote Rating

    Question Timefield Custom Values

    Hi All,

    Does anyone know how to define a custom set of values to be displayed in the TimeField control used on Forms?

    Basically I am trying to get a TimeField to display all hours in a day (00:00, 01:00..), but I want the last value to be displayed as '23:59'. I have a pair of TimeField controls so as you may guess its so the user can select a time range.

    So far I have got the TimeField configured as shown in the below segment. I tried setting the maxValue to 23:59 but it just gets defaulted to 11:00 PM.

    I wondered if there was some way of defining a custom store so I can list the values that I want the control to display (so all the whole hours and ending with a 23:59 entry), then the TimeField could be bound to the store. Or is there an easier way?

    new Ext.form.TimeField({
                                    fieldLabel: 'End Hour',
                                    labelStyle: 'text-align:right; font-weight:bold;',
                                    name: 'endhr',
                                    id: 'endhr',
                                    minValue: '00:00 AM',
                                    maxValue: '23:59 PM', 
                                    value: '00:00 AM',
                                    increment: 60,
                                    width: 85,
                                    editable: false

  2. #2
    Ext User
    Join Date
    Mar 2007
    Vote Rating


    I had to deal with this also. I needed a solution for the end of the day for an end date time range. I search a few different times on the forums but with no real luck finding a solution. Here is the solutions I ended up using. (I classify 12:00 AM as midnight the next day to make more sense for the users.)

    I know the original poster could probably care less but here is the solution for others who may have encountered this scenario.

                      oEndTime = new Ext.form.TimeField({
                         id: this.sId + '-timefield-end',
                         width: 90,
                         fieldLabel: 'End',
                         minValue: '12:15 AM',
                         maxValue: '11:45 PM',
                         name: 'end',
                         increment: 15,
                         tpl: new Ext.XTemplate(
                            '<tpl for="."><div class="x-combo-list-item">',
                            '<tpl if="field1 == \'12:00 AM\'">Midnight</tpl>',
                            '<tpl if="field1 != \'12:00 AM\'">{field1}</tpl>',
                         listeners: {
                            beforerender: function(comp){
                               timeRec = this.getStore().recordType;
                               this.getStore().insert(this.getStore().getCount(), new timeRec({ field1: '12:00 AM' }));

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts