Hi,
I am loading this JSON via the Ext.tree.TreeLoader:
Code:
[{
text: 'First',
expanded: true,
path: '1e:/',
iconCls: 'x-tree-node-leaf',
children: [{
text: 'one',
path: 'c:/',
leaf: true,
iconCls: 'x-tree-node-collapsed'
}, {
text: 'two',
path: 'd:/',
leaf: true,
iconCls: 'x-tree-node-collapsed'
}]
}, {
text: 'Second',
expanded: true,
path: '2e:/',
children: [{
text: 'one',
path: 'e:/',
leaf: true,
iconCls: 'x-tree-node-collapsed'
}]
}]
It looks like that the iconCls doesnt´t work ... what am I doing wrong?
Here my complete example:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<!-- ExtJS -->
<link rel="stylesheet" type="text/css" href="js/extjs310/resources/css/ext-all.css">
<script type="text/javascript" src="js/extjs310/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="js/extjs310/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
Ext.QuickTips.init();
treeloader = new Ext.tree.TreeLoader({
dataUrl: 'dummy6.json',
clearOnLoad: false
});
// Create the "SampleTreePanel" pre-configured class
SampleTreePanel = Ext.extend(Ext.tree.TreePanel, {
title: 'Sample Tree Panel',
width: 200,
height: 400,
loader: treeloader,
rootVisible: false,
border: false,
singleExpand: true,
initComponent: function(){
Ext.apply(this, {
root: new Ext.tree.AsyncTreeNode({})
})
SampleTreePanel.superclass.initComponent.apply(this, arguments);
}
});
Ext.reg('tree_panel', SampleTreePanel);
// Instantiate the tree panel, then attach an event listener..
var tree = new SampleTreePanel();
tree.on('click', function(node, e){
debugger;
}, this);
treeloader.on('load', function(tl, node) {
alert ("load: " + node.attributes.path);
}, this);
// And create a window to display the tree panel in...
var wind = new Ext.Window({
plain: true,
bodyStyle: 'padding:0px;',
layout: 'fit',
items: [tree],
tbar: new Ext.Toolbar({
items: [
{
text: '123',
handler: function() {
}
}
],
})
});
wind.show();
});
</script>
</head>
<body>
</body>
</html>
iconCls in Ext.tree.TreeNode
Reply With Quote