tw.extjs treeview - not able to get rendered in IE7
17 views
Skip to first unread message
Madhubala
Nov 20, 2009, 7:28:22 AM11/20/09
to ToscaWidgets-discuss
Hi,
I am using python 2.6, turbogears2-2.0.1 , toscawidgets-0.9.7.2 and
tw.extjs-0.1a2dev_r71 on windowsXP
I couldn't get tw.extjs treeview rendred in IE7 browser for the
sample given in toscawidget cookbook .
Below is controller code and generated html source which is not
displaying treeview(expected atleast root to be diaplayed)
------------------------------ controller code
--------------------------------
@expose('testFormPkg.templates.movie')
def ext(self):
pylons.c.tree = TreeView(divID='fileTree',
fetch=url('/fetchTree'),
collapsible=False,
title=_('Files'),
width=400,
rootID='/directory',
rootText='/directory')
return dict()
import simplejson
def _getData(self, node):
#return a list of dictionaries
#dictionaries have the format: #
'text':visible_node_name, 'id':identifier, 'cls':'file'|'folder',
'allowChildren':False, 'leaf':True}
#return the data for a given node
#more here soon
pass
@expose()
def fetchTree(self, node):
r = [self._getData(node),]
return simplejson.dumps(r)
---------------------------------------------------
http://localhost:8080/ext return the followign html
************************** html source****************
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><link rel="stylesheet" type="text/css" href="/toscawidgets/
resources/tw.extjs/static/resources/css/ext-all.css" media="all" />
<script type="text/javascript" src="/toscawidgets/resources/tw.extjs/
static/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/toscawidgets/resources/tw.extjs/
static/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="/toscawidgets/resources/
tw.extjs/static/resources/css/xtheme-aero.css" media="all" />
<script type="text/javascript">
Ext.onReady(function() {
// Define Tree.
var Tree_Category_Loader = new Ext.tree.TreeLoader({
dataUrl :"/fetchTree"
});
var Tree_Category = new Ext.tree.TreePanel({
title : "Files",
collapsible : false,
animCollapse : true,
border : true,
id : "fileTree",
el : "fileTree",
autoScroll : true,
animate : true,
enableDD : true,
containerScroll : true,
height : 300,
width : 400,
loader : Tree_Category_Loader,
frame : true,
});
// SET the root node.
var Tree_Category_Root = new Ext.tree.AsyncTreeNode({
text : '/directory',
draggable : false,
id : '/directory'
});
// Render the tree.
Tree_Category.setRootNode(Tree_Category_Root);
Tree_Category.render();
Tree_Category_Root.expand();
});
</script>
<title>TreeView</title>
</head>
<body>
<div id="fileTree"></div>
</body>
</html>
***********************************************************
Can any one let me know the reason why tree is not getting displayed?
Thanks,
Madhubala
I am using python 2.6, turbogears2-2.0.1 , toscawidgets-0.9.7.2 and
tw.extjs-0.1a2dev_r71 on windowsXP
I couldn't get tw.extjs treeview rendred in IE7 browser for the
sample given in toscawidget cookbook .
Below is controller code and generated html source which is not
displaying treeview(expected atleast root to be diaplayed)
------------------------------ controller code
--------------------------------
@expose('testFormPkg.templates.movie')
def ext(self):
pylons.c.tree = TreeView(divID='fileTree',
fetch=url('/fetchTree'),
collapsible=False,
title=_('Files'),
width=400,
rootID='/directory',
rootText='/directory')
return dict()
import simplejson
def _getData(self, node):
#return a list of dictionaries
#dictionaries have the format: #
'text':visible_node_name, 'id':identifier, 'cls':'file'|'folder',
'allowChildren':False, 'leaf':True}
#return the data for a given node
#more here soon
pass
@expose()
def fetchTree(self, node):
r = [self._getData(node),]
return simplejson.dumps(r)
---------------------------------------------------
http://localhost:8080/ext return the followign html
************************** html source****************
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><link rel="stylesheet" type="text/css" href="/toscawidgets/
resources/tw.extjs/static/resources/css/ext-all.css" media="all" />
<script type="text/javascript" src="/toscawidgets/resources/tw.extjs/
static/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="/toscawidgets/resources/tw.extjs/
static/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="/toscawidgets/resources/
tw.extjs/static/resources/css/xtheme-aero.css" media="all" />
<script type="text/javascript">
Ext.onReady(function() {
// Define Tree.
var Tree_Category_Loader = new Ext.tree.TreeLoader({
dataUrl :"/fetchTree"
});
var Tree_Category = new Ext.tree.TreePanel({
title : "Files",
collapsible : false,
animCollapse : true,
border : true,
id : "fileTree",
el : "fileTree",
autoScroll : true,
animate : true,
enableDD : true,
containerScroll : true,
height : 300,
width : 400,
loader : Tree_Category_Loader,
frame : true,
});
// SET the root node.
var Tree_Category_Root = new Ext.tree.AsyncTreeNode({
text : '/directory',
draggable : false,
id : '/directory'
});
// Render the tree.
Tree_Category.setRootNode(Tree_Category_Root);
Tree_Category.render();
Tree_Category_Root.expand();
});
</script>
<title>TreeView</title>
</head>
<body>
<div id="fileTree"></div>
</body>
</html>
***********************************************************
Can any one let me know the reason why tree is not getting displayed?
Thanks,
Madhubala
percious
Dec 1, 2009, 11:16:46 AM12/1/09
to ToscaWidgets-discuss
Stupid IE.
It looks as if there is an extra comma on the:
frame : true,
line of code.
Admittedly, I have not tested our extjs code on IE, and the extjs
package is somewhat
deprecated due to the fact that we cannot include further versions of
extjs in the library for licensing reasons. However, if you are able
to fix this and send me a pull request I will get it merged.
cheers.
-chris
It looks as if there is an extra comma on the:
frame : true,
line of code.
Admittedly, I have not tested our extjs code on IE, and the extjs
package is somewhat
deprecated due to the fact that we cannot include further versions of
extjs in the library for licensing reasons. However, if you are able
to fix this and send me a pull request I will get it merged.
cheers.
-chris
Reply all
Reply to author
Forward
0 new messages