1. #1
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    17
    Vote Rating
    0
    cweirich is on a distinguished road

      0  

    Question Custom Events

    Custom Events


    Hi,

    I'm trying to use custom events in architect, so I've done the following

    1) In the ClientForm view, I've added a Custom Event named 'clientsaved'.
    2) In the ClientController, I've added a controller action with ClientForm as the targetType and 'clientsaved' as the EventBinding. In this action, there's just a call to console.log to check if it's executing.
    3) In the success callback of the submit action, I've fired the 'clientsaved' event, like this:

    Code:
    this.form.submit({
            waitMsg: 'Saving...',
            success: function(form, action) {
                Ext.Msg.alert('Client Saved!');
                form.fireEvent('clientsaved');
                console.log('client saved event fired');
            },
            failure: function(form, action) {
                if (action.result) {
                    Ext.Msg.alert('Error', action.result.Message);
                }
                else { 
                    Ext.Msg.alert('Error', 'Unexpected Error.');
                }
            }
        });
    And the method configured to be executed in the controller never gets called.
    What am I doing wrong?

    Thanks.

  2. #2
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,306
    Vote Rating
    125
    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


    So typically when you are firing events you will fire from the "this" scope.

    You should be firing the event from the same place you define it at.

    We'll need some more data as to what your control query looks like and what the clientform definition looks like to help you more.
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  3. #3
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    17
    Vote Rating
    0
    cweirich is on a distinguished road

      0  

    Default


    I know scope can be confusing in JS (so maybe I'm confused) but isn't the form object that's calling fireEvent the one where the event is defined? I mean, the submit action parameter 'form' is the form where it originated (ClientForm) right?

    Also, even if this callback method was defined inside the form, wouldn't 'this' be a reference to the submit action?

    The action configuration:

    controlQuery: #clientForm
    targetType: ClientForm
    fn: onClientFormClientsaved
    name: clientsaved

    The function:

    Code:
    onClientFormClientsaved: function(eventOptions) {
             console.log('client saved event caught');
    }
    ClientForm:

    Code:
    Ext.define('PBAS.view.ClientForm', {
        extend: 'Ext.form.Panel',
        requires: [
            'PBAS.view.ClientDetailsFieldSet',
            'PBAS.view.ContactFieldSet',
            'PBAS.view.BusinessSourceFieldSet',
            'PBAS.view.PlansFieldSet',
            'PBAS.view.InvoicesFieldSet'
        ],
    
        draggable: true,
        floating: true,
        height: 675,
        id: 'clientForm',
        width: 720,
        autoScroll: true,
        bodyPadding: 10,
        closable: true,
        title: 'Client',
    
        initComponent: function() {
            var me = this;
    
            me.addEvents(
                'clientsaved'
            );
    
            Ext.applyIf(me, {
                items: [lots of items]
            });
    
            me.callParent(arguments);
        }
    
    });
    Just let me know if you need more info.

    Thanks.

  4. #4
    Sencha - Architect Dev Team aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,306
    Vote Rating
    125
    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


    The same class that has me.addEvents('clientsaved') should also have this.fireEvent('clientsaved')
    Aaron Conran
    @aconran
    Sencha Architect Development Team

  5. #5
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    17
    Vote Rating
    0
    cweirich is on a distinguished road

      0  

    Default


    Ok, solved it.

    First, one important thing is that the form passed in the callback function is not the form panel, but the basic form. So I had to use button.up('.panel') to get a reference for it.

    Second, based on your feedback I created a fireClientSavedEvent function in the form to do this.fireEvent and then it worked.

    So clientForm.fireEvent('clientsaved') doesn't work and clientForm.fireClientSavedEvent() works.

    Thanks for your help, aconran.

Thread Participants: 1

Tags for this Thread