Results 1 to 4 of 4

Thread: Component query to get the picket from datefield

  1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    221
    Answers
    10

    Default Component query to get the picket from datefield

    Hi All,

    Below code is finding the datefield and extracting the datePicket from it attaching beforeshow event.


    Code:
    Ext.create('Ext.form.Panel', {
        renderTo: Ext.getBody(),
        width: 300,
        bodyPadding: 10,
        title: 'Dates',
        items: [{
            xtype: 'datefield',
            anchor: '100%'
        }]
    });
    var dateField = Ext.ComponentQuery.query('datefield');
    var picker = dateField[0].getPicker();
    picker.on('beforeshow', function() {
      console.log('beforeshow fired');   
      return false;
    });

    I want to write the same code using componentquery in my controller's init function. Please help me write this query.

    Code:
    Ext.define('My.controller.FilterController',
    {
        extend: 'Ext.app.Controller',
         init: function () {
            this.control({
    //Problem: how to write var picker = Ext.ComponentQuery.query('from-datefield')[0].getPicker(); in my controller
                   'myview #from-datefield': {
                    beforeshow: this.onBeforeShow
                }
       });
     },
    onBeforeShow: function (ctrl, eOpts) {
            alert('before show');
     return false;
        },
    The idea is to transalte "var dateField = Ext.ComponentQuery.query('datefield');
    var picker = dateField[0].getPicker();" into a query which I can use within the init() of my controller.

  2. #2
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347

    Default

    Try this:
    Code:
    Ext.define('My.controller.FilterController', {
        extend: 'Ext.app.Controller',
        init: function () {
            var me = this;
            me.control({
                //Problem: how to write var picker = Ext.ComponentQuery.query('from-datefield')[0].getPicker(); in my controller
                'myview #from-datefield': {
                    render: function(){
                        var picker = this.getPicker();
                        picker.on('beforeshow', me.onBeforeShow, me);
                    }
                }
            });
        },
        onBeforeShow: function (ctrl, eOpts) {
            alert('before show');
            return false;
        },

  3. #3
    Sencha User
    Join Date
    Feb 2012
    Posts
    221
    Answers
    10

    Default

    Hi Vietits,

    System is saying this.getPicker() is undefined. .

  4. #4
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347

    Default

    Sorry, try to fix the code as below:
    Code:
    Ext.define('My.controller.FilterController', {
        extend: 'Ext.app.Controller',
        init: function () {
            var me = this;
            me.control({
                //Problem: how to write var picker = Ext.ComponentQuery.query('from-datefield')[0].getPicker(); in my controller
                'myview #from-datefield': {
                    render: function(field){
                        var picker = field.getPicker();
                        picker.on('beforeshow', me.onBeforeShow, me);
                    }
                }
            });
        },
        onBeforeShow: function (ctrl, eOpts) {
            alert('before show');
            return false;
        },

Tags for this Thread

Posting Permissions

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