PDA

View Full Version : Ext.js is undefined in Chrome



fmlabs
2 Sep 2012, 4:46 PM
<apex:page controller="testGrid" showheader="false">
<script type="text/javascript" charset="utf-8" src="http://cdn.sencha.io/ext-4.1.0-gpl/ext-all.js"></script>

<link rel="stylesheet" type="text/css" href="http://cdn.sencha.io/ext-4.1.0-gpl/resources/css/ext-all.css" />
<apex:form >
<div id="gridSpace"></div>
</apex:form>


<script type="text/javascript" >
Ext.ns("Ext.Srini");
Ext.onReady(function(){
var srinipanel = new Ext.create('Ext.Srini.srinipanel', {
renderTo: gridSpace,
title : 'All Accounts'
});

ForecastSource2.getAllAccounts(function(result, er){
var res = Ext.decode(result);
store.loadData(res.Records);
}, {escape:false});
});

Ext.define('AccountModel', {
extend : 'Ext.data.Model',
fields : [
{name: 'Id', type: 'string'},
{name: 'Name', type: 'string'},
{name: 'Phone', type: 'string'},
{name: 'Type', type: 'string'}
]
});

var store = Ext.create('Ext.data.Store', {
model : 'AccountModel',
proxy : {
type : 'memory',
reader : {
type : 'json',
}
}
});

Ext.define('Ext.Srini.srinipanel', {
extend : 'Ext.grid.Panel',
alias : 'widget.srinipanel',
name : 'srinipanel',
columnLines : true,
autoScroll : true,
singleSelect: true,
selType : 'cellmodel',
border : true,
height : 400,
width : 600,
store : store,
columns : [
{
text : 'Id',
dataIndex : 'Id',
flex : 0.3
},
{
text : 'Account Name',
dataIndex : 'Name',
flex : 0.3
},
{
text : 'Account Type',
dataIndex : 'Type',
flex : 0.3
},
{
text : 'Phone',
dataIndex : 'Phone',
flex : 0.3
}
],
});
</script>
</apex:page>

dawesi
3 Sep 2012, 1:51 AM
you shouldn't use the 'Ext' namespace for your custom code, just use:



Ext.ns("Srini");


and change your namespaces accordingly.

fmlabs
3 Sep 2012, 4:03 AM
Hello,
I figured it out. Chrome was blocking content from http://cdn.sencha.io because the content was insecure. I set it to allow and was able to see the grid.
I'll maintain local copies of the library that I can reference.
thanks for your help