Results 1 to 3 of 3

Thread: Adding Toolbar / Topbar / Docked Items dynamically

  1. #1
    Sencha User
    Join Date
    Aug 2013
    Posts
    97
    Answers
    4

    Default Answered: Adding Toolbar / Topbar / Docked Items dynamically

    Greetings,

    I have the following custom GridPanel class. I want to be able to add Topbar / Toolbar / Docked Items after I have instantiated an object, and not through a predefined config.

    Code:
    Ext.define('Base.GridPanel', {
        extend: 'Ext.grid.Panel',
    
        tbar: [{ xtype: 'textfield', emptyText: 'Case ID', width: 90 }, { xtype: 'button', text: 'Open Case' }, { xtype: 'button', text: 'Refresh List' }],
        dockedItems: [{ xtype: 'pagingtoolbar', dock: 'bottom' }],
    
        constructor : function(config)
        {
            this.initConfig(config);
        },
    
        constructor: function(id, title, columns) 
        {
            this.id = id;
            this.title = title;
            this.columns = columns;
    
            this.callParent();
        }
    });
    For example, what would I have to do after creating a GridPanel, to achieve the same results if the tbar and dockedItems properties weren't already in the config?

    Code:
    var myGridPanel = new Base.GridPanel('MyGridPanel', 'Test', columns)

  2. Use the addDocked() method

    Code:
        panel.addDocked({
            xtype: 'toolbar',
            dock: 'bottom',
            items: [{
                text: 'button'
            }]
        });
    Also I noticed in your example you have two constructors. Not sure what your intent was there, but JavaScript does not support overloaded methods. The second constructor will simply overwrite the first one.

  3. #2
    Sencha User Phil Guerrant's Avatar
    Join Date
    May 2011
    Location
    Colorado
    Posts
    352
    Answers
    32

    Default

    Use the addDocked() method

    Code:
        panel.addDocked({
            xtype: 'toolbar',
            dock: 'bottom',
            items: [{
                text: 'button'
            }]
        });
    Also I noticed in your example you have two constructors. Not sure what your intent was there, but JavaScript does not support overloaded methods. The second constructor will simply overwrite the first one.
    Phil Guerrant
    Ext JS - Development Team

  4. #3
    Sencha User
    Join Date
    Aug 2013
    Posts
    97
    Answers
    4

    Default

    Quote Originally Posted by Phil Guerrant View Post
    Use the addDocked() method
    Also I noticed in your example you have two constructors. Not sure what your intent was there, but JavaScript does not support overloaded methods. The second constructor will simply overwrite the first one.
    Thank you.

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
  •