ExtJS red flag: Can I work around it, and if so how?
In an earlier question, Why is my ExtJS datagrid populating as empty?, I made what was intended to be a "first try" implementation based on Jesus Garcia's ExtJS in Action (five stars on Amazon). When that didn't work, I went to reimplement the example I was trying to follow (pp. 159-161). I corrected a bug where in nameRecord a column is called 'name' and in colModel it is called 'fullName', but otherwise this page implements the example code identically barring whitespace:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/extjs/resources/css/ext-all.css" />
<script type="text/javascript"
src="/extjs/adapter/ext/ext-base-debug.js">
</script>
<script type="text/javascript" src="/extjs/ext-all-debug.js"></script>
</head>
<body>
<script type="text/javascript">
var arrayData = [
['Jay Garcia', 'MD'],
['Aaron Baker', 'VA'],
['Susan Smith', 'DC'],
['Mary Stein', 'DE'],
['Bryan Shanley', 'NJ'],
['Nyri Selgado', 'CA']
];
var nameRecord = Ext.data.Record.create([
{name: 'fullName', mapping: 1},
{name: 'state', mapping: 2}
]);
var arrayReader = new Ext.data.ArrayReader({}, nameRecord);
var memoryProxy = new Ext.data.MemoryProxy(arrayData);
var store = new Ext.data.Store({
reader: arrayReader,
proxy: memoryProxy
});
var colModel = new Ext.grid.ColumnModel([
{
header: 'Full Name',
sortable: true,
dataIndex: 'fullName'
},
{
header: 'State',
dataIndex: 'sta开发者_如何学Pythonte'
}
]);
var gridView = new Ext.grid.GridView();
var selModel = new Ext.grid.RowSelectionModel({
singleSelect: true
});
var grid = new Ext.grid.GridPanel({
title: 'Our first grid',
renderTo: Ext.getBody(),
autoHeight: true,
width: 250,
store: store,
view: gridView,
colModel: colModel,
selModel: selModel
});
</script>
</body>
</html>
And this fails in the same way as my earlier question (Why is my ExtJS datagrid populating as empty?): it displays the headers but no rows of data.
So I have two questions:
First, what can I learn from this? Is this just what happens when you try to follow this specific title on how to use ExtJS? Is there another book I should be working from instead?
Second, where (if anywhere) can I find simple, working ExtJS datagrid demos that I can get working and then begin to adapt to my purposes?
Change your record creation to
var nameRecord = Ext.data.Record.create([
{name: 'fullName', mapping: 0},
{name: 'state', mapping: 1}
]);
and your store creation to
var store = new Ext.data.Store({
reader: arrayReader,
proxy: memoryProxy,
autoLoad: true
});
Regarding your second question: try the examples page on sencha.com.
加载中,请稍侯......
精彩评论