Hybrid View

  1. #1
    Touch Premium Member pkellner's Avatar
    Join Date
    Sep 2008
    Location
    San Jose, California
    Posts
    704
    Vote Rating
    23
    pkellner will become famous soon enough pkellner will become famous soon enough

      0  

    Default Confused on ItemId versus Id when used with controller / componentquery

    Confused on ItemId versus Id when used with controller / componentquery


    I had thought that a controls id always would work and that only itemId works when the control is either a sibling or child. I've got the code below for a controller that listens for a button click (among other things). It does not respond when the button (continueButtonId) is set as the id property of the button, but the controller does respond when continueButtonId is the itemId of the button.

    What am I understanding incorrectly?

    Code:
    Ext.define('RegistrationApp.controller.RegisterSpeakerAttendeeSponsorController', {
        extend: 'Ext.app.Controller',
    
    
        onRbAttendeeChange: function(field, newValue, oldValue, options) {
            //console.log('onRbAttendeeChange');
    
    
            if (newValue == true) {
                this.rbChoice = 'attendee';
            }
    
    
            this.enableContinueButtonIfDisabled();
        },
    
    
        onRbSpeakerChange: function(field, newValue, oldValue, options) {
    
    
            //console.log('onRbSpeakerChange');
    
    
            if (newValue == true) {
                this.rbChoice = 'speaker';
            }
    
    
            this.enableContinueButtonIfDisabled();
        },
    
    
        onRbSponsorChange: function(field, newValue, oldValue, options) {
            //console.log('onRbSponsorChange');
    
    
            if (newValue == true) {
                this.rbChoice = 'sponsor';
            }
    
    
            this.enableContinueButtonIfDisabled();
        },
    
    
        onContinueButtonIdClick: function(button, e, options) {
            //console.log('continue: ' + this.rbChoice);
    
    
            var tabWizardPanel = Ext.ComponentQuery.query('#TabWizardId')[0];
    
    
            if (this.rbChoice === 'speaker' || this.rbChoice == 'attendee') {
                //console.log('speaker or attendee');
                tabWizardPanel.setActiveTab(1);
            } else if (this.rbChoice == 'sponsor') {
                //console.log('sponsor');
                tabWizardPanel.setActiveTab(2);
            }
    
    
    
    
        },
    
    
        enableContinueButtonIfDisabled: function() {
            var continueButton = Ext.ComponentQuery.query('#continueButtonId')[0];
    
    
            if (continueButton.isDisabled()) {
                continueButton.enable();
            }   
    
    
        },
    
    
        init: function(application) {
            this.control({
                "#rbAttendee": {
                    change: this.onRbAttendeeChange
                },
                "#rbSpeaker": {
                    change: this.onRbSpeakerChange
                },
                "#rbSponsor": {
                    change: this.onRbSponsorChange
                },
                "#continueButtonId": {
                    click: this.onContinueButtonIdClick
                }
            });
        }
    
    
    });

  2. #2
    Sencha User
    Join Date
    Jan 2013
    Location
    Germany, Freiburg i. Br.
    Posts
    26
    Vote Rating
    7
    StudentDaniel is on a distinguished road

      0  

    Default


    Hi :-)

    yesterday I read this:

    http://docs.sencha.com/architect/2/#!/guide/controllers

    and I think, you should do this maybe a second time.

    Maybe you have a scope problem. The reference will auto-add you a getter like getReference-Name and the id will be fetched automaticaly. So you have to set the id and not the itemId !

    This is different by using an event-handler ! Controller-Actions will use referenced by id.

    I hope this is exact - if not - sorry :-)

    But I think you are confused and the linked Doc will bring you back to the red line :-)

  3. #3
    Sencha Premium Member vadimv's Avatar
    Join Date
    Sep 2010
    Location
    Chisinau, Moldova
    Posts
    647
    Vote Rating
    25
    vadimv will become famous soon enough vadimv will become famous soon enough

      0  

    Default


    When it's about writing selectors for ComponentQuery, itemId and id are the same, when it's about getting direct items of a container then of course you use itemId.

    If an event is not fired then very probably that you have a wrong selector, so you can directly in console to test if you selector is ok and returns some results by using Ext.Component.query(selector).

    In your case should work both. Usually when there are more views per controller I write selectors for buttons this way:
    Code:
     'views_xtype #btns_itemId' : {}
    it adds some readability to code.

  4. #4
    Touch Premium Member pkellner's Avatar
    Join Date
    Sep 2008
    Location
    San Jose, California
    Posts
    704
    Vote Rating
    23
    pkellner will become famous soon enough pkellner will become famous soon enough

      0  

    Default


    vadimn,
    is 'views_xtype' the name of your controller?
    Also, I'm wondering if what I found is a bug. I would have though both would work (itemid and id) in ComponentQuery but the most definitely do not. In my example it is easy to set itemId to blank and Id to the same value and the controller never sees the event.

  5. #5
    Sencha Premium Member vadimv's Avatar
    Join Date
    Sep 2010
    Location
    Chisinau, Moldova
    Posts
    647
    Vote Rating
    25
    vadimv will become famous soon enough vadimv will become famous soon enough

      0  

    Default


    no, that's the xtype of the view which has the button. I'm sure that is not a bug. Post the code of the view with the button. Also better to use itemIds then id's.



  6. #6
    Touch Premium Member pkellner's Avatar
    Join Date
    Sep 2008
    Location
    San Jose, California
    Posts
    704
    Vote Rating
    23
    pkellner will become famous soon enough pkellner will become famous soon enough

      0  

    Default


    Here is where the button is. if I change itemId: rbSponsor to id: rbSponsor it does not fire. Does that make sense? please explain further. I really want to understand this (and thanks for your help)

    Code:
    Ext.define('RegistrationApp.view.AttendeeSpeakerOrSponsor', {
        extend: 'Ext.panel.Panel',
        alias: 'widget.AttendeeSpeakerOrSponsorAlias',
    
    
        id: 'attendeespeakerorsponsorid',
        layout: {
            align: 'stretch',
            type: 'vbox'
        },
        bodyPadding: 20,
        title: 'Silicon Valley Code Camp Registration',
    
    
        initComponent: function() {
            var me = this;
    
    
            Ext.applyIf(me, {
                items: [
                    {
                        xtype: 'radiogroup',
                        itemId: 'RadiobuttonGrp',
                        width: 400,
                        defaultType: 'radio',
                        layout: {
                            align: 'stretch',
                            type: 'vbox'
                        },
                        fieldLabel: '',
                        vertical: false,
                        items: [
                            {
                                xtype: 'radiofield',
                                itemId: 'rbAttendee',
                                name: 'attendeeType',
                                boxLabel: 'Attendee'
                            },
                            {
                                xtype: 'radiofield',
                                itemId: 'rbSpeaker',
                                name: 'attendeeType',
                                boxLabel: 'Speaker'
                            },
                            {
                                xtype: 'radiofield',
                                itemId: 'rbSponsor',
                                name: 'attendeeType',
                                boxLabel: 'Interested In Sponsoring'
                            }
                        ]
                    }
                ],
                dockedItems: [
                    {
                        xtype: 'toolbar',
                        flex: 1,
                        dock: 'bottom',
                        height: 50,
                        itemId: 'ToolBarAttendeeSpeakerSponsor',
                        layout: {
                            pack: 'end',
                            type: 'hbox'
                        },
                        items: [
                            {
                                xtype: 'tbseparator'
                            },
                            {
                                xtype: 'button',
                                disabled: true,
                                itemId: 'continueButtonId',
                                iconAlign: 'right',
                                text: 'Continue'
                            }
                        ]
                    }
                ]
            });
    
    
            me.callParent(arguments);
        }
    
    
    });

  7. #7
    Sencha Premium Member vadimv's Avatar
    Join Date
    Sep 2010
    Location
    Chisinau, Moldova
    Posts
    647
    Vote Rating
    25
    vadimv will become famous soon enough vadimv will become famous soon enough

      0  

    Default


    Does the
    Code:
    Ext.ComponentQuery.query('#
    continueButtonId')

    return anything ?

Thread Participants: 2

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar