1. #1
    Sencha User
    Join Date
    May 2012
    Location
    rome
    Posts
    68
    Vote Rating
    0
    Answers
    3
    alexdran is on a distinguished road

      0  

    Default Answered: Calling same view

    Answered: Calling same view


    Hello all,
    I have an app that is moving different screens (login, 1st screen and a second screen with different views each)

    I have addressed the problem with a NavigationView

    now the first screen (navigation view) is calling two items/view:
    - login
    - info (having data loaded from store) (1)

    Code:
    Ext.define("MyApp.view.access1.Main", {
        extend: 'Ext.tab.Panel',
        xtype: 'Main',
    
    
        requires: [
            'Ext.TitleBar'
        ],
        config: {
            tabBarPosition: 'bottom',
            items: [
                {
                    xtype: 'Login'
                },
                {
                    xtype: 'Info'
                }
            ]
        }
    });


    after login the second screen is called; here we have again two items
    - interests
    - info (2)


    Code:
    Ext.define("MyApp.view.access2.MainG", {
        extend: 'Ext.tab.Panel',
        xtype: 'MainG',
    
    
        requires: [
            'Ext.TitleBar',
            'MyApp.view.access2.Gateway',
        ],
    
    
        config: {
            tabBarPosition: 'bottom',
            items: [
                {
                    xtype: 'Gateway'
                },
                {
                    xtype: 'Info'
                }
            ]
        }
    });

    now the problem is: info second screen is blank, no way I can address it with controller. Only way to solve is to comment info in the first screen (1)


    I have tried also to call with

    Code:
            Ext.destroy("infoview");
            Ext.destroy("MyApp.view.info");
    before Pushing MainG => with no success

    Code:
            Ext.destroy("infoview");
            Ext.destroy("SmartConferenceP.view.info");
    
    
            this.getAccess1().push({
                xtype: 'MainG'
            });


    Can you please help me in solving this issue; I'm probably doing something wrong in the logic of the things calling again a View that is already been created (of course "Info" is also declared in app.js file)
    I can provide more code if required

    thank you very much in advance
    Alex

  2. REMOVE your id config in your view definition.
    Your view is not singleton,if you really need id ,config it when you create it.
    Code:
    Ext.define("MyApp.view.access1.Main", {
        extend: 'Ext.tab.Panel',
        xtype: 'Main',
    
    
        requires: [
            'Ext.TitleBar'
        ],
        config: {
            tabBarPosition: 'bottom',
            items: [
                {
                    xtype: 'Login'
                },
                {
                    xtype: 'Info',
                    id:'infoview1'
                }
            ]
        }
    });
    
    Ext.define("MyApp.view.access2.MainG", {
        extend: 'Ext.tab.Panel',
        xtype: 'MainG',
        requires: ['Ext.TitleBar', 'MyApp.view.access2.Gateway' ],
        config: {
            tabBarPosition: 'bottom',
            items: [{
                xtype: 'Gateway'
            },
            {
                xtype: 'Info',
                id: 'infoview2'
            }]
        }
    });

  3. #2
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    227
    Vote Rating
    20
    Answers
    64
    haduki will become famous soon enough haduki will become famous soon enough

      0  

    Default


    Did you assign the 'id' config to your infoview?
    SmartConferenceP.view.info and MyApp.view.info are different class, did you define them with same xtype?
    I write English by translator.

  4. #3
    Sencha User
    Join Date
    May 2012
    Location
    rome
    Posts
    68
    Vote Rating
    0
    Answers
    3
    alexdran is on a distinguished road

      0  

    Default


    that was indeed a mistyping from previous version
    I have reduced the code to restrict the problem

    the code inserted is the one you were mentioning:


    Code:
          Ext.destroy("infoview");
          Ext.destroy("MyApp.view.info");
    
    
    
    
            this.getAccess1().push({
                xtype: 'MainG'
            });
    to complete the information I had also to remove the id from my View class, the screen was in fact totally blank in that case (I gave myself the answer cause they were two classes with the same id)

    but then the question remains:
    calling again the same view declared; how to manage it ?

    the solution of defining different views (2) for each "screen" of the App does not seem an elegant solution to me


    thank you again for any help
    Alessandro

  5. #4
    Sencha User
    Join Date
    May 2012
    Location
    rome
    Posts
    68
    Vote Rating
    0
    Answers
    3
    alexdran is on a distinguished road

      0  

    Default


    I give an answer myself with:

    - reintroducing the id in the Info View class
    - and with the code Ext.getCmp("infoview").destroy();

    now the only problem is when i pop() back to the previous view the Info Panel is not showing nor the button on the bottom bar

    very strange but I feel quite close to the solution ....

  6. #5
    Sencha User
    Join Date
    May 2012
    Location
    rome
    Posts
    68
    Vote Rating
    0
    Answers
    3
    alexdran is on a distinguished road

      0  

    Default


    no; is not working in this way

    anyone has additional suggestions on how to pushing a new view that has the same xtype from the previous one ?

  7. #6
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    227
    Vote Rating
    20
    Answers
    64
    haduki will become famous soon enough haduki will become famous soon enough

      0  

    Default


    why you reintroducing the id again? you had got the answer:remove the id config .
    if your view is not singleton,do not specify the id.

    use Ext.ComponentQuery.query ,container.getComponent (need itemId config),container.down to manage the new view.
    I write English by translator.

  8. #7
    Sencha User
    Join Date
    May 2012
    Location
    rome
    Posts
    68
    Vote Rating
    0
    Answers
    3
    alexdran is on a distinguished road

      0  

    Default


    I have re-introduced the "id" for the solution ( .destroy() ) as experimented with no success

    removing the id is not a solution, the id is not the core of the problem, again the problem is instantiating the same class again (in my opinion).

    here's the code of my view

    Code:
    Ext.define('MyApp.view.Info', {
        extend: 'Ext.Panel',
        xtype: 'Info',
    
    
        config: {
            id: 'infoview',
            title: 'info',
            iconCls: 'info',
    
    
            styleHtmlContent: true,
            scrollable: 'vertical',
            store: 'Info',
    
    
            items: {
                docked: 'top',
                xtype: 'titlebar',
                title: 'InfoView'
            },
    
    
            html: "",
    
    
            masked: {
                xtype: 'loadmask',
                indicator: true
            }
        }
    });

  9. #8
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    227
    Vote Rating
    20
    Answers
    64
    haduki will become famous soon enough haduki will become famous soon enough

      0  

    Default


    REMOVE your id config in your view definition.
    Your view is not singleton,if you really need id ,config it when you create it.
    Code:
    Ext.define("MyApp.view.access1.Main", {
        extend: 'Ext.tab.Panel',
        xtype: 'Main',
    
    
        requires: [
            'Ext.TitleBar'
        ],
        config: {
            tabBarPosition: 'bottom',
            items: [
                {
                    xtype: 'Login'
                },
                {
                    xtype: 'Info',
                    id:'infoview1'
                }
            ]
        }
    });
    
    Ext.define("MyApp.view.access2.MainG", {
        extend: 'Ext.tab.Panel',
        xtype: 'MainG',
        requires: ['Ext.TitleBar', 'MyApp.view.access2.Gateway' ],
        config: {
            tabBarPosition: 'bottom',
            items: [{
                xtype: 'Gateway'
            },
            {
                xtype: 'Info',
                id: 'infoview2'
            }]
        }
    });
    I write English by translator.

  10. #9
    Sencha User
    Join Date
    May 2012
    Location
    rome
    Posts
    68
    Vote Rating
    0
    Answers
    3
    alexdran is on a distinguished road

      0  

    Default


    interesting solution, thank you

    how do I address the control to load the value in the info view

    I have

    Code:
            refs: {
                info: 'Info'
            },
    and

    Code:
    var store = Ext.getStore('infostore');
            var panel = this.getInfo();
            store.load({
    ....
    that is working only for the first (called/created) Info View (now id:infoview1)
    not the second where the indicator remains on the screen (or the third, 4th one -I imagine-).
    Is different controllers the only solution at this point?

    thank you again for suggestions and your help in this

    Alessandro

  11. #10
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    227
    Vote Rating
    20
    Answers
    64
    haduki will become famous soon enough haduki will become famous soon enough

      0  

    Default


    I think i have given the answer.
    Because your infoview is not singleton,you have to use Ext.ComponentQuery.query ,container.getComponent (need itemId config),container.down.(and now you can use Ext.getCmp as well).
    Controller can not control the component which is not singleton.
    You have to:
    Code:
    refs: {
                info1: '#infoview1'
                info2:'#infoview2',
            },
    I write English by translator.

Thread Participants: 1

Tags for this Thread