'object is not a function' error on compiled version of app [Archive]

WagsMax

5 Oct 2012, 5:07 PM

In a compiled version of my app, the Filters feature does not appear on grids (see Capture1 for the app running in non-compiled mode, and Capture2 for the missing Filters menu item in the compiled version), and I get a console message the first time I drop a column menu on the grid:

Uncaught TypeError: object is not a function all-classes.js:1 (http://localhost/atmgo/all-classes.js)

The non-compiled version does not suffer this error, and I do not get any compilation errors from Sencha Cmd.
Using Sencha Cmd 3.0.0.141 to compile.
Does anyone have any ideas as to how to figure this one out?

WagsMax

5 Oct 2012, 5:12 PM

I turned off the yui compression, and now I can see where the error is happening, but I still don;t know how to fix it. See Capture3

dongryphon

5 Oct 2012, 9:43 PM

Please upgrade to 3.0.0.190 (http://www.sencha.com/forum/showthread.php?243153-Sencha-Cmd-V3-Beta), but I believe the issue is due to the Ext.ux namespace.

In 3.0.0.190, we now copy the Ext.ux namespace content into the "ext/src/ux" folder of the generated app/workspace. I believe there are still some issues with getting all of the resources copied during a build, however.

Beyond that I would need to see your html file, specially any script tags and compiler directives to know what might be different between dev and build mode.

WagsMax

24 Oct 2012, 8:40 AM

Hi Don,
Finally getting back around to trying a deploy. I have upgraded to .190, but I am still getting the same error:
Uncaught TypeError: object is not a function
in

initializeFilters: function(filters) {
var me = this,
filtersLength = filters.length,
i, filter, FilterClass;

for (i = 0; i < filtersLength; i++) {
filter = filters[i];
if (filter) {
FilterClass = me.getFilterClass(filter.type);
filter = filter.menu ? filter : new FilterClass(filter);http://www.sencha.com/forum/chrome-devtools://devtools/Images/errorIcon.pngUncaught TypeError: object is not a function

me.filters.add(filter);
Ext.util.Observable.capture(filter, this.onStateChange, this);
}
}
},

of
Ext.define('Ext.ux.grid.FiltersFeature', {

Here is my index.html as requested:

<html>
<head>
<title>AtmGo</title>

<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
<link rel="stylesheet" type="text/css" href="extjs/examples/ux/grid/css/GridFilters.css">


<script type="text/javascript" src="extjs/ext-debug.js"></script>

<script type="text/javascript" src="lib/softxpath.js"></script>
<script type="text/javascript" src="lib/md5-min.js"></script>
<script type="text/javascript" src="app.js"></script>

</head>
<body></body>
</html>

and my app.js (in case it helps). One thing I am curious about... there was a requirement at one point with the compiler to specify the app classes in both the requires and the configs models:, stores:, etc. Why is this? Should the configs not be enough to tell the compiler where to find the files needed?

// main app
// compile command:
// sencha compile -classpath=app.js,app,extjs/src,extjs/examples/ux/layout/Center.js page -yui -in index.html -out build/index.html

Ext.Loader.setPath('Ext.ux', 'extjs/examples/ux');
Ext.require('Ext.ux.layout.Center');
Ext.require('Ext.ux.grid.FiltersFeature');

Ext.application({
name: 'AtmGo',

models: [
'Cases',
'Contacts',
'ContactTypes',
'Wc_users',
'Regions'
],

stores: [
'Menu',
'Cases',
'Contacts',
'ContactTypes',
'Regions'
],

views: [
'Notification',
'LoginForm',
'ForgotPassword',
'MenuTree',
'MainTabs',
'WelcomeForm',
'ProfileForm',
'CasesGrid',
'CaseTabs',
'CaseMain',
'CaseContacts',
'EditFormWindow',
'ContactEdit',
'ContactAdd',
'RegionsGrid',
'RegionEdit',
'ContactTypesGrid',
'ContactTypeEdit'
],

controllers: [
'Admin',
'Login',
'Menu',
'Cases',
'Contacts',
'Utilities',
'Regions',
'ContactTypes'
],

requires: [
'Ext.layout.BorderLayout',
'Ext.form.FieldSet',
'Ext.grid.*',
'Ext.data.*',
'Ext.ux.grid.FiltersFeature',

'AtmGo.model.Cases',
'AtmGo.model.Contacts',
'AtmGo.model.ContactTypes',
'AtmGo.model.Wc_users',
'AtmGo.model.Regions',
'AtmGo.store.Menu',
'AtmGo.store.Cases',
'AtmGo.store.Contacts',
'AtmGo.store.ContactTypes',
'AtmGo.store.Regions',
'AtmGo.view.Viewport',
'AtmGo.view.Notification',
'AtmGo.view.LoginForm',
'AtmGo.view.ForgotPassword',
'AtmGo.view.MenuTree',
'AtmGo.view.MainTabs',
'AtmGo.view.WelcomeForm',
'AtmGo.view.ProfileForm',
'AtmGo.view.CasesGrid',
'AtmGo.view.CaseTabs',
'AtmGo.view.CaseMain',
'AtmGo.view.CaseContacts',
'AtmGo.view.EditFormWindow',
'AtmGo.view.ContactEdit',
'AtmGo.view.ContactAdd',
'AtmGo.view.RegionsGrid',
'AtmGo.view.RegionEdit',
'AtmGo.view.ContactTypesGrid',
'AtmGo.view.ContactTypeEdit',
'AtmGo.controller.Admin',
'AtmGo.controller.Login',
'AtmGo.controller.Menu',
'AtmGo.controller.Cases',
'AtmGo.controller.Contacts',
'AtmGo.controller.Utilities',
'AtmGo.controller.Regions',
'AtmGo.controller.ContactTypes'
],

launch: function() {
// global variable definitions
AtmGo.g_appref = this;
AtmGo.g_version = "71700";
AtmGo.g_msg_requestfail = "Server request failed with status code: ";
AtmGo.g_userid = "";
AtmGo.g_sessionid = "";
AtmGo.g_orgid = "";
AtmGo.g_username = "";
AtmGo.g_testmode = true;
if (AtmGo.g_testmode) {
AtmGo.g_baseurl = "http://64.141.2.219/mpowered/atmdevel/";
//AtmGo.g_baseurl = "http://vm117/mpowered/atmdevel/";
AtmGo.g_networkdelay = 0; // no simulated network delay
//AtmGo.g_networkdelay = 1000; // simulated network delay of n ms to simulate live
}
else {
AtmGo.g_baseurl = "https://p9.secure.hostingprod.com/@www.mpowered.biz/ssl/Atm/"; // production php site on Yahoo!
AtmGo.g_networkdelay = 0; // no network delay
}

// create a global quick reference to the Utilites controller
AtmGo.g_CtlrUtilities = this.getController('Utilities');

// create the global scope objects
Ext.create('AtmGo.store.Cases', {});

// create the initial viewport
Ext.create('AtmGo.view.Viewport', {});
}
});

dongryphon

25 Oct 2012, 12:44 AM

I suspect the compiler is not auto-detecting the filter type as a class requirement. Can you try to include a "requires" on the filter type you are using?

To see if we can fix that, can you include the code snippet for setting up the grid and filters? If this is a simple use of "type: ..." on a config object we may be able to fix that and you may not need to requires/uses eventually.

WagsMax

25 Oct 2012, 8:32 AM

OK, thanks I will try that... a question... I looked through what was being dynamically loaded and there are a lot of files to do with "filter"... which one(s) should I "requires"?

/extjs/examples/ux/grid/FiltersFeature.js
/extjs/src/util/Filter.js
/extjs/examples/ux/grid/filter/BooleanFilter.js
/extjs/examples/ux/grid/filter/DateFilter.js
/extjs/examples/ux/grid/filter/ListFilter.js
/extjs/examples/ux/grid/filter/NumericFilter.js
/extjs/examples/ux/grid/filter/StringFilter.js
/extjs/examples/ux/grid/filter/Filter.js

based on my view, a snippet of which looks like this:

features: [{
ftype: 'filters',
encode: true,
local: true
}],

dongryphon

25 Oct 2012, 10:47 PM

Only the ones you use in your columns are needed but you could check the value of "filter.type" where the error occurs and see what it was trying to find.