Mapfish print SimpleForm in Ext-js Accordion

Question

I'm new to Ext-JS and MapFish and I'm trying to accomplish a Mapfish Print 'SimpleForm' window loaded into an Ext-JS accordion. This is something that shouldn't be to hard (I think).

The problem I have is with the WFS Layer used to select the printing area. It only loads after I've collapsed and then expanded the accordionbox containing the Mapfish Print SimpleForm. From what I've read in the API I should be able to call the function 'createTheRectangle' to create this rectangle, so I tried it like this:

    layout:'accordion',
    title: 'Print',
    items:
    [
        {
            xtype: 'print-simple', map: map, layerTree: Ext.getCmp('tree'),
            wantResetButton: true,
            showFeatureButton: true,
            configUrl: GisArts.PrintServer,
            overrides: overrides,
            title: OpenLayers.i18n('gisarts.print.tab.title'),
            listeners: { 'afterrender': {
                    fn: function(){
                        this.createTheRectangle();
                    }
                }},

When the 'afterrender' listener fires the createTheRectangle function in ext-js it gives me the following Error:

this.el is undefined

Coming from the first line of this function (ext-all-debug-w-comments.js line 66710)

getValues : function(asString){
var fs = Ext.lib.Ajax.serializeForm(this.el.dom);

if(asString === true){
    return fs;
}

return Ext.urlDecode(fs);

I suspect the problem lies in the listener firing before the form has completely loaded. One of the functions called by createTheRectangle cannot get the needed options from the form and then raises the error.

Hopefully someone can help me get this SimpleForm to work. Thanks in advance for your help!