Results 1 to 5 of 5

Thread: Custom Events

  1. #1
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    17
    Vote Rating
    0
      0  

    Question 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 User aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,487
    Vote Rating
    146
      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

  3. #3
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    17
    Vote Rating
    0
      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 User aconran's Avatar
    Join Date
    Mar 2007
    Posts
    9,487
    Vote Rating
    146
      0  

    Default

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

  5. #5
    Sencha Premium Member
    Join Date
    May 2012
    Posts
    17
    Vote Rating
    0
      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.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •