phdbrianlee
11 Apr 2008, 12:14 AM
firefox prompts following info:
Node cannot be inserted at the specified point in the hierarchy" code: "3
help needed.
HTML file:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>grid test</title>
<link rel="stylesheet" type="text/css" href="lib/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="lib/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="lib/ext/ext-all.js"></script>
<script type="text/javascript" src="grid.js"></script>
</head>
<body>
<div id="grid-example"></div>
</body>
</html>
javascript file which is named as grid.js.
/**
* @author brian
*/
Ext.onReady(function(){
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
var df= [
'title', 'forumtitle', 'forumid', 'author',
{name: 'replycount', type: 'int'},
{name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp'},
'lastposter', 'excerpt'
];
function renderTopic(value, p, record){
return String.format(
'<b><a href="http://extjs.com/forum/showthread.php?t={2}" target="_blank">{0}</a></b><a href="http://extjs.com/forum/forumdisplay.php?f={3}" target="_blank">{1} Forum</a>',
value, record.data.forumtitle, record.id, record.data.forumid);
}
function renderLast(value, p, r){
return String.format('{0}<br/>by {1}', value.dateFormat('M j, Y, g:i a'), r.data['lastposter']);
}
var cmf = [{
id: 'topic', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
header: "Topic",
dataIndex: 'title',
width: 420,
renderer: renderTopic
},{
header: "Author",
dataIndex: 'author',
width: 100,
hidden: true
},{
header: "Replies",
dataIndex: 'replycount',
width: 70,
align: 'right'
},{
id: 'last',
header: "Last Post",
dataIndex: 'lastpost',
width: 150,
renderer: renderLast
}];
// create the Grid http://extjs.com/forum/topics-browse-remote.php grid-data.json
var grid = createGrid(df,cmf,'grid-example','http://extjs.com/forum/topics-browse-remote.php');
//grid.getColumnModel().setRenderer(0,renderTopic);
//grid.getColumnModel().setRenderer(3,renderLast);
grid.getColumnModel().setHidden(1,false);
grid.render('grid-example');
grid.getSelectionModel().selectFirstRow();
/**
* @todo test
* @param {Array} dataFields
* @param {div} gridDiv
* @param {string} dataUrl
*/
function createGrid(dsFields,cmFields,gridDiv,dataUrl){
var reader = new Ext.data.JsonReader({
root: 'topics',
totalProperty: 'totalCount',
id: 'threadid',
fields: dsFields
});
var store = new Ext.data.Store({
proxy: new Ext.data.ScriptTagProxy({
url: dataUrl
}),
reader: reader,
// turn on remote sorting
remoteSort: true
});
store.setDefaultSort('lastpost', 'desc');
store.on("loadexception", function() {
Ext.Msg.alert('server error', 'server error');
});
store.load( {
params : {
start : 0,
limit : 5
}
});
var cm = new Ext.grid.ColumnModel(cmFields);
cm.defaultSortable = true;
var grid = new Ext.grid.GridPanel ( {
el:gridDiv,
store : store,
cm : cm,
sm : new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
width : 600,
height : 250,
title : 'grid',
frame : true,
loadMask : true,
bbar : new Ext.PagingToolbar( {
pageSize : 5,
store : store,
displayInfo : true,
displayMsg : '{0} - {1}, totally {2}',
emptyMsg : "no data！"
}),
loadMask: true
});
return grid;
}
function test(){
var dataFields = [];
var cmConf = [];
for(var i =0;i<dataFields.length;i++){
var item = dataFields[i];
var str = {
header: item.name,
dataIndex: item.name,
width: 80,
sortable: true
};
cmConf.push(str);
}
}
});
Node cannot be inserted at the specified point in the hierarchy" code: "3
help needed.
HTML file:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>grid test</title>
<link rel="stylesheet" type="text/css" href="lib/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="lib/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="lib/ext/ext-all.js"></script>
<script type="text/javascript" src="grid.js"></script>
</head>
<body>
<div id="grid-example"></div>
</body>
</html>
javascript file which is named as grid.js.
/**
* @author brian
*/
Ext.onReady(function(){
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
var df= [
'title', 'forumtitle', 'forumid', 'author',
{name: 'replycount', type: 'int'},
{name: 'lastpost', mapping: 'lastpost', type: 'date', dateFormat: 'timestamp'},
'lastposter', 'excerpt'
];
function renderTopic(value, p, record){
return String.format(
'<b><a href="http://extjs.com/forum/showthread.php?t={2}" target="_blank">{0}</a></b><a href="http://extjs.com/forum/forumdisplay.php?f={3}" target="_blank">{1} Forum</a>',
value, record.data.forumtitle, record.id, record.data.forumid);
}
function renderLast(value, p, r){
return String.format('{0}<br/>by {1}', value.dateFormat('M j, Y, g:i a'), r.data['lastposter']);
}
var cmf = [{
id: 'topic', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
header: "Topic",
dataIndex: 'title',
width: 420,
renderer: renderTopic
},{
header: "Author",
dataIndex: 'author',
width: 100,
hidden: true
},{
header: "Replies",
dataIndex: 'replycount',
width: 70,
align: 'right'
},{
id: 'last',
header: "Last Post",
dataIndex: 'lastpost',
width: 150,
renderer: renderLast
}];
// create the Grid http://extjs.com/forum/topics-browse-remote.php grid-data.json
var grid = createGrid(df,cmf,'grid-example','http://extjs.com/forum/topics-browse-remote.php');
//grid.getColumnModel().setRenderer(0,renderTopic);
//grid.getColumnModel().setRenderer(3,renderLast);
grid.getColumnModel().setHidden(1,false);
grid.render('grid-example');
grid.getSelectionModel().selectFirstRow();
/**
* @todo test
* @param {Array} dataFields
* @param {div} gridDiv
* @param {string} dataUrl
*/
function createGrid(dsFields,cmFields,gridDiv,dataUrl){
var reader = new Ext.data.JsonReader({
root: 'topics',
totalProperty: 'totalCount',
id: 'threadid',
fields: dsFields
});
var store = new Ext.data.Store({
proxy: new Ext.data.ScriptTagProxy({
url: dataUrl
}),
reader: reader,
// turn on remote sorting
remoteSort: true
});
store.setDefaultSort('lastpost', 'desc');
store.on("loadexception", function() {
Ext.Msg.alert('server error', 'server error');
});
store.load( {
params : {
start : 0,
limit : 5
}
});
var cm = new Ext.grid.ColumnModel(cmFields);
cm.defaultSortable = true;
var grid = new Ext.grid.GridPanel ( {
el:gridDiv,
store : store,
cm : cm,
sm : new Ext.grid.RowSelectionModel({selectRow:Ext.emptyFn}),
width : 600,
height : 250,
title : 'grid',
frame : true,
loadMask : true,
bbar : new Ext.PagingToolbar( {
pageSize : 5,
store : store,
displayInfo : true,
displayMsg : '{0} - {1}, totally {2}',
emptyMsg : "no data！"
}),
loadMask: true
});
return grid;
}
function test(){
var dataFields = [];
var cmConf = [];
for(var i =0;i<dataFields.length;i++){
var item = dataFields[i];
var str = {
header: item.name,
dataIndex: item.name,
width: 80,
sortable: true
};
cmConf.push(str);
}
}
});