1. #1
    Sencha User
    Join Date
    Aug 2011
    Location
    London
    Posts
    393
    Answers
    14
    Vote Rating
    16
    digeridoopoo will become famous soon enough

      0  

    Default Unanswered: Getters, Setters and Ext.getCmp - how to update another panel on tap

    Unanswered: Getters, Setters and Ext.getCmp - how to update another panel on tap


    I'm trying to understand the relationship with getters and setters and Ext.getCmp properly in regards to getting information and updating a panel.
    I basically understand how getters and setters work, referring to the city bars example this bit of code is used, so that on tap the new view is pushed into view in a single screen:
    Code:
    me.getMainNav().push(details);
    However I get stuck when in a split screen scenario where I would like to update the main panel when tapping on the left hand panel. The detail panel has an id of detail panel and class name of DetailPanel.
    I have tried bits of code like this:
    Code:
    me.getDetailPanel().push(details);
    but I get the error:
    Code:
    Uncaught TypeError: Object [object Object] has no method 'getDetailPanel'
    How would you go about updating another panel with information instead of pushing into an existing view like the above?


    Would I have to use Ext.getCmp?


    Thanks

  2. #2
    Sencha User
    Join Date
    Nov 2012
    Location
    Netherlands
    Posts
    50
    Answers
    6
    Vote Rating
    1
    eastlander is on a distinguished road

      0  

    Default


    try:
    Code:
    Ext.Viewport.down('#idofotherpanel')
    or

    Code:
    Ext.Viewport.down('panel[class=classofotherpanel]')

  3. #3
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,018
    Answers
    3491
    Vote Rating
    849
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Is the getDetailPanel method coming from a ref?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #4
    Sencha User
    Join Date
    Aug 2011
    Location
    London
    Posts
    393
    Answers
    14
    Vote Rating
    16
    digeridoopoo will become famous soon enough

      0  

    Default Set a ref...

    Set a ref...


    The confusion for me is whether I should be 'pushing' the page to the detail view or if I should be using some other method. Is pushing an item into view usually only used in single screen views, or can you push to other components?

    When I try this code (I'm posting a bit more for you to see) I get in the console this error:

    Code:
    'Uncaught TypeError: Object [object Object] has no method 'push''
    So I'm guessing I can't use the push method.

    I'm starting to think maybe the detail panel should be a viewport somehow and it should just be updating the viewport on tap but not sure where to go from here. Here's some more code:


    Code:
    Ext.define('CityBars.controller.Business', {
        extend: 'Ext.app.Controller',
    
    
        config: {
            refs: {
                dataList: '#dataList',
                listCard: '#listCard',
                mainNav: 'mainnav',
                detailPanel: '#detailpanel'
            },
    
    
            control: {
                "#dataList": {
                    itemtap: 'onListItemTap'
                },
                "detailpanel button[text='Call']": {
                    tap: 'onCallButtonTap'
                }
            }
        },
    
    
        onListItemTap: function(dataview, index, target, record, e, options) {
            var me = this,
                map,
                lat,
                lon,
                loc,
                marker,
                info, details;
    
    
            if (record) {
    
    
                details = Ext.create('CityBars.view.DetailPanel', {
                    title: 'Details'
                });
    
    
                // set the map
                map = details.child('#detailMap');
                lat = record.get('latitude');
                lon = record.get('longitude');
    
    
                map.setMapOptions({
                    zoom: 18
                });
    
    
                map.setMapCenter({
                    latitude: lat,
                    longitude: lon
                });
    
    
                // set the info
                //   info = details.child('#contact').child('#info');
                //   info.child('#photo').setData(record.data);
                //   info.child('#data').setData(record.data);
    
    
                //     me.getMainNav().push(details);
                var DetailPanel = Ext.getCmp('detailpanel');
                me.getDetailPanel().push(details);  --> Doesnt work, pushing the details from above into the detailpanel
                //   Ext.Viewport.add('#detailpanel')
    
    
            }
        },