CODEWITHSUNDEEP
extjs
user6454237
user6454237

Reputation: 33

how to highlight selected date range form extjs datepickers

items:{
    xtype: 'datepicker',
    id: 'startDate',
    value: Ext.Date.add(new Date(), Ext.Date.DAY, -1),
    showToday: false,
    handler: function(picker, date) {
        var endDate = picker.up('form').down('#endDate').getValue();
    }
}, {
    title: 'End Date',
    margin: '10 10 0 0',
    header: {
        titleAlign: 'center'
    },
    items:{
        xtype: 'datepicker',
        id: 'endDate',
        value: new Date(),
        showToday: false,
        handler: function(picker, date) {
            var startDate = picker.up('form').down('#startDate').getValue();
        }]
    },

Upvotes: 1

Views: 183

Answers (1)

Akin Okegbile
Akin Okegbile

Reputation: 1176

You're looking for the configs 'maxDate' and 'minDate'. They go on both date picker items.

items:{
     xtype: 'datepicker',
         id: 'startDate',
         value: Ext.Date.add(new Date(), Ext.Date.DAY, -1),
         **minDate**: new Date(),
         **maxDate**: Ext.Date.add(new Date(), Ext.Date.DAY, -1),
         showToday: false,
         handler: function(picker, date) {
         var endDate = picker.up('form').down('#endDate').getValue();
     }

}

There is also this datepicker that allows you to pick a date range.

Upvotes: 1

Related Questions