PDA

View Full Version : Ext.onReady not function?



RyanZec
22 Oct 2007, 4:37 PM
here is my code:


<html>
<head>
<title>grid test</title>
<!--<script type="javascript" src="/kaizen/api/js/jquery/jquery.js"></script>
<script type="javascript" src="/kaizen/api/js/ext/adapter/jquery/ext-jquery-adapter.js"></script>-->
<script type="javascript" src="/kaizen/api/js/ext/adapter/ext/ext-base.js"></script>
<script type="javascript" src="/kaizen/api/js/ext/ext-all.js"></script>
<body>
<script>
Ext.onReady(function()
{
// create the Data Store
var ds = new Ext.data.Store({
// load using HTTP
url: 'test.xml',

// the return will be XML, so lets set up a reader
reader: new Ext.data.XmlReader({
// records will have an "Item" tag
record: 'tester',
id: 'id',
totalRecords: '@total'
}, [
// set up the fields mapping into the xml doc
// The first needs mapping, the others are very basic
{name: 'field1', mapping: 'stats > field1'},
'field2', 'field3'
])
});

var cm = new Ext.grid.ColumnModel([
{header: "Field 1", width: 120, dataIndex: 'field1'},
{header: "Field 2", width: 180, dataIndex: 'field2'},
{header: "Field 3", width: 115, dataIndex: 'field3'},
]);
cm.defaultSortable = true;

// create the grid
var grid = new Ext.grid.GridPanel({
ds: ds,
cm: cm,
renderTo:'example-grid',
width:540,
height:200
});

ds.load();
});
</script>
</body>
</html>


both files are being included(i can see them with web developer on firefox) so what is wrong with this code?

evant
22 Oct 2007, 4:39 PM
In some browsers I think it might ignore the comments around the script tags. Be sure it's not including the jquery adapter.

hendricd
22 Oct 2007, 4:43 PM
and, you don't want to load ext-base.js. It is a standalone adapter.

RyanZec
22 Oct 2007, 4:49 PM
my new code


<html>
<head>
<title>grid test</title>
<script type="javascript" src="/kaizen/api/js/ext/adapter/ext/ext-base.js"></script>
<script type="javascript" src="/kaizen/api/js/ext/ext-all.js"></script>
<body>
<script>
Ext.onReady(function()
{
// create the Data Store
var ds = new Ext.data.Store({
// load using HTTP
url: 'test.xml',

// the return will be XML, so lets set up a reader
reader: new Ext.data.XmlReader({
// records will have an "Item" tag
record: 'tester',
id: 'id',
totalRecords: '@total'
}, [
// set up the fields mapping into the xml doc
// The first needs mapping, the others are very basic
{name: 'field1', mapping: 'stats > field1'},
'field2', 'field3'
])
});

var cm = new Ext.grid.ColumnModel([
{header: "Field 1", width: 120, dataIndex: 'field1'},
{header: "Field 2", width: 180, dataIndex: 'field2'},
{header: "Field 3", width: 115, dataIndex: 'field3'},
]);
cm.defaultSortable = true;

// create the grid
var grid = new Ext.grid.GridPanel({
ds: ds,
cm: cm,
renderTo:'example-grid',
width:540,
height:200
});

ds.load();
});
</script>
</body>
</html>

i tried without ext-base.js and still no luck

evant
22 Oct 2007, 4:51 PM
It's almost definitely a problem with the paths, please put both ext-base and ext-all in the same directory as your html file just to be sure.

hendricd
22 Oct 2007, 4:52 PM
your html is wrong

RyanZec
22 Oct 2007, 5:03 PM
It's almost definitely a problem with the paths, please put both ext-base and ext-all in the same directory as your html file just to be sure.
I know 100% that the file are being included, web developer toolbar for FF would tell me if it was not being included.


your html is wrong
adding the </head> did not help.

evant
22 Oct 2007, 5:04 PM
Post your example online somewhere that we can see.

RyanZec
22 Oct 2007, 5:50 PM
http://www.kaizendigital.com/test.php

evant
22 Oct 2007, 5:54 PM
I'm not getting an onReady error, firebug doesn't report any problems.

However, see in your code"



renderTo:'example-grid',


There is no element with an id example-grid in your HTML.

RyanZec
22 Oct 2007, 6:08 PM
Ext is not defined
[Break on this error] Ext.onReady(function()

that is the error i get from that page, i just tried to clear all my private data. can i see a screen shoot of it not giving error?

i also added a div with that id so the table should show up.

hendricd
22 Oct 2007, 6:26 PM
Have you tried this ? :



<script type="text/javascript" src="http://www.kaizendigital.com/api/js/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="http://www.kaizendigital.com/api/js/ext/ext-all.js"></script>

RyanZec
22 Oct 2007, 6:36 PM
type="text/javascript"

is not valid xhtml code.

hendricd
22 Oct 2007, 6:41 PM
where is your valid xhtml code ? 8-|

JeffHowden
22 Oct 2007, 6:43 PM
You're quite mistaken. Perhaps you are thinking of the "language" attribute?

RyanZec
22 Oct 2007, 7:27 PM
well what i said was right, type is not a valid xhtml code but yea i did not realize i have type instead of language, thanks guys.

JeffHowden
22 Oct 2007, 8:46 PM
By that, I hope you mean that you realize that the "language" attribute is not a valid XHTML <script> tag attribute and that the valid XHTML attribute is "type" with a value of "text/javascript".

brian.moeskau
22 Oct 2007, 9:58 PM
Ryan,

I copied your page as-is, dropped it into a local test page using your absolute script paths, and it fails with the same error. If I simply change the script type to "text/javascript" it works fine. The "text/javascript" type is perfectly valid according to the W3C (I could not find "proof" that "javascript" is not a valid type, but I'm pretty sure it's not and I think you've provided the test case that proves it ;)). I would suggest sticking with "text/javascript":

http://www.w3.org/TR/html401/interact/scripts.html#adef-type-SCRIPT

One thing you are still missing -- anytime you use any of the Ext widgets, you also need the CSS:


<link rel="stylesheet" type="text/css" href="your/path/to/ext-all.css">

huangfengjing
22 Oct 2007, 10:40 PM
I get no error report, everything goes well with ff

RyanZec
23 Oct 2007, 4:31 AM
interesting, i remember watching a video from a guy at yahoo say that the type field was invalid, guess he was wrong. I have everything working now, thanks for all your help.