Hybrid View

  1. #1
    Sencha Premium Member
    Join Date
    Sep 2010
    Posts
    89
    Vote Rating
    0
    xun is an unknown quantity at this point

      0  

    Default Unanswered: Ext datefield setValue how??

    Unanswered: Ext datefield setValue how??


    i wonder how the setValue method of Ext.form.field.date work? A dummy example here:


    var item = {
    xtype: 'datefield',
    anchor: '100%',
    fieldLabel: 'From',
    id: 'from',
    name: 'from_date',
    maxValue: new Date() // limited to the current date or prior
    };
    item.setValue(new Date());


    the last line would give me an error, saying item.setValue is not a function. How can that be?

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,197
    Vote Rating
    482
    Answers
    690
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    You can use value: new Date() to set this initially. As for your call, based on code:

    var item = Ext.getCmp('from'); // id property; we also recommend not using id, but rather itemId
    item.setValue(new Date());

    Regards,
    Scott.

  3. #3
    Sencha Premium Member
    Join Date
    Sep 2010
    Posts
    89
    Vote Rating
    0
    xun is an unknown quantity at this point

      -1  

    Default


    Thanks. Where should i place the getCmp call?

    In my little dummy case, it is defined as such:

    Code:
    Ext.define('Direct.Test.Dashboard', {
        extend: 'Ext.panel.Panel',
        alias: 'widget.dashboard',
        title: 'Button',
        minHeight: 500,
        items: [],
    
        layout: {
            type: 'vbox',
            align: 'left'
        },
    
        initComponent: function () {
            var item = {
                xtype: 'datefield',
                anchor: '100%',
                fieldLabel: 'From',
                id: 'from',
                name: 'from_date',
                value: new Date(),
                maxValue: new Date()  // limited to the current date or prior
            };
            //        item.setValue(Ext.Date.add( new Date(), Ext.Date.Day, -7));
            this.items.push(item);
            this.callParent(arguments);
        },
    
        afterRender: function () {
            var item = Ext.getCmp('from');
            item.setValue(new Date());
        }
    });
    And i get error: container not defined.

    Also, can you elaborate on "we also recommend not using id, but rather itemId item.setValue(new Date());"

    I read getCmp is dangerous, but everyone is using it, even the samples provided by sencha

  4. #4
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,197
    Vote Rating
    482
    Answers
    690
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    See if this helps:

    Code:
    Ext.define('Direct.Test.Dashboard', {
        extend: 'Ext.panel.Panel',
        alias: 'widget.dashboard',
        title: 'Button',
        height: 500,
        width: 500,
        minHeight: 500,
        items: [],
    
        layout: {
            type: 'form',
            align: 'left'
        },
    
        initComponent: function () {
            var item = {
                xtype: 'datefield',
                anchor: '100%',
                fieldLabel: 'From',
                id: 'from',
                name: 'from_date',
                //value: new Date(),
                maxValue: new Date()  // limited to the current date or prior
            };
            //        item.setValue(Ext.Date.add( new Date(), Ext.Date.Day, -7));
            this.items.push(item);
            this.callParent(arguments);
        },
    
    	listeners: {
    	    afterrender: function () {
    	        var df = Ext.getCmp('from');
    	        df.setValue(new Date());
    	    }
    	}
    
    
    });
    
    Ext.onReady(function(){
    
    	Ext.create('Direct.Test.Dashboard',{
    		renderTo: Ext.getBody()
    	});
     
    });
    Regards,
    Scott.

  5. #5
    Sencha Premium Member
    Join Date
    Sep 2010
    Posts
    89
    Vote Rating
    0
    xun is an unknown quantity at this point

      0  

    Default


    Thanks. It works. But why? When do i need to add afterrender, onRender, etc into listeners? Most of my custom components have afterrender without being part of listeners. Why this one would need a listener to handle?

    Sorry, i just do not understand the difference of having vs. not having listeners for the render-related events.

    And how do I minimize the space between the field label and the actual datefield? I tried to use labelWidth, labelStyle, none works.

    thanks again

  6. #6
    Sencha Premium Member
    Join Date
    Sep 2010
    Posts
    89
    Vote Rating
    0
    xun is an unknown quantity at this point

      0  

    Default


    Wonder if i can get an answer to the above question?

  7. #7
    Sencha User
    Join Date
    Oct 2013
    Posts
    8
    Vote Rating
    -5
    andersoninfidelitysencha can only hope to improve

      0  

    Default


    How can I override Extjs TextField? make it works like Date component, display content use some other format, but pass original value.