[3.x] Ext.date.RangeField

Ext.date.RangeField is a completely new rewrite of "Ext.ux.form.DateRange". Fixes lots of problems, code has been cleaned up and well documented. Demo/documentation has also been updated to reflect changes. Any questions, feel free to let me know.

Like it's ancestor, this version also bundles DateJs. This version separates the DateJs locale information so you can include this independently for globalization. I had to remove all the standard DateJs globalizations because Sencha's forum didn't like the file size apparently. This only bundles en-US.js, sorry all international users! :s

Download plugin here: Attachment 24583
Live demo: http://jsfiddle.net/2P7K9/

News

• 02/05: Updated linguistic error with preset date names, now they say "Month to date", "Year to date", etc. Also fixed IE8 bug reported by sb32.
• 01/30: Updated to allow pickers to update values based on current dates selected.

You can view the old version here:
http://www.sencha.com/forum/showthre...form.DateRange

Great add-in..

small linguistics issue..

use MonthToDate instead of MonthToDay ... and the same goes for YearToDate vs YearToDay

http://en.wikipedia.org/wiki/Month-to-date

hope this helps and thanks again!!

Thanks for the suggestion. I'll make the change and put up a new version.

few other things..

CUstom date ranges don't render properly in IE8 (nor does your example at http://jsfiddle.net/2P7K9/ in ie8)

until resolved, I tried to remove the range picker but of course it's assumed to be there ( not a removable preset)

so I had to comment it out further down

Interesting, I don't use IE here which is why it must have slipped by. I will try it out and see if I can find out what is breaking in IE8 -- thanks for the report(s). If you have an idea what is causing the break in IE8, it would help me out. Btw, I updated the release with the fixed linguistics.. as soon as we discover what's up with IE8, i'll put out a new patch.

I tried to work out what the issue was - however IE compatability issues are not always trivial. Look forward to seeing a fix, thanks again

I think I found the issue is with the hbox layout of the custom date range. I changed it to a column layout, and it is now working in IE8. Updating the version now.

New version is attached to thread.

One design consideration you may want to consider is:

Since it's a date range plugin - implement each option in such a way that it returns just that - a date range. For example, in the case of 'Today', return two date objects for the same date(today).


This makes using your plugin much easier in my opinion. Most services that deliver data given a specific date range, expects just that a range - even if it's the same start and end date. Your plugin made it hard for me to decipher what mode was used, thus making it hard to determine what a nil 'to' date would be. If you always return a date range, you decouple the user selection from the handling of values. (for the most part).

Examples:

PHP Code:

---

            text: 'After date',
            iconCls: 'calendar',
            menu: new Ext.menu.DateMenu({
               handler: function(dp, date){
                  DATE_MIN = date.add(Date.DAY,1);
                              DATE_MAX = new Date();
               }
           }) 


---

PHP Code:

---

        , '-', {
            text: 'Specific date',
            iconCls: 'calendar',
            menu: new Ext.menu.DateMenu({
               handler: function(dp, date){
                  DATE_MIN = date;
                              DATE_MAX = date.clone();
               }
           })
        } 


---

PHP Code:

---

        , '-', {
            text: 'Month-to-date',
            handler: function() {
                 var d = new Date().clearTime();
                 DATE_MIN = Date.parse(d.format('m/01/Y'));
                 DATE_MAX = d;
            }
        } 


---

Just an opinion though.. :-) Hope this helps and thanks for the quick response!!

fyi - DATE_MIN and DATE_MAX above are equiv to your to and from variables.

Thanks for your suggestion sb32, I guess for my purposes I didn't need to have it that way. But feel free to make an extension off of this that handles presets the way you need. It should be pretty simple to achieve that functionality. It might be even easier to add a new method to the class that always returns a date range (array). That way you'll always have two values, but if for some reason a single date is supplied, one would be false.