Results 1 to 4 of 4

Thread: dynamically changedatefiled display

  1. #1
    Ext JS Premium Member
    Join Date
    Jun 2008
    Posts
    15

    Default dynamically changedatefiled display

    Hi

    how can i change dynamically the datefield format? Ex: Y/m/d < -> Y/m

    i tried

    Code:
    var dt = new Date(myDatefield.getValue()); // gets old selected date
    myDatefield.format = 'Y/m';
    myDatefield.setValue(dt);
    and

    Code:
    var dt = new Date(myDatefield.getValue()); // gets old selected date
    myDatefield.format = 'Y/m/d';
    myDatefield.setValue(dt);
    But, getValue always gets the first value defined when the component is rendered when i switch between 'Y/m/d' and 'Y/m'

    Anyone can help?

    Regards
    Jarbas

  2. #2
    Sencha User mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236

    Default

    use this override:
    Code:
    Ext.override(Ext.form.DateField, {
        switchFormat: function(nf) {
            var dt = this.getValue(); // get underlying js Date object
            this.format = nf; // set new format
    
            if (Ext.isDate(dt)) {
                this.setRawValue(dt.format(nf)); // set this DateField's display value
            }
        }
    });

    then
    Code:
    myDatefield.switchFormat('Y/m');
    myDatefield.switchFormat('Y/m/d');


    p.s.
    Quote Originally Posted by jmoraes View Post
    But, getValue always gets the first value defined when the component is rendered when i switch between 'Y/m/d' and 'Y/m'
    that's not true. getValue() always returns the current value of the DateField.
    Last edited by mystix; 9 Dec 2009 at 3:01 AM. Reason: revised -- use setRawValue() instead of setValue() to avoid mucking with the actual stored value

  3. #3
    Ext JS Premium Member
    Join Date
    Jun 2008
    Posts
    15

    Default

    thanks!

    but about your p.s. What am I doing wrong?

    Pick a new date from the datefield and check/uncheck "use day"

    Code:
    var myDateField = new Ext.form.DateField({
    	fieldLabel: 'date',
    	format: 'Y/m/d',
    	value: new Date()
    });
    
    var check = new Ext.form.Checkbox({
    	fieldLabel: 'use day',
    	checked: true,
    	listeners: {
    		check: {
    			fn: function(el, value) {
    				
    				console.log('before switchFormat: '+myDateField.getValue().format('Y/m/d'))
    				if (!value) {
    					myDateField.switchFormat('Y/m')
    				} else {
    					myDateField.switchFormat('Y/m/d')
    				}
    				console.log('after switchFormat: '+myDateField.getValue().format('Y/m/d'))
    			}
    		}
    	}
    });
    
    var form = new Ext.form.FormPanel({
    	renderTo: Ext.getBody(),
    	items: [myDateField, check]
    })
    Regards

  4. #4
    Sencha User mystix's Avatar
    Join Date
    Mar 2007
    Location
    Singapore
    Posts
    6,236

    Default

    i changed my suggested code to avoid mucking with the actual stored value.

    try the updated code instead.

Posting Permissions

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