Results 1 to 3 of 3

Thread: Loading external component

  1. #1
    Sencha User
    Join Date
    Aug 2012
    Location
    Nigeria
    Posts
    33
    Vote Rating
    0
      0  

    Default Unanswered: Loading external component

    Hi,

    I extended a reusable component in my app, and now i am trying to use it as an external component in a different js file....
    but i am having this error ( Ext.loader not enabled, so dependencies cannot be resolved dynamically. Missing required class: MyForm.com.form )

    this my extended component (form.js)

    Code:
    Ext.define('MyForm.com.form', {
        extend: 'Ext.form.Panel',
        alias: 'widget.myform',
        frame: true,
        defaultType: 'textfield',
        layout: 'column',
        autoScroll: true,
    
        initComponent: function(){
    
             this.items = [
    {
     xtype:'container',
            title: '',
            columnWidth: 0.3,
            defaultType: 'textfield',
            collapsed: true,
            layout:'form',
            items :[
             {
                fieldLabel: 'Next of Kin',
                name: 'kin'
            }, {
                fieldLabel: 'Quarantor 1',
                name: 'g1'
            },
        {
                fieldLabel: 'Quarantor 2',
                name: 'g2'
            },
        {
                fieldLabel: 'Signature',
                name: 'sign'
            }
            ]
        }
    
    ];
    
            this.callParent(arguments);
    
         }
    
    
    
    });
    
    And this is my other file (panel.js)
    
      Ext.define('MyForm.com.panel',{
              extend:'Ext.panel.Panel',
              requires:['MyForm.com.form'],
              renderTo: Ext.getBody(),
              items:[{
                      xtype:'comCheck'
              }]
    
            });
    What exactly, am i doing wrong?

    Thanks in advance.

    Pat

  2. #2
    Sencha User
    Join Date
    Jan 2012
    Posts
    1,376
    Answers
    347
    Vote Rating
    114
      0  

    Default

    You should enable dynamic loading and set path for your namespace 'MyForm' with Ext.Loader.setConfig().
    Code:
    Ext.Loader.setConfig({
        enabled: true,
        'MyForm': 'path to your files'
    });

  3. #3
    Sencha User luisparada's Avatar
    Join Date
    Nov 2007
    Location
    Venezuela
    Posts
    95
    Answers
    2
    Vote Rating
    2
      0  

    Default

    Heres is a better example how it has to be setup:
    1) You can add this code to your index.html(php)(jsp)(whatever)... as javascript code, that way you will enable Ext loader, but remember also the notation and names standards of all your modules. for example, if you have your app named myApp, then you should use this.
    MyApp.module.element where module is a folder inside app and element is the element or javascript file you are currently programming.
    app/
    -> module/
    ->->->->element.js
    I hope this helps.

    Code:
    Ext.Loader.setConfig({
        enabled: true,
        paths:{
            'Ext.ux':'/extjs/examples/ux',
            'Ext.example':'/extjs/examples/shared/examples.js'
        }
    });
    Ext.require(['Ext.ux.CheckColumn','Ext.ux.PasswordMeter','Ext.example']);
    ____________________________________
    do not make install, just compile it.!!!
    --------------------------------------------------
    //*************k4m1k4z3************\\

Posting Permissions

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