PDA

View Full Version : requires does not load



zlevardy
3 May 2013, 3:42 AM
hi,

I cannot get next piece of code running. I need to use dynamic loads, and not ext-all. With ext-all include it works. The error shown by firebug is:

TypeError: Ext.state is undefined



<html>
<head>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all-gray-debug.css" />


<!-- <x-compile> -->
<!-- <x-bootstrap> -->
<!-- script src="ext/ext-all-debug.js"></script -->
<script src="ext/ext-dev.js"></script>
<script src="bootstrap.js"></script>
<!-- </x-bootstrap> -->

<!-- app.js: -->
<!-- script type="text/javascript" src="app/app.js"></script -->
<script type="text/javascript">
Ext.Loader.setConfig({
enabled : true,
paths : {
Ext: 'ext/src'
}
});
Ext.Loader.require([
'Ext.state.CookieProvider'
]);

var cp = new Ext.state.CookieProvider({
path: "/cgi-bin/",
expires: new Date(new Date().getTime()+(1000*60*60*24*30)), //30 days
domain: "extjs.com"
});

Ext.state.Manager.setProvider(cp);
</script>
<!-- </x-compile> -->


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




thx

girish.arjunagi
3 May 2013, 5:14 AM
Why don't you try loading it synchronously?



Ext.syncRequire(['Ext.state.CookieProvider']);

zlevardy
3 May 2013, 6:03 AM
maybe you also will have an idea why getting from ext-dev.js by firebug:



[Ext.Loader] Synchronously loading 'Ext.selection.RowModel'; consider adding Ext.require('Ext.selection.RowModel') above Ext.onReady
[Ext.Loader] Synchronously loading 'Ext.data.reader.Json'; consider adding Ext.require('Ext.data.reader.Json') above Ext.onReady

the code pointed by firebug is:


Ext.define('MyTestApp.view.daily.List',{
extend: 'Ext.grid.Panel',
alias: 'widget.dailyList',
selModel: Ext.create('Ext.selection.RowModel', {}),



of course this was good with ext-all.

thx

zlevardy
3 May 2013, 8:50 AM
hi,

this syncRequire() works in dev mode, while loading ext-dev.js and app.'s, but give me undefined errors from all-classes.js. What I am trying to do is this - no good in production mode:



Ext.syncRequire(['Ext.state.CookieProvider','Ext.data.reader.Json']);


Ext.namespace('MyTestApp');


MyTestApp.LogonManager = new Ext.state.CookieProvider({
expires: new Date(new Date().getTime()+(1000*60*60*24*365)) //365 days
});



error message:


TypeError: MyTestApp.LogonManager is undefined.


it may comes from my login panel (Ext.form.Panel), but just in production mode:


focusField: MyTestApp.LogonManager.get('focusField', 'login'),


thx

chamacs
3 May 2013, 10:34 AM
The original problem is because the Ext code is running before the Ext library is completely loaded.
Ext.syncRequire is not needed.

you need to put the code in the an app (or Ext.onReady() ). App shown:


Ext.require(['Ext.state.CookieProvider']);

Ext.application({
name : 'MyTestApp',
launch : function() {
var cp = new Ext.state.CookieProvider({
path: "/cgi-bin/",
expires: new Date(new Date().getTime()+(1000*60*60*24*30)), //30 days
domain: "extjs.com"
});

Ext.state.Manager.setProvider(cp);
}
});

chamacs
3 May 2013, 10:40 AM
<!-- <x-compile> -->
<!-- <x-bootstrap> -->
<!-- script src="ext/ext-all-debug.js"></script -->
<script src="ext/ext-dev.js"></script>
<script src="bootstrap.js"></script>
<!-- </x-bootstrap> -->

</html>





Another problem is that you cannot have includes for more than one library instance. The sample as both the ext-dev.js and the bootstrap.js. only include one or the other or a different reference. i.e. ext-all.js

zlevardy
3 May 2013, 9:26 PM
thx, you completely right. I have tried both way to get working as Ext.app.launch and also in onReady(). My preference is Ext.app.lauch as generated and part of mvc.

My original need is: having a logon manager in the application name space. This is what working with dev mode:



MyTestApp.LogonManager = new Ext.state.CookieProvider({ expires: new Date(new Date().getTime()+(1000*60*60*24*365)) //365 days});

Later I am reusing this.

Do you see any way to make this LogonManager from Ext.app.lauch? I was not able to do.

thx

zlevardy
3 May 2013, 9:29 PM
Another problem is that you cannot have includes for more than one library instance. The sample as both the ext-dev.js and the bootstrap.js. only include one or the other or a different reference. i.e. ext-all.js

I am not sure what to do as next index.html is generated by sencha cmd v3, and it is including both ext-dev and bootstrap.


<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>MyTestApp</title>
<link rel="stylesheet" href="resources/default/app.css">
<!-- <x-compile> -->
<!-- <x-bootstrap> -->
<script src="ext/ext-dev.js"></script>
<script src="bootstrap.js"></script>
<!-- </x-bootstrap> -->
<script src="app/app.js"></script>
<!-- </x-compile> -->
</head>
<body></body>
</html>


Can you confirm that I do not need one of them?

thx

zlevardy
3 May 2013, 11:05 PM
dear All,

finally made a solution, what maybe more clear that earlier attempts. I have created simply a static object like this (saved as app/LoginManager.js at root level). And no longer need to worry of class loader, etc. It works for me in production and testing mode.


Ext.define("MyTestApp.LogonManager", {
extend: 'Ext.state.CookieProvider',
singleton : true,
expires: new Date(new Date().getTime()+(1000*60*60*24*365)) //365 days
});


cu