// turn on validation errors beside the field globally
    Ext.form.Field.prototype.msgTarget = 'side';

    // BUG FIX for align of checkboxes in forms
    // see: http://extjs.com/forum/showthread.php?t=37685
    Ext.override(Ext.form.Checkbox, {
        onResize : function(){
        Ext.form.Checkbox.superclass.onResize.apply(this, arguments);
            if (!this.boxLabel && !this.fieldLabel) {
                this.el.alignTo(this.wrap, 'c-c');
            }
        }
    }); 

    var tabs = [
      [% FOREACH tname IN lf.tab_order.nsort -%]
        [%- SET info = lf.table_info.$tname %]
        {
            [% IF lf.tab_order.item(tname) == 1 -%]
              title: '[% lf.main.title %]'
            [% ELSE -%]
              title: 'New [% info.title %]'
              ,xtype: 'fieldset'
              ,checkboxToggle: true
              ,checkboxName: 'checkbox.[% info.table %]'
              ,collapsed: true
            [% END -%]

            ,items: [
              [% FOREACH field IN info.col_order %]
              [% NEXT IF info.cols.$field.is_rr %]
                {
                  [%- IF lf.tab_order.item(tname) == 1 %]
                    name: '[% field %]'
                    ,id: '[% field %]'
                  [%- ELSE %]
                    name: '[% info.table %].[% field %]'
                    ,id: '[% info.table %].[% field %]'
                  [%- END %]

                    ,fieldLabel: '[% info.cols.$field.heading %]'
                    ,anchor: '-20'
                    ,autoHeight: true
                  
                  [% IF info.cols.$field.default_value %]
                    ,value: '[% info.cols.$field.default_value %]'
                  [% END %]

                  [% UNLESS info.cols.$field.editable %]
                    ,readOnly: true
                    ,cls: 'x-item-disabled'
                    //,disabled: true // argh, prevents submit :-( so use cls
                  [% ELSIF info.cols.$field.required %]
                    ,allowBlank: false
                  [% END %]

                  [% IF info.cols.$field.is_fk AND info.cols.$field.editable %]
                    ,xtype: 'combo'
                    ,displayField: 'stringified'
                    ,valueField: 'dbid'
                    ,hiddenName: 'combobox.[% field %]'
                    ,loadingText: 'Searching...'
                    ,forceSelection: true
                    ,selectOnFocus: true
                    ,typeAhead: false
                    ,pageSize: 5
                    ,triggerAction: 'all'
                    ,store: new Ext.data.JsonStore({
                        url: '[% c.req.base %]get_stringified/[% info.path %]'
                        ,root: 'rows' ,totalProperty: 'total'
                        ,fields: [ 'dbid', 'stringified' ]
                        ,listeners: {
                            beforeload: function(store, options) {
                                var start = options.params.start;
                                var limit = options.params.limit;
                                options.params.page = Math.floor(start / limit) + 1;
                                options.params.fkname = '[% field %]';
                                return true;
                            }
                        }
                    })
                  [% ELSE %]
                    ,xtype: '[% info.cols.$field.extjs_xtype OR "textfield" %]'
                    [% info.cols.$field.extjs_xtype_extra %]
                  [% END %]
                },
              [% END %]
            ]
        },
      [% END -%]
    ];

    var generate_win = function() {
        return new Ext.Window({
            title: 'Edit [% lf.main.title %]'
            ,id: 'main-win'
            ,collapsible: true
            ,closable: true
            ,width: 400
            ,modal: true
            ,autoHeight: true
            ,layout: 'fit'
    
            // form
            ,items: [{
                xtype: 'form'
                ,id: 'form-panel'
                ,border: false
                ,url: '[% c.req.base %]update/[% lf.main.path %]'
                ,autoHeight: true
                ,layout: 'fit'
    
                // tabpanel
                ,items: [{
                    xtype: 'tabpanel'
                    ,activeTab: 0
                    ,border: false
                    ,deferredRender: false // submit all tabs
                    ,autoHeight: true
    
                    // tab defaults
                    ,defaults: {
                        layout: 'form'
                        ,bodyStyle: 'padding:5px'
                        ,defaultType: 'textfield'
                        ,labelWidth: 100
                        ,buttonAlign: 'right'
                        ,hideMode: 'offsets'
                        ,autoHeight: true
                        ,hideMode: 'offsets'
                    }
    
                    ,items: tabs
                }]
    
                ,buttons: [{
                    text: 'Save'
                    ,handler: function(){
                        Ext.getCmp('form-panel').getForm().submit({
                            waitMsg: 'Saving Data...'
                            ,clientValidation: false
    
                            ,success: function(){
                                Ext.Msg.alert(
                                    'Success', 'Changes have been saved.',
                                    refreshandclose
                                );
                            }
    
                            ,failure: function(){
                                Ext.Msg.alert(
                                    'Error', 'Changes have not been saved!');
                            }
                        });
                    }
                },{
                    text: 'Cancel',
                    handler: function(){
                        Ext.getCmp('main-win').close();
                    }
                }]
            }]
        });
    }

    var refreshandclose = function(btn,text){
        if (btn == 'ok') {
            // XXX using private parts of PagingToolbar
            pagebar.doLoad( pagebar.cursor ); // reload
            Ext.getCmp('main-win').close();
        }
    };