Using MVC pattern, datepickerfield.setValue(null) does not set value as expected

**shaneavery** · 16 Feb 2012 10:37 AM

REQUIRED INFORMATION

Ext version tested:

Sencha Touch 2 rev Beta 3

Browser versions tested against:

Chrome 17.0.963.56 m

DOCTYPE tested against:

<!DOCTYPE html>

Description:

Using MVC pattern, datepickerfield.setValue(null) does not set value as expected

Steps to reproduce the problem:

See test case below...

The result that was expected:

After running datepickerfield.setValue(null) - datepickerfield.getValue() should be "null".

The result that occurs instead:

After running datepickerfield.setValue(null) - datepickerfield.getValue() returns the last date selected in the datepicker. Although the textfield portion of datepickerfield is blanked out, the console returns a UTC formatted date.

Test Case:

index.html:

Code:

<!DOCTYPE html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="target-densitydpi=device-dpi, width=device-width, height=device-height, initial-scale=1.0" />
    <title id="page-title">Test Datepicker field.setValue(null)</title>

    <link rel="stylesheet" href="../touch/resources/css/apple.css" type="text/css">
    <script type="text/javascript" src="../touch/sencha-touch-debug.js"></script>
    
<script type="text/javascript" charset="utf-8">

Ext.Loader.setConfig({
    enabled: true
});
Ext.require([
    'Ext.field.DatePicker',
    'Ext.form.Panel',
    'Ext.form.FieldSet',
    'Ext.TitleBar'
]);
Ext.application({
    name: 'test',
    views: [
        'Viewport'
    ],
    models: ['Date'],
    controllers: [
        'Control'
    ]
});
</script>
    
</head>
<body>

</body>
</html>

controller:

Code:

Ext.define('test.controller.Control', {
    extend: 'Ext.app.Controller',
    config: {
        refs: {
            //build for us this.getViewport() method
            viewport: {
            selector: '#viewportview',
            xtype: 'viewportview',
            autoCreate: true
            }
        },
        control: {
            '#testDate': {
                tap: 'onTestDateBtn'
            }
        },
    },
    launch: function() {
        this.getViewport().show();
    },
    onTestDateBtn: function() {
        var datetimeField = Ext.ComponentQuery.query('datepickerfield')[0];
        console.log(datetimeField.getValue());
        datetimeField.setValue(null);
        console.log(datetimeField.getValue());
    }
});

model:

Code:

Ext.define('test.model.Date', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
                { name: 'test_date', type: 'date', defaultValue: new Date(), dateFormat: 'c' }
        ]
    }
});

view:

Code:

Ext.define('test.view.Viewport', {
    extend: 'Ext.form.Panel',
    xtype : 'viewportview',
    title: 'Test Date',
    config: {
        title : 'Test Date',
        autoShow: true,
        autoRender   : true,
        fullscreen   : true,
        items : [
                    {
                    xtype: 'toolbar',
                    title: 'Test Date',
                    docked: 'top',
                    items: [
                        {
                            text: 'Test Output',
                            ui: 'normal',
                            id: 'testDate'
                        }
                    ]
                    },
                    {
                    xtype: 'fieldset',
                    title: 'Test Datepicker setValue(null)',
                    items: [
                              {
                                  xtype: 'datepickerfield',
                                  name : 'test_date',
                                  label: 'Date Picker'
                              }
                    ]
                    }
        ]
    }
});

HELPFUL INFORMATION

Debugging already done:

none

Possible fix:

not provided

Additional CSS used:

only default ext-all.css

Operating System:

Windows 7

**Jamie Avins** · 16 Feb 2012 10:44 AM

Thank you for the report.

**shaneavery** · 16 Feb 2012 11:18 AM

**rdougan** · 16 Feb 2012 6:10 PM

Thanks for the good test case. This has been fixed and will make it into the next release.

Using MVC pattern, datepickerfield.setValue(null) does not set value as expected

Thread Tools

Search Thread

Display

Using MVC pattern, datepickerfield.setValue(null) does not set value as expected

Using MVC pattern, datepickerfield.setValue(null) does not set value as expected

My pleasure.

My pleasure.

Tags for this Thread