1. #1
    Sencha User
    Join Date
    Jun 2011
    Posts
    2
    Vote Rating
    0
    luiggilamela is on a distinguished road

      0  

    Default Migration ExtJs 3 to ExtJs 4

    Migration ExtJs 3 to ExtJs 4


    Hola a todos espero que puedan ayudarme a resolver este problema, estoy migrando de extJs 3 a extJs 4, ya compilo los paquetes de compatibilidad, pero aun no me muestra el formulario que cree, alguien me puede ayudar? aca les dejo el codigo.


    Index.jsp:

    Code:
    <%@page contentType="text/html" pageEncoding="UTF-8"%>
    
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    
    
    
    
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">
            <title>.::Migracion Ext 3 a Ext4::.</title>
            
            <%-- Librerias EXTJS --%>
            <link rel="stylesheet" type="text/css" href="/migration/ext4/resources/css/ext-all.css" />
            <script type="text/javascript" src="/migration/ext4/ext-all-debug.js"></script>
    
    
            
            <!-- Ext 3.x compatibility -->
            <script type="text/javascript" src="/migration/compatibility/ext3-core-compat.js"></script>
            <script type="text/javascript" src="/migration/compatibility/ext3-compat.js"></script>
                       
            <%-- Widgets --%>
            <jsp:include page="/js/example.jsp"></jsp:include>
            
                  
            <script type="text/javascript">     
            //Ext.Compat.showErrors = true;
                         
                   Ext.onReady(function() {
                   
                    Ext.QuickTips.init();
                    var cmp1 = new MyPanel({
                        renderTo: Ext.getBody()
                    });
                    cmp1.show();
                    });                
            </script>
            
        </head>
        <body>
        </body>
    </html>
    y aca el codigo Extjs3, la clase se llama example.jsp:

    Code:
    <script type="text/javascript">
    
    
    strDestinatario = Ext.apply(Ext.data.Store.prototype, {
        constructor: Ext.Function.createInterceptor(Ext.data.Store.prototype.constructor, function(cfg) {
            cfg = cfg || {};
            strDestinatario.superclass.constructor.call(this, Ext.apply({
                storeId: 'strDestinatario'
            }, cfg));
        })
    });
    //new strDestinatario();
    
    
    strPrioridad = Ext.apply(Ext.data.Store.prototype, {
        constructor: Ext.Function.createInterceptor(Ext.data.Store.prototype.constructor, function(cfg) {
            cfg = cfg || {};
            strPrioridad.superclass.constructor.call(this, Ext.apply({
                storeId: 'strPrioridad'
            }, cfg));
        })
    });
    //new strPrioridad();
    
    
    strTipoRequerimiento = Ext.apply(Ext.data.Store.prototype, {
        constructor: Ext.Function.createInterceptor(Ext.data.Store.prototype.constructor, function(cfg)  {
            cfg = cfg || {};
            strTipoRequerimiento.superclass.constructor.call(this, Ext.apply({
                storeId: 'strTipoRequerimiento'
            }, cfg));
        })
    });
    //new strTipoRequerimiento();
    
    
    MyPanelUi = Ext.extend(Ext.Panel, {
        width: 784,
        height: 512,
        layout: 'absolute',
        initComponent: function() {
            this.items = [
                {
                    xtype: 'panel',
                    x: 10,
                    y: 40,
                    layout: 'form',
                    labelWidth: 150,
                    autoWidth: true,
                    border: false,
                    items: [
                        {
                            xtype: 'combo',
                            fieldLabel: 'Tipo Requerimiento',
                            autoWidth: true,
                            store: 'strTipoRequerimiento'
                        }
                    ]
                },
                {
                    xtype: 'panel',
                    x: 10,
                    y: 70,
                    layout: 'form',
                    labelWidth: 150,
                    autoWidth: true,
                    border: false,
                    items: [
                        {
                            xtype: 'combo',
                            fieldLabel: 'Prioridad',
                            autoWidth: true,
                            store: 'strPrioridad'
                        }
                    ]
                },
                {
                    xtype: 'panel',
                    x: 10,
                    y: 100,
                    layout: 'form',
                    labelWidth: 150,
                    autoWidth: true,
                    border: false,
                    items: [
                        {
                            xtype: 'combo',
                            fieldLabel: 'Enviar a',
                            autoWidth: true,
                            store: 'strDestinatario'
                        }
                    ]
                },
                {
                    xtype: 'panel',
                    x: 10,
                    y: 130,
                    width: 380,
                    layout: 'form',
                    labelWidth: 150,
                    border: false,
                    items: [
                        {
                            xtype: 'textfield',
                            fieldLabel: 'Titulo',
                            anchor: '100%'
                        }
                    ]
                },
                {
                    xtype: 'panel',
                    x: 10,
                    y: 160,
                    width: 460,
                    layout: 'form',
                    labelWidth: 150,
                    border: false,
                    items: [
                        {
                            xtype: 'textarea',
                            width: 300,
                            fieldLabel: 'Descripcion',
                            height: 40
                        }
                    ]
                },
                {
                    xtype: 'panel',
                    x: 10,
                    y: 207,
                    width: 460,
                    layout: 'form',
                    labelWidth: 150,
                    border: false,
                    items: [
                        {
                            xtype: 'textarea',
                            width: 300,
                            fieldLabel: 'Objetivo',
                            height: 40
                        }
                    ]
                },
                {
                    xtype: 'panel',
                    x: 10,
                    y: 254,
                    width: 460,
                    layout: 'form',
                    labelWidth: 150,
                    border: false,
                    items: [
                        {
                            xtype: 'textarea',
                            width: 300,
                            fieldLabel: 'Observaciones',
                            height: 40
                        }
                    ]
                },
                {
                    xtype: 'toolbar',
                    items: [
                        {
                            xtype: 'button',
                            text: 'Registrar'
                        },
                        {
                            xtype: 'tbseparator'
                        },
                        {
                            xtype: 'button',
                            text: 'Adjuntar Archivo'
                        }
                    ]
                }
            ];
            MyPanelUi.superclass.initComponent.call(this);
        }
    });
    
    
    MyPanel = Ext.extend(MyPanelUi, {
        initComponent: function() {
            MyPanel.superclass.initComponent.call(this);
        }
    });
    
    
    Ext.reg('mypanel', 'MyPanel');
    
    </script>
    Ahora cuando corro la aplicacion en google chrome, me aparece que el error se centra en estas lineas:

    Code:
    -- MyPanelUi.superclass.initComponent.call(this);
    
    --MyPanel.superclass.initComponent.call(this);
    
    --              Ext.onReady(function() {               
                    Ext.QuickTips.init();
                    var cmp1 = new MyPanel({
                        renderTo: Ext.getBody()
                    });
                    cmp1.show();
                    }); 



    Espero me puedan ayudar. Muchas Gracias.

  2. #2
    Sencha Premium Member dawesi's Avatar
    Join Date
    Mar 2007
    Location
    Melbourne, Australia (aka GMT+10)
    Posts
    1,083
    Vote Rating
    44
    dawesi has a spectacular aura about dawesi has a spectacular aura about

      0  

    Default Translation To English:

    Translation To English:


    "Hello everyoneI hope you canhelp me resolve thisproblem, I'mmigrating fromExtJsExtJs3 to4,have compiledcompatibility packages, but stilldoes not displaytheform you create, someonecan help me?Here I give youthe code."
    Teahouse Training Company
    Official Certified Sencha Trainer

    Australia / New Zealand / Singapore / Hong Kong & APAC



    SenchaWorld.com - Sencha webinars, videos, etc
    SenchaForge.org - (coming soon)
    TeahouseHQ.com - Sencha ecosystem training portal

    Code Validation : JSLint | JSONLint | JSONPLint

Thread Participants: 1