Ext.ux.DatePickerPlus: MultiMonth, MultiSelection, WeekNumbers, Custom CSS Days,...

**jsakalos** · 5 Apr 2008, 4:44 PM

Just perfect!

Is there a possibility to remove buttons? I'm thinking that this extension would be very handy for personal organizers, like korganizer in KDE, where these buttons would be undesirable.

**wm003** · 6 Apr 2008, 12:22 AM

Originally Posted by sanjshah

I'm not sure where the ext_exp is from? its missing the actual site name the rest of the path is OK.

aah...thanks for reporting this. a bug left in the code...

i'll fix this together with the suggestions from jsakalos and dvsdevise and post a new version in a few minutes...

**wm003** · 6 Apr 2008, 2:43 AM

I updated the Demopage and the first Post to the current Version. See Revision History for Details. All suggestions and bugreports have been inplemented and fixed

Thanks to DVSDevise, jsakalos,sanjshah and ludoo.

**KampfCaspar** · 6 Apr 2008, 4:31 AM

Great extension! Thanks for sharing.

May I humbly suggest not forgetting about keyboard controls, like arrow navigation and Shift+Arrow selection?

On my FF3 *something* seems to change internally upon arrow key presses, but the display does only change by switching months.

HPO

**wm003** · 6 Apr 2008, 4:48 AM

Originally Posted by KampfCaspar

May I humbly suggest not forgetting about keyboard controls, like arrow navigation and Shift+Arrow selection?

well, the keyboard-controls are yet the same as the original datepicker. (i only added the RETURN key to act like pressing on the "OK"-Button) The problem is, whereas the currentpicker has browser focus and thus can react on keyboard navigation.
its the same issue than in original datepicker...i was worried about this myself, so i try to figure out how to get it working better. (currently you need to click at least on one button (e.g. next/prev month) to get the focus so the pageUp/pageDown/CTRL-left/right Keys/space/return work...well most of the times at least in my setups...and not in all browsers

I'll dig into it and try to implement full keyboard navigation in the next version

**DVSDevise** · 6 Apr 2008, 4:57 AM

Originally Posted by wm003

I updated the Demopage and the first Post to the current Version. See Revision History for Details. All suggestions and bugreports have been inplemented and fixed

Thanks to DVSDevise, jsakalos,sanjshah and ludoo.

Beautiful, that's perfect.

**jerrybrown5** · 6 Apr 2008, 5:14 AM

This is a very nice control; however, is there any reason why you are not registering Ext.ux.form.DateFieldPlus with Ext.reg?

**wm003** · 6 Apr 2008, 5:17 AM

Originally Posted by jerrybrown5

This is a very nice control; however, is there any reason why you are not registering Ext.ux.form.DateFieldPlus with Ext.reg?

yes..i simply forgot about that...

Updated Version to beta 3 and fixed a little bug..thanks for reporting.

**jerrybrown5** · 6 Apr 2008, 6:35 AM

Here's a bug for you... the date will popup on the top part of the screen... It only happens in IE when you use the xtype creation when you have an id specified...it happens because the datemenu is creating a duplicate id of the datefield

Here is the code to reproduce it.. You can put this in the ext samples folder along with your library.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Forms</title>
    <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css"/>
    <link rel="stylesheet" type="text/css" href="ext.ux.datepickerplus.css"/>
    <!-- GC -->
    <!-- LIBS -->
    <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
    <!-- ENDLIBS -->

    <script type="text/javascript" src="../../ext-all.js"></script>
    <script type="text/javascript" src="ext.ux.datepickerplus.js"></script>

    <link rel="stylesheet" type="text/css" href="forms.css"/>

    <!-- Common Styles for the examples -->
    <link rel="stylesheet" type="text/css" href="../examples.css"/>
</head>
<body>
<script>
Ext.onReady(function(){

    Ext.QuickTips.init();

    // turn on validation errors beside the field globally
    Ext.form.Field.prototype.msgTarget = 'side';

    var bd = Ext.getBody();

    /*
     * ================  Simple form  =======================
     */
    bd.createChild({tag: 'h2', html: 'Form 1 - Very Simple'});


    var simple = new Ext.FormPanel({
        labelWidth: 75, // label settings here cascade unless overridden
        url:'save-form.php',
        frame:true,
        title: 'Simple Form',
        bodyStyle:'padding:5px 5px 0',
        width: 350,
        defaults: {width: 230},
        defaultType: 'textfield',

        items: [{
                fieldLabel: 'First Name',
                name: 'first',
                allowBlank:false
            },{
                fieldLabel: 'Last Name',
                name: 'last'
            },{
                fieldLabel: 'Date',
                id:'datepickerplus',
                name: 'datepickerplus',
                xtype: 'datefieldplus'
                //xtype: 'datepickerplus'
            }, {
                fieldLabel: 'Email',
                name: 'email',
                vtype:'email'
            }, new Ext.form.TimeField({
                fieldLabel: 'Time',
                name: 'time',
                minValue: '8:00am',
                maxValue: '6:00pm'
            })
        ],

        buttons: [{
            text: 'Save'
        },{
            text: 'Cancel'
        }]
    });

    simple.render(document.body);
});
</script>    

</body>
</html>

**wm003** · 6 Apr 2008, 7:44 AM

Originally Posted by jerrybrown5

Here's a bug for you... the date will popup on the top part of the screen... It only happens in IE when you use the xtype creation when you have an id specified...it happens because the datemenu is creating a duplicate id of the datefield

Yeah, you are right. This was left from jsakalos XDateField Extension which always takes the name-config option for the hidden submitFormat Field.

I fixed it the following way:

a) "id" and "name" are given and both are equal or both are not defined:
"id" stays for the datefield and "name" gets a suffix from the new config-option "submitFormatAddon" (default "-format")

PHP Code:


 //the hidden submitFormat Field will become "datepickerplus-format"
id:"datepickerplus",
name: "datepickerplus"

b) "id" and "name" are given and they are different:
Nothing changes, the Datefield gets the id and the hiddenfield gets the name

c) just "name" is given
The Datefield gets a generated Ext-Id and the hiddenfield gets the name

d) just "id" is given
The Datefield gets the given Id and the hiddenfield gets the id with the suffix from the new config-option "submitFormatAddon" (default "-format")

PHP Code:


 //the hidden submitFormat Field will become "datepickerplus-format"
id:"datepickerplus",

Thread: Ext.ux.DatePickerPlus: MultiMonth, MultiSelection, WeekNumbers, Custom CSS Days,...

Thread Tools

Search Thread

Display

Updated to Version 0.9.beta 2

Updated to 0.9 Beta 3

Updated to 0.9 Beta 4

Tags for this Thread

Posting Permissions

Stay Connected

Stay Connected

Sign up for Sencha News