Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    11
    Vote Rating
    0
    CX2 is on a distinguished road

      0  

    Default Add a GridPanel to a Tab using Architect (Ext)

    Add a GridPanel to a Tab using Architect (Ext)


    Not sure if this will get marked as cross threading but I posted this question in the Ext forum and the advice was to work outside of Architect but it does not seem like a complicated request I am asking and I really like Architect...


    Basically I have a tabpanel, and I want to add a gridpanel to it when the user clicks a button. I can add a blank tab to the tabpanel without issue using this
    Code:
    onButtonClick: function(button, e, options) {
    Ext.getCmp('MyTabPanelTest').add({title: 'tab', html: 'Another tab'});
    }

    But I want to load a specific gridpanel I have already defined so I tried this
    Code:
    onButtonClick: function(button, e, options) {
    Ext.getCmp('MyTabPanelTest').add(Ext.getCmp('taskgridpanel'));
    },

    but get this error
    Uncaught TypeError: Cannot read property 'xtype' of undefined

    It would seem a problem with referencing the GridPanel but I am not sure how do properly reference this in Architect

    Here is the code for the GridPanel
    Code:
    Ext.define('MyApp.view.TaskGridPanel', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.taskgridpanel',
    requires: [
    'MyApp.view.CheckColumn'
    ],
    
    frame: true,
    id: 'TaskGridPanel',
    collapsible: true,
    iconCls: 'icon-grid',
    title: 'Task List',
    store: 'FixtureTasksStore',
    
    initComponent: function() {
    var me = this;
    
    Ext.applyIf(me, {
    columns: [
    {
    xtype: 'gridcolumn',
    width: 203,
    dataIndex: 'Task',
    editor: {
    xtype: 'textfield',
    allowBlank: false
    },
    flex: 1,
    text: 'Task'
    },
    {
    xtype: 'checkcolumn',
    id: 'CompleteCheckBox',
    width: 60,
    dataIndex: 'TaskComplete',
    text: 'Complete'
    }
    ],
    viewConfig: {
    
    },
    features: [
    {
    ftype: 'grouping',
    groupHeaderTpl: 'Fixture: {name} ({rows.length} Task{[values.rows.length > 1 ? "s" : ""]})'
    }
    ],
    plugins: [
    Ext.create('Ext.grid.plugin.CellEditing', {
    ptype: 'cellediting',
    clicksToEdit: 1
    })
    ],
    dockedItems: [
    {
    xtype: 'toolbar',
    id: 'taskGridToolbar',
    dock: 'top'
    }
    ]
    });
    
    me.callParent(arguments);
    }
    
    });

  2. #2
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,064
    Vote Rating
    113
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    Ext.getCmp is going to grab a direct reference to an instance of a component.

    Inside of Architect all top level components are subclasses. I'd suggest you drop the id off of the top level class and add it via xtype.

    This will create a new instance of that re-usable class/component.

    Code:
    onButtonClick: function(button, e, options) {
        Ext.getCmp('MyTabPanelTest').add({xtype: 'taskgridpanel'});
    },
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    11
    Vote Rating
    0
    CX2 is on a distinguished road

      0  

    Default


    In Architect how do I create the xtype reference?

  4. #4
    Sencha User
    Join Date
    Jul 2012
    Posts
    11
    Vote Rating
    0
    CX2 is on a distinguished road

      0  

    Default


    I found that if I link my GridPanel to the TabPanel (below), it references the GridPanel using it's xtype and then the button to add the GridPanel to the TabPanel works great; but I still don't understand how it is creating that reference. I scanned over the code to what else changes when I add that link and I can't see any other changes but without that link the button will not work.

    Code:
    Ext.define('MyApp.view.MyTabPanel', {    extend: 'Ext.tab.Panel',
        alias: 'widget.mytabpanel',
        requires: [
            'MyApp.view.TaskGridPanel'
        ],
    
    
        height: 250,
        id: 'MyTabPanelTest',
        width: 400,
        activeTab: 0,
    
    
        initComponent: function() {
            var me = this;
    
    
            Ext.applyIf(me, {
                items: [
                    {
                        xtype: 'panel',
                        title: 'Tab 1'
                    },
                    {
                        xtype: 'taskgridpanel'
                    }
                ]
            });
    
    
            me.callParent(arguments);
        }
    
    
    });

  5. #5
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,064
    Vote Rating
    113
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    userAlias and xtype are nearly synonymous.

    alias is a framework configuration that creates xtypes. When the alias configuration is prefixed with "widget." it will create xtypes. When its prefixed with "plugin." it will create ptypes, etc.
    http://docs.sencha.com/ext-js/4-1/#!...lass-cfg-alias
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  6. #6
    Sencha User
    Join Date
    Jul 2012
    Posts
    11
    Vote Rating
    0
    CX2 is on a distinguished road

      0  

    Default


    My taskgridpanel does have its xtype set correctly then
    Code:
    Ext.define('MyApp.view.TaskGridPanel', {   
     extend: 'Ext.grid.Panel',
        alias: 'widget.taskgridpanel',
        requires: [
            'MyApp.view.CheckColumn'
        ],
    and I can add taskgridpanel to a new tab using
    Code:
    Ext.getCmp('MyTabPanelTest').add({xtype: 'taskgridpanel'});
    but ONLY if taskgridpanel is configured to display when the app first loads.

    So is there something in how the app loads that if the view is not included in the initial view it does not register the gridpanel.

    Big picture...I want to have a menu on the left and a blank tabpanel on the right, and the user can click to open one of the options in the menu and it will then open in the tabpanel.

    Thanks so much for the reply!

  7. #7
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,064
    Vote Rating
    113
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    Quote Originally Posted by CX2 View Post
    but ONLY if taskgridpanel is configured to display when the app first loads.

    So is there something in how the app loads that if the view is not included in the initial view it does not register the gridpanel.
    More details? Error? Blank screen? etc
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  8. #8
    Sencha User
    Join Date
    Jul 2012
    Posts
    11
    Vote Rating
    0
    CX2 is on a distinguished road

      0  

    Default


    It is working now.... I was browsing the files that SA deployed and noticed there were a lot of artefacts from panels, grids, etc that I was messing around with and then deleted; SA only updates modified files and does not remove deleted ones. I deleted all the files and redeployed and now it works...seems strange since if the files are deleted out of SA they are not referenced in the application...anyhoo its working so moving on

  9. #9
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,064
    Vote Rating
    113
    aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold aconran is a splendid one to behold

      0  

    Default


    Quote Originally Posted by CX2 View Post
    I deleted all the files and redeployed and now it works...seems strange since if the files are deleted out of SA they are not referenced in the application...anyhoo its working so moving on
    Files within the project's app and metadata directories should be maintained/cleaned up.

    Files that are in a deployed directory are no longer managed by Sencha Architect. When it's been deployed it is sort of out of Architect's control and is just a file system level at that point.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

Thread Participants: 1