Results 1 to 2 of 2

Thread: Ext.form.Panel does not render and not exists. Ext.getCmp does not find it by its id.

  1. #1
    Sencha User
    Join Date
    Apr 2013
    Posts
    1
    Vote Rating
    0
      0  

    Default Ext.form.Panel does not render and not exists. Ext.getCmp does not find it by its id.

    Hi Folks,

    I really don't know why... where is my fault... but this code below when executed it logs: undefined. The panel does not render and not gives any exception.

    Does someone can help me please? Thanks a lot!

    Code:
        Ext.create('Ext.form.Panel', {
            frame: true,
            style: 'border: none;border-radius:0;',
            width: 300,
            stateId: 'merlino-buildings-add-form',
            id: 'merlino-buildings-add-form',
            bodyPadding: 5,
            loadMask: true,
            waitMsgTarget: true,
            waitMsg: 'Inserimento in corso...',
            border: false,
            model: 'Building',
    
    
            fieldDefaults: {
                labelAlign: 'right',
                labelWidth: 147,
                msgTarget: 'side'
            },
    
    
            defaultType: 'textfield',
            defaults: {
                width: 390
            },
            items: [{
                xtype: 'fieldset',
                title: 'Informazioni Legali',
                collapsible: true,
                collapsed: false,
                defaultType: 'textfield',
                defaults: {
                    anchor: '100%',
                    labelSeparator: '',
                    labelStyle: 'font-weight:bold;',
    
    
                    fieldLabel: ''
                },
                items: [{
                    xtype: 'combobox',
                    fieldLabel: 'Contatto',
                    name: 'contact',
                    store: 'merlino-contacts',
                    valueField: 'key',
                    displayField: 'longname',
                    typeAhead: true,
                    queryMode: 'local',
                    emptyText: 'Cognome / Ragione Sociale'
                }, {
                    xtype: 'combobox',
                    fieldLabel: 'Contratto',
                    name: 'contract',
                    store: 'merlino-buildings-contract-types',
                    valueField: 'key',
                    displayField: 'longname',
                    typeAhead: true,
                    queryMode: 'local',
                    emptyText: 'Tipologia'
                }]
            },Ext.create('MerlinoFieldSetAddress', {
                border: true
            }),{
                xtype: 'fieldset',
                title: 'Dati Catastali',
                collapsible: true,
                collapsed: true,
                defaultType: 'textfield',
                defaults: {
                    anchor: '100%',
                    labelSeparator: '',
                    labelStyle: 'font-weight:bold;',
    
    
                    fieldLabel: ''
                },
                items: [{
                    xtype: 'combobox',
                    fieldLabel: 'Tipologia',
                    name: 'building_type',
                    store: 'merlino-buildings-types',
                    valueField: 'key',
                    displayField: 'longname',
                    typeAhead: true,
                    queryMode: 'local',
                    emptyText: 'Abitazione, Box, etc.'
                }, {
                    xtype: 'numberfield',
                    minValue: 0,
                    keyNavEnabled: true,
                    mouseWheelEnabled: true,
                    fieldLabel: 'm<sup>2</sup>',
                    emptyText: '100',
                    useThousandSeparator: true,
                    growAppend: 'mq',
                    name: 'mq'
                }]
            },{
                xtype: 'fieldset',
                title: 'Dettagli',
                collapsible: true,
                collapsed: true,
                defaultType: 'textfield',
                defaults: {
                    anchor: '100%',
                    labelSeparator: '',
                    labelStyle: 'font-weight:bold;',
    
    
                    fieldLabel: ''
                },
                items: [{
                    xtype: 'numberfield',
                    minValue: 0,
                    fieldLabel: 'Camere da Letto',
                    emptyText: '2',
                    name: 'bedrooms',
                    useThousandSeparator: false,
                    keyNavEnabled: true,
                    mouseWheelEnabled: true
                }, {
                    xtype: 'numberfield',
                    minValue: 0,
                    fieldLabel: 'Ascensori',
                    emptyText: '1',
                    name: 'elevators',
                    useThousandSeparator: false,
                    keyNavEnabled: true,
                    mouseWheelEnabled: true
                }, {
                    xtype: 'numberfield',
                    minValue: 0,
                    fieldLabel: 'Terrazzi',
                    emptyText: '4',
                    name: 'terrace',
                    useThousandSeparator: false,
                    inputAttrTpl: 'Terrazzi',
                    keyNavEnabled: true,
                    mouseWheelEnabled: true
                }, {
                    xtype: 'checkboxgroup',
                    fieldLabel: 'Plus',
                    columns: 1,
                    vertical: true,
                    items: [
                        { boxLabel: 'Vista Mare', name: 'sea_seeking', inputValue: '1' },
                        { boxLabel: 'Spazi Esterni', name: 'outer_spaces', inputValue: '1' },
                        { boxLabel: 'Giardino', name: 'garden', inputValue: '1' }
                    ]
                }/*, {
                    xtype      : 'fieldcontainer',
                    fieldLabel : 'Vista Mare',
                    defaultType: 'checkfield',
                    defaults: {
                        flex: 1
                    },
                    layout: 'hbox',
                    items: [
                        {
                            boxLabel  : 'No',
                            name      : 'sea_seeking',
                            inputValue: '0',
                        }, {
                            boxLabel  : 'Si',
                            name      : 'sea_seeking',
                            inputValue: '1',
                        }
                    ]
                }, {
                    xtype      : 'fieldcontainer',
                    fieldLabel : 'Spazi Esterni',
                    defaultType: 'radiofield',
                    defaults: {
                        flex: 1
                    },
                    layout: 'hbox',
                    items: [
                        {
                            boxLabel  : 'No',
                            name      : 'outer_spaces',
                            inputValue: '0',
                        }, {
                            boxLabel  : 'Si',
                            name      : 'outer_spaces',
                            inputValue: '1',
                        }
                    ]
                }, {
                    xtype      : 'fieldcontainer',
                    fieldLabel : 'Giardino',
                    defaultType: 'radiofield',
                    defaults: {
                        flex: 1
                    },
                    layout: 'hbox',
                    items: [
                        {
                            boxLabel  : 'No',
                            name      : 'garden',
                            inputValue: '0',
                        }, {
                            boxLabel  : 'Si',
                            name      : 'garden',
                            inputValue: '1',
                        }
                    ]
                }*/]
            }, {
                xtype: 'fieldset',
                title: 'Informazioni Aggiuntive',
                collapsible: true,
                collapsed: true,
                defaultType: 'textfield',
                defaults: {
                    anchor: '100%',
                    labelSeparator: '',
                    labelStyle: 'font-weight:bold;',
    
    
                    fieldLabel: ''
                },
                items: [{
                    xtype: 'textarea',
                    fieldLabel: 'Note',
                    emptyText: 'Informazioni aggiuntive...',
                    name: 'notes'
                },{
                    hidden: true,
                    disabled: true,
                    submitValue: false,
                    name: 'user'
                },{
                    hidden: true,
                    disabled: true,
                    submitValue: false,
                    name: 'date'
                },{
                    hidden: true,
                    disabled: true,
                    submitValue: false,
                    name: 'update_user'
                },{
                    hidden: true,
                    disabled: true,
                    submitValue: false,
                    name: 'update_date'
                }]
            }],
    
    
            buttonAlign: 'center',
            buttons: [{
                text: 'Cancella',
                iconCls: 'icon-delete',
                handler: function(){
                    this.up('form').getForm().reset();
                }
            }, {
                text: 'Salva',
                iconCls: 'icon-save',
                disabled: true,
                formBind: true,
                handler: function(){
                    var self = this,
                        update = function(){
                            var form = self.up('form'),
                                values = form.getForm().getValues(),
                                record = Ext.create('Building', values);
                            form.setLoading(true);
                            record.save({
                                waitMsg: 'Salvataggio in corso...',
                                retryFn: update,
                                success: function(a,b){
                                    form.setLoading(false);
                                    Ext.MessageBox.show({
                                        constrain: true,
                                        closable: false,
                                        icon: Ext.MessageBox.INFO,
                                        title: 'Fatto!',
                                        msg: '<b>Salvataggio riuscito!</b><br /><br />Come intendi procedere?',
                                        buttons: Ext.MessageBox.YESNOCANCEL,
                                        buttonText:{
                                            yes: "Apri i dettagli di questo immobile",
                                            no: "Nuovo un altro immobile",
                                            cancel: "Chiudi"
                                        },
                                        fn: function(retry){
                                            if (retry == 'yes') {
                                                Ext.create('MerlinoBuildingsAdd', {show: false});
                                                var win = Ext.create('MerlinoBuildingsRead', {show: true, title: 'Immobile: '+ record.getData().longname, values: values}),
                                                    readform = win.down('form').getForm();
                                                readform.record = record;
                                                readform.loadRecord(record);
                                                readform.getFields().each(Merlino.hide_empty_fields);
                                                Merlino.handle_preview_and_shortcut(readform.record);
                                            } else if (retry == 'no')
                                                form.getForm().reset();
                                            else if (retry == 'cancel') {
                                                Ext.create('MerlinoBuildingsAdd', {show: false});
                                                Ext.create('MerlinoBuildingsListing', {show: true});
                                            }
                                        }
                                    });
                                },
                                failure: function(a,b){
                                    form.setLoading(false);
                                },
                            });
                    }
                    update();
                }
            }, {
                text: 'Chiudi',
                handler: function(){
                    Ext.create('MerlinoBuildingsAdd', {});
                }
            }]
        });
        console.log(Ext.getCmp('merlino-buildings-add-form'));

  2. #2
    Sencha - Support Team slemmon's Avatar
    Join Date
    Mar 2009
    Location
    Boise, ID
    Posts
    6,154
    Vote Rating
    247
      0  

    Default

    Do you have that id (merlino-buildings-add-form) specified anywhere else other than this instance?
    Personally I've moved away from using id and only use itemId anymore to ensure I don't have the same ID anywhere on the document twice.

    Also, I took your example code and pulled out everything except for the panel itself (removed all child items, buttons, etc) and it found the component just fine using getCmp().

Tags for this Thread

Posting Permissions

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