Extjs upgrade from 5.0 to 5.1 problems - extjs

I have an extjs 5.0 application that don't use the MVC model, ie: all the code is in one file called app.js.
I wanted to upgrade from version 5.0 to 5.1, What is the right way and steps to do so? knowing that I don't use index.html, instead I have a starting page called login.html.
I generated a new app with version 5.1, and modified the path from index.html to login.html, and replaced the ext folders the old with the new, and the build folders as well.
The error message chrome gives me is:
Uncaught TypeError: undefined is not a function
the error occurs in the file FocusManager.js, the line:
needListeners[i].addFocusListener();

The FocusManager is deprecated in Ext JS 5.1 (although the documentation does not reflect this clearly). Avoid using it.

Related

app-all.js not working with ext.js

I am using sencha sdk tool 2 to build my extjs 4 application. Build is working fine and it generated two files -
app-all.js - minified
all-classes.js - non-minified
But when I am using minified app-all.js with ext.js in my index-mini.html page it is not working and giving me the error "Cannot read property 'get' of undefined" at Ext.util.Cookies.get()
My application is working fine when I am using ext-all.js instead of ext.js.
I saw that my application is using some util classes(like - Ext.util.Cookies) that are not present in ext.js. Also for development we are using ext-all.js in our index.html but for deployment we want to use ext.js.
Questions -
How can I run my application using ext.js & app-all.js?
-
Thanks in advance.
The problem is that ext-all.js (and the un-minified ext-debug.js) only provide the minimum number of core ExtJS classes needed to get up and running. Any additional classes should be dynamically loaded as separate files
Section 2.2 of Getting Started describes this, and also explains that you should dynamically load any additional classes.
Basically, you need to include a requires statement in your application as shown below.
requires:[
'Ext.util.Cookies'
],

issue with running Angle - Bootstrap Admin app (angular-meteor version): TypeError: $browser.addPollFn is not a function angular-cookies.js:60

just purchased Angle - Bootstrap Admin app from wrapbootstrap
Tried to run the angular-meteor version of the app
The first issue was that meteor did not like the contents of the default index.html, so I renamed the file to be index.ng.html
Now the error I'm getting in the browser console is:
TypeError: $browser.addPollFn is not a function angular-cookies.js:60
What can be done to fix this?
Not sure about wrapbootstrap, but generally this error means you are using incompatible versions of angular and angular-cookies.
The external angular modules you use (e.g. ngAnimate, ngCookies, ngResource, ngRoute etc), should always be the same version as angular.
This issue can be Resolved by using same Version of angular.min.js and angular-cookies.js.
It always good to use same version of files

AngularJS 1.3 with ngbp framework doesn't load in chrome browser when using ng-strict-di

I'm working on an AngularJS web app using the ngbp framework (formerly ng-boilerplate) which by default uses AngularJS 1.2. The project is in early stages so we're experimenting with using AngularJS 1.3 instead of 1.2, as it has some nice features we'd like to make use of. We're also working under the assumption that AngularJS 1.3 will likely be the release version by the time we go live.
So I simply switched the AngularJS version number in the bower.json file and everything seems to work fine in Chrome, Safari, and Firefox except for when I enable strict dependency injection (ng-strict-di). When strict DI mode is on I get the error below (more detail here), but it only occurs in Chrome (FF & Safari both still work as expected).
Failed to instantiate module ng due to:
Error: [$injector:strictdi] function($provide) is not using explicit annotation and cannot be invoked in strict mode
http://errors.angularjs.org/1.3.0-build.3121+sha.a4520a7/...)
at http://localhost:8080/assets/ngbp-0.3.2.js:87:12
at annotate (http://localhost:8080/assets/ngbp-0.3.2.js:3352:17)
at Object.invoke (http://localhost:8080/assets/ngbp-0.3.2.js:4036:21)
at runInvokeQueue (http://localhost:8080/assets/ngbp-0.3.2.js:3964:35)
at http://localhost:8080/assets/ngbp-0.3.2.js:3973:11
at forEach (http://localhost:8080/assets/ngbp-0.3.2.js:338:20)
at loadModules (http://localhost:8080/assets/ngbp-0.3.2.js:3954:5)
at createInjector (http://localhost:8080/assets/ngbp-0.3.2.js:3894:11)
at doBootstrap (http://localhost:8080/assets/ngbp-0.3.2.js:1494:20)
at bootstrap (http://localhost:8080/assets/ngbp-0.3.2.js:1509:12
It seems that for some reason the angular source code itself is failing the strict DI test and thus won't load in the Chrome browser from within the ngbp framework. The above error comes from a fresh clone of ngbp with the only change being the version of AngularJS (1.3), not from our actual project (though the error is the same in both cases). I know that this version of ngbp doesn't officially support Angular 1.3 but as I said the app seems to work just fine with this change, even though it fails this test. I'm wondering if anyone might have some insight into what is causing this error and whether or not it would be ill-advised to proceed with this combination of AngularJS 1.3 and ngbp (version: 0.3.2)? Is there something else within ngbp that needs to be changed along with the version of AngularJS?
If it helps I'm serving up the files locally via cd ../bin; http-server -p 8080. If any other information would help just let me know and I'd be happy to provide it if possible.
Thanks for your time.
EDIT: If it helps I tested on OS X 10.9.4 with the following browser versions:
Chrome (Version 36.0.1985.143)
64-bit Chrome (Version 37.0.2062.94)
Firefox (31.0)
Safari (Version 7.0.5 (9537.77.4))
Looks like you might be using batarang, it does not work well with ng-strict-di. Try disabling batarang from google chrome developer tools and the app should start normally again.
[edit] AngularJS batarang now support ng-strict-di since v0.5.0. This error should no longer happen.

built ExtJs 4.2, app doesn't run without old classes

I minified/built my app that uses ExtJS 4.2.0 (free version) using Sencha SDK Tools 2.0.0 beta3, and the app was built successfully. However, when I try deleting the old "app" folder containing my old classes, the app no longer works.
I also tried generating a new app using Sencha CMD 4.0.1.45 and then adding my classes, but the results are the same.
I am confused why this happens, because as I understood it, your old classes are not needed to deploy production app. In fact, the only javascript files you need to include in your "index.html" file are "ext.js" and "app-all.js".
I used Firebug and saw in the DOM that the app, along with my classes, are loaded.
I also noticed that "app-all.js" defines classes like this:
Ext.define("MyApp.view.MyClass"...
Is this really how it is supposed to behave? or am I missing something?
Thanks in advance!
Okay, I got it. A .js file in my application calls Ext.require on itself, causing the app wiring go crazy.

How to use EJS templates in a Backbone project generated by Yeoman?

Using yeoman init backbone:all generates the required files for a sample Backbone.JS app. Along with the MVC files for a sample application object, it also creates a folder at bbapp/app/scripts/templates with a sample ejs file called application.ejs. The Backbone View file for the sample application has a line (which is commented out):
//template: application
Uncommenting this does not work. It tries to look for an object with the name 'application' and throws an error: Uncaught ReferenceError: application is not defined. Using yeoman init bbb creates the Backbone Layout Manager which probably does the trick. Any ideas how I can use EJS files for templating in a project generated with yeoman init backbone:all ?
Thanks!
Till now the generator-backbone is not officially released for yeoman 1.0, but you can try it like this.
Today I proposed a fix for precompiling ejs templates.
That fix will precompile all the *.ejs files in app/templates to app/scripts/templates.js. Will update once the fix is merged to the master and the generator is officially released.
PS : In yeoman 1.0beta use yo backbone:all instead of yeoman init backbone:all

Resources