<![CDATA[ Link Actionbutton with beforeSave event - My Forums]]> https://forums.modx.com/thread/?thread=104672 <![CDATA[Link Actionbutton with beforeSave event]]> https://forums.modx.com/thread/104672/link-actionbutton-with-beforesave-event#dis-post-562962
I'm trying to develop as custom Extra. I was following the guide from Modx for extras.
As the pop-up window is too small for all my fields I'm trying to develop a page for CRUD-Operations.

I tried to copy from the default workspace/package.
From there I have a component as page:

Kinderherzfuehrer.page.Praxis = function(config) {
    config = config || {};
    Ext.applyIf(config,{
        formpanel: 'kinderherzfuehrer-panel-praxis'
        ,components: [{
            xtype: 'kinderherzfuehrer-panel-praxis'
            ,id: MODx.request.id
        }]
        ,buttons: [{
            process: 'save'
            ,url: Kinderherzfuehrer.config.connectorUrl
            ,baseParams: { action: 'mgr/praxen/update' }
            ,text: _('save')
            ,id: 'modx-abtn-save'
            ,cls: 'primary-button'
            ,method: 'remote'
            //,checkDirty: true
            ,keys: [{
                key: MODx.config.keymap_save || 's'
                ,alt: true
                ,ctrl: true
            }]

        },{
            process: 'cancel'
            ,text: _('cancel')
            ,id: 'modx-abtn-cancel'
            ,handler: function() {
                MODx.loadPage('index', 'namespace=kinderherzfuehrer');
            }
        }]
    });
    Kinderherzfuehrer.page.Praxis.superclass.constructor.call(this,config);
};
Ext.extend(Kinderherzfuehrer.page.Praxis,MODx.Component);
Ext.reg('kinderherzfuehrer-page-praxis',Kinderherzfuehrer.page.Praxis);


As I understood the default action buttons are defined here.

Secondly I have a JS-file for the panel (for here are only two fields in list...)

Kinderherzfuehrer.panel.Praxis = function(config) {
    config = config || {};
    Ext.applyIf(config,{
        id: 'modx-panel-package'
        ,url: Kinderherzfuehrer.config.connectorUrl
        ,baseParams: { action: 'mgr/praxen/update' }
        ,cls: 'container'
        ,chunk: ''
        ,bodyStyle: ''
        ,items: [{
            html: _('package')
            ,id: 'modx-package-header'
            ,xtype: 'modx-header'
        },MODx.getPageStructure([{
            title: _('general')
            ,defaults: { border: false }
            ,layout: 'form'
            ,id: 'modx-package-form'
            ,labelWidth: 150
            ,items: [{
                xtype: 'panel'
                ,border: false
                ,cls:'main-wrapper'
                ,layout: 'form'
                ,items: [{
                        xtype: 'hidden'
                        ,name: 'id'
                        ,value: config.id
                    },{
                    xtype: 'textfield'
                    ,fieldLabel: _('anrede')
                    ,name: 'anrede'
                    ,width: 300
                },{
                        xtype: 'textfield'
                        ,fieldLabel: _('titel')
                        ,name: 'titel'
                        ,width: 300
                    }
                       ]
            }]
        }]
        )]
        ,listeners: {
            'setup': {fn:this.setup,scope:this}
            ,'success': {fn:this.success,scope:this}
            ,'beforeSubmit': {fn:this.beforeSubmit,scope:this}
            ,'fieldChange': {fn:this.fieldChange, scope:this}
        }
    });
    Kinderherzfuehrer.panel.Praxis.superclass.constructor.call(this,config);
};
Ext.extend(Kinderherzfuehrer.panel.Praxis,MODx.FormPanel,{
    initialized: false
    ,setup: function() {
        if (this.config.id === '' || this.config.id === 0 || this.initialized) {
            this.fireEvent('ready');
            return false;
        }
        MODx.Ajax.request({
            url: Kinderherzfuehrer.config.connectorUrl
            ,params: {
                action: 'mgr/praxen/get'
                ,id: this.config.id
            }
            ,listeners: {
                'success': {fn:function(r) {
                        this.getForm().setValues(r.object);
                        Ext.getCmp('modx-package-header').getEl().update(_('package')+': '+r.object.id);
                        this.fireEvent('ready',r.object);

                        this.initialized = true;
                    },scope:this}
            }
        });
    }
    ,beforeSubmit: function(o) {
        return this.fireEvent('save',{
            values: this.getForm().getValues()
        });
    }
    ,success: function(r) {
    }
    ,fieldChange: function(c) {
        console.log(c.field);
    }
});
Ext.reg('kinderherzfuehrer-panel-praxis',Kinderherzfuehrer.panel.Praxis);




If I press the "save"-button nothing is happening.
Any help?

Thanks Bernhard

P.S.: The processor are working when using the pop-up-window...]]>
dhsbernhard Nov 27, 2018, 03:56 PM https://forums.modx.com/thread/104672/link-actionbutton-with-beforesave-event#dis-post-562962