ExtJs - FormPanel not rendering properly

Question

Hello guys!

I have constuctor (window + formPanel)

AddOrgWindowUI = Ext.extend(Ext.Window, {
title: 'Create something',
width: 400,
height: 200,
layout: 'fit',
initComponent: function() {
    this.items = [
        {
            xtype: 'form',
            id: 'add-form',
            padding: 5,
            initialConfig: Ext.apply(this.initialConfig, {
                url: '123132.php'
            }),
            items: [
                {
                    xtype: 'textfield',
                    fieldLabel: 'abbr',
                    anchor: '95%',
                    value: this.abbr,
                    emptyText: 'abbr'
                }

            ],
            buttons: [
                {
                    text: 'Add',
                    handler: function() {
                        Ext.getCmp('add-form').getForm().submit();
                    }
                }
            ]
        }
    ];
    AddOrgWindowUI.superclass.initComponent.call(this);
}});

but when Im trying to create it - var AddOrgWindowForm = new AddOrgWindowUI({n_full:'aaa'});AddOrgWindowForm.show(); I get an empty window (without form panel) Why formPanel dont render properly? Where I have mistake? Thx.

Answer 1

The problem is when you assign the initialConfig to the form, as it is a readonly property according to ExtJS API and not a valid config-option.

So instead of using initialConfig to set the url you just have to set the url property as every Basic Form config-option is accepted by the Form too:

url: '123132.php',

Or if you want to let the user of your class to use another url than the default one you could do:

url: this.urlForm || '123132.php',

And by the way, your textbox has no id nor name, and this is important if your are submitting this form, as these will define the name of the parameter that will arrive to the server with the value of the textbox.

Here you have the fixed example for you to play with: http://jsfiddle.net/HPBvy/. You can use firebug or any other web-developer-tool to see the POST call.