Why does ExtJS 3's Ext.Loader appear to be missing parts and not displaying a grid?

Question

I have an ExtJS 3 datagrid with several added functions that is not displaying. The JavaScript console leads me to believe that Ext is missing parts.

I import, with apparent success:

  <script type="text/javascript"
    src="/extjs3/adapter/ext/ext-base-debug.js"> 
  </script> 
  <script type="text/javascript"
    src="/extjs3/ext-all-debug.js"></script>

I have, in my script:

    <script type="text/javascript"> 
        Ext.Loader.setConfig({
          enabled: true
          });
        Ext.Loader.setPath('Ext.ux', '../ux');
        Ext.require(['Ext.selection.cellModel',
          'Ext.grid.*',
          'Ext.data.*',
          'Ext.util.*',
          'Ext.state.*',
          'Ext.form.*',
          'Ext.ux.CheckColumn'
          ]);

Chrome is displaying an error:

Uncaught TypeError: Object # has no method 'setConfig'

The line number belongs to the setConfig above. If I comment out the setConfig() call, I get the same basic error for setPath(), the require() method is complained about.

Is there something else I need to be importing? I checked that the resources were at the expected paths, and it looks like they are being served up and received properly.

I'd like to know what needs to be done to address this error.

Thank you,

--EDIT--

I now have:

    <script type="text/javascript"> 
        /*
        Ext.Loader.setConfig({
          enabled: true
          });
        Ext.Loader.setPath('Ext.ux', '../ux');
        */
        Ext.Loader.load(['Ext.selection.cellModel',
          'Ext.grid.*',
          'Ext.data.*',
          'Ext.util.*',
          'Ext.state.*',
          'Ext.form.*',
          'Ext.ux.CheckColumn'
          ]);

I'm getting error messages on the JavaScript console saying that it tried to load (404) Ext.grid.* etc. from the same directory.

How do I specify the right path(s) for it to search in?

Answer 1

You're mixing the new Ext JS 4 Ext.Loader with the Ext JS 3 Ext.Loader. Your code includes Ext JS 3 while you're using the syntax and API of Ext.Loader from Ext JS 4.

The old Ext JS 3 API documentation can be found here: http://dev.sencha.com/deploy/ext-3.3.1/docs/

EDIT

The old Ext JS 3 loader does not support mapping class names to paths, so the loader only takes an array of file paths as an argument. Please also note that loading is done asynchronously so your loaded files are only available after loading has finished.