Results 1 to 6 of 6

Thread: Handling 'Show' and 'Hide' events in the FormPanel

  1. #1

    Question Handling 'Show' and 'Hide' events in the FormPanel

    I have a FormPanel wrapped in a Window. I want to handle the Show and Hide events in the FormPanel class. It seems these events are not passed to FormPanel, any idea why and how I can enable that.

  2. #2
    Ext JS Premium Member cnelissen's Avatar
    Join Date
    Sep 2007
    Location
    California
    Posts
    226

    Default

    How about posting some code so we can take a look....

    Also I think a little more explaining is in order. You want to listen for show/hide events of the window? or the formpanel?
    - Clint Nelissen

  3. #3

    Default

    I would like to listen to 'Show' & 'Hide' in the FormPanel hosted in a Window. I guess one way would be to relayEvent() from the Window 'Show' and 'Hide' to the FormPanel (I have not played with that yet). I was looking for some inbuilt mechanism, maybe a config option on Window to do this auto-magically.

  4. #4
    Ext JS Premium Member cnelissen's Avatar
    Join Date
    Sep 2007
    Location
    California
    Posts
    226

    Default

    I still don't understand what you mean... Posting code would be very helpful.

    You can always listen for events on any element regardless of its nesting... You can just setup a listener on the form, you don't need to do anything with the window. Or you can setup a listener on the window and not worry about the form. Or you can setup a listener for both the form and window. You can also use the hideParent config option on the form to hide the window when the form is hidden...

    Without seeing the code for what you are attempting its tough to give you much help.
    - Clint Nelissen

  5. #5

    Default

    Here you go
    Code:
    Ext.namespace('myWebsite');
    
    myWebsite.usersRecord = Ext.extend(Ext.FormPanel, {
        frame: true,
        border: false,
        labelWidth: 100,
        labelAlign: 'left',
        layout: 'form',
        padding: 0,
        width: 350,
        defaultType: 'textfield',
        autoHeight: true,
        closable: true,
        listeners: {
            hide: {
                fn: function(p) {
                    // Handle show & hide in the FormPanel
                    debugger;
                }
            },
            show: {
                fn: function(p) {
                    // Handle show & hide in the FormPanel
                    debugger;
                }
            }
        },
        constructor: function(config) {
            myWebsite.usersRecord.superclass.constructor.call(this, config);
        }
    });
    
    Ext.reg('myRecordPanel', myWebsite.usersRecord);
    
    myWebsite.usersRecordDlg = Ext.extend(Ext.Window, {
        title: 'My Title',
        border: false,
        modal: true,
        resizable: true,
        width: 350,
        autoHeight: true,
        height: 300,
        minWidth: 300,
        minHeight: 250,
        layout: 'fit',
        initComponent: function() {
            Ext.apply(this, {
                closeAction: 'hide',
                keys: [{
                    key: 27,
                    fn: function() {
                        this.hide();
                    },
                    scope: this
                }],
                items: [{
                    xtype: 'myRecordPanel'
                }]
            });
            myWebsite.usersRecordDlg.superclass.initComponent.call(this);
        }
    });
    Ext.reg('myRecordPanelDlg', myWebsite.usersRecordDlg);

  6. #6
    Ext JS Premium Member cnelissen's Avatar
    Join Date
    Sep 2007
    Location
    California
    Posts
    226

    Default

    So you want to do something to the form when the window gets hidden? Events do not cascade down that way, meaning that when you call the hide method on a component, it does not call hide on child components, because if the parent is hidden, then the children will be hidden, so it would be unnecessary. The hide/show events will never get called on the form when you hide/show the window.

    I don't see how this would ultimately matter though, since you could just as easily setup your code to listen for the events on the window component instead of the form.
    - Clint Nelissen

Posting Permissions

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