2008-03-29
第一个ExtJS,在FireFox下显示不了,请各位指教
关键字: 请高手分析一下
[SourceCode]
Ext.onReady(function() {
var northPanel = new Ext.Panel({
region: 'north',
autoLoad: {url: 'top.jsp'},
split: false,
height: 31,
minSize: 31,
maxSize: 31
});
var treePanel = new Ext.Panel({
title: 'Menus',
region: 'west',
contentEl: 'layout_menu',
split: true,
border: true,
collapsible: false,
margins:'2 0 5 0',
cmargins:'0 0 0 0',
lines:false,
autoScroll:true,
autoHeight:false,
width: 220,
minSize: 220,
maxSize: 220
});
mainPanel = new Ext.TabPanel({
region:'center',
resizeTabs:true,
minTabWidth: 135,
tabWidth: 135,
margins:'2 0 5 0',
cmargins:'0 0 0 0',
activeTab: 0,
items: {
id:'welcome-panel',
title: 'Index',
autoLoad: {url: 'welcome.html',scripts:true}
}
});
//mainPanel.activate('welcome-panel');
var viewport = new Ext.Viewport({
layout:'border',
items:[northPanel, treePanel, mainPanel]
});
var menudata = {
"id":"rootmenu",
"text":"System Maintaince",
"singleClickExpand":true,
"iconCls":"icon-pkg",
"isClass":true,
"children":[{
"href":"maintaince/menus/list.jsp",
"text":"Menus",
"id":"test1",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/menubuttons/list.jsp",
"text":"MenuButtons",
"id":"test2",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functioncode/list.jsp",
"text":"FunctionUNITS",
"id":"test3",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionurl/list.jsp",
"text":"FunctionURL",
"id":"test4",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functioncolumn/list.jsp",
"text":"FunctionDLL",
"id":"test5",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionlist/list.jsp",
"text":"FunctionLIST",
"id":"test6",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionprint/list.jsp",
"text":"FunctionPRINT",
"id":"test7",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionquery/list.jsp",
"text":"FunctionQUERY",
"id":"test8",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
}
]
};
var menudata2 = {
"id":"rootmenu2",
"text":"Database Maintaince",
"singleClickExpand":true,
"iconCls":"icon-pkg",
"isClass":true,
"children":[{
"href":"maintaince/menus/list.jsp",
"text":"Menus",
"id":"test21",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/menubuttons/list.jsp",
"text":"MenuButtons",
"id":"test22",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functioncode/list.jsp",
"text":"FunctionUNITS",
"id":"test23",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionlist/list.jsp",
"text":"FunctionLIST",
"id":"test24",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/menubuttons/list.jsp",
"text":"MenuButtons",
"id":"test25",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functioncode/list.jsp",
"text":"FunctionUNITS",
"id":"test263",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionlist/list.jsp",
"text":"FunctionLIST",
"id":"test27",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
}
]
};
var Tree = Ext.tree;
var treePanel = new Tree.TreePanel({
el:'layout_menu',
border : false,
rootVisible:true,
animate:true,
enableDD:false,
lines:false,
containerScroll: true,
loader: new Ext.tree.TreeLoader({
preloadChildren: true,
clearOnLoad: true
}),
root: new Ext.tree.AsyncTreeNode({
text:'CareSoft',
id:'root',
iconCls:"icon-pkg",
expanded:true,
children:[menudata,menudata2]
}),
collapseFirst:false
});
treePanel.render();
treePanel.expandAll();
new Tree.TreeSorter(treePanel,{folderSort:true});
treePanel.on("click", function(node, e){
e.stopEvent();
var _attr = node.attributes;
var _href = _attr.href;
if(node.isLeaf() && _href){
var _id = node.id;
var _tab = mainPanel.findById(_id);
if(_tab) {
mainPanel.activate(_id);
return;
}
mainPanel.add({
id: _id,
title: node.text,
autoHeight: true,
margins:'5 5 5 5',
autoLoad: {url: _href, scripts:true, params: 'id='+ _id +'&title=' + node.text },
closable:true
}).show();
}
});
});
在IE中运行正常,但在 FireFox中菜单那部份是空白的,用FireBug可以看到有元素存在,但就是没有显示出来,错误信息没有,只有一些CSS方面的警告,请各位指教。
另外,个人感觉到看sample挺漂亮的,但自己做到应用程序中后,发现并不怎么样,感觉不是很清爽,还不如1.1中那个纯蓝色的感觉好,你们认为呢?
Ext.onReady(function() {
var northPanel = new Ext.Panel({
region: 'north',
autoLoad: {url: 'top.jsp'},
split: false,
height: 31,
minSize: 31,
maxSize: 31
});
var treePanel = new Ext.Panel({
title: 'Menus',
region: 'west',
contentEl: 'layout_menu',
split: true,
border: true,
collapsible: false,
margins:'2 0 5 0',
cmargins:'0 0 0 0',
lines:false,
autoScroll:true,
autoHeight:false,
width: 220,
minSize: 220,
maxSize: 220
});
mainPanel = new Ext.TabPanel({
region:'center',
resizeTabs:true,
minTabWidth: 135,
tabWidth: 135,
margins:'2 0 5 0',
cmargins:'0 0 0 0',
activeTab: 0,
items: {
id:'welcome-panel',
title: 'Index',
autoLoad: {url: 'welcome.html',scripts:true}
}
});
//mainPanel.activate('welcome-panel');
var viewport = new Ext.Viewport({
layout:'border',
items:[northPanel, treePanel, mainPanel]
});
var menudata = {
"id":"rootmenu",
"text":"System Maintaince",
"singleClickExpand":true,
"iconCls":"icon-pkg",
"isClass":true,
"children":[{
"href":"maintaince/menus/list.jsp",
"text":"Menus",
"id":"test1",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/menubuttons/list.jsp",
"text":"MenuButtons",
"id":"test2",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functioncode/list.jsp",
"text":"FunctionUNITS",
"id":"test3",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionurl/list.jsp",
"text":"FunctionURL",
"id":"test4",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functioncolumn/list.jsp",
"text":"FunctionDLL",
"id":"test5",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionlist/list.jsp",
"text":"FunctionLIST",
"id":"test6",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionprint/list.jsp",
"text":"FunctionPRINT",
"id":"test7",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionquery/list.jsp",
"text":"FunctionQUERY",
"id":"test8",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
}
]
};
var menudata2 = {
"id":"rootmenu2",
"text":"Database Maintaince",
"singleClickExpand":true,
"iconCls":"icon-pkg",
"isClass":true,
"children":[{
"href":"maintaince/menus/list.jsp",
"text":"Menus",
"id":"test21",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/menubuttons/list.jsp",
"text":"MenuButtons",
"id":"test22",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functioncode/list.jsp",
"text":"FunctionUNITS",
"id":"test23",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionlist/list.jsp",
"text":"FunctionLIST",
"id":"test24",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/menubuttons/list.jsp",
"text":"MenuButtons",
"id":"test25",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functioncode/list.jsp",
"text":"FunctionUNITS",
"id":"test263",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
},{
"href":"maintaince/functionlist/list.jsp",
"text":"FunctionLIST",
"id":"test27",
"edit":false,
"leaf":true,
"iconCls":"icon-cls"
}
]
};
var Tree = Ext.tree;
var treePanel = new Tree.TreePanel({
el:'layout_menu',
border : false,
rootVisible:true,
animate:true,
enableDD:false,
lines:false,
containerScroll: true,
loader: new Ext.tree.TreeLoader({
preloadChildren: true,
clearOnLoad: true
}),
root: new Ext.tree.AsyncTreeNode({
text:'CareSoft',
id:'root',
iconCls:"icon-pkg",
expanded:true,
children:[menudata,menudata2]
}),
collapseFirst:false
});
treePanel.render();
treePanel.expandAll();
new Tree.TreeSorter(treePanel,{folderSort:true});
treePanel.on("click", function(node, e){
e.stopEvent();
var _attr = node.attributes;
var _href = _attr.href;
if(node.isLeaf() && _href){
var _id = node.id;
var _tab = mainPanel.findById(_id);
if(_tab) {
mainPanel.activate(_id);
return;
}
mainPanel.add({
id: _id,
title: node.text,
autoHeight: true,
margins:'5 5 5 5',
autoLoad: {url: _href, scripts:true, params: 'id='+ _id +'&title=' + node.text },
closable:true
}).show();
}
});
});
在IE中运行正常,但在 FireFox中菜单那部份是空白的,用FireBug可以看到有元素存在,但就是没有显示出来,错误信息没有,只有一些CSS方面的警告,请各位指教。
另外,个人感觉到看sample挺漂亮的,但自己做到应用程序中后,发现并不怎么样,感觉不是很清爽,还不如1.1中那个纯蓝色的感觉好,你们认为呢?
评论
huhuyeah
2008-04-08
试出来了
要给panel的容器定义相应的样式才可以显示,指定宽度高度就可以显示了
要给panel的容器定义相应的样式才可以显示,指定宽度高度就可以显示了
huhuyeah
2008-04-07
我也碰到了这个问题,
我用firebug是可以一层一层的点到显示不了的树的跟节点的
搞不懂怎么回事为什么没显示出来
我用firebug是可以一层一层的点到显示不了的树的跟节点的
搞不懂怎么回事为什么没显示出来
发表评论
提醒: 该博客已发表在公共论坛,博客所有留言会成为论坛回贴,留言请注意遵守论坛发贴规则
- 浏览: 907 次

- 详细资料
搜索本博客
最新评论
-
秀下用EXTJS做的界面,顺 ...
天呀,grid就是不刷新数据...... 使用过 grid.getView(). ...
-- by vicksong -
秀下用EXTJS做的界面,顺 ...
dboylx 写道1,grid.getStore(). reload([Obje ...
-- by vicksong -
秀下用EXTJS做的界面,顺 ...
1,grid.getStore(). reload([Object option ...
-- by dboylx -
秀下用EXTJS做的界面,顺 ...
jjx 写道ext 的ui真是越看越恶心啊 ,呵呵 这位兄台,有比Ext更好的U ...
-- by vicksong -
秀下用EXTJS做的界面,顺 ...
sdlfly2000 写道做的再好有什么用,诶~~~ 除非你买了license ...
-- by vicksong






评论排行榜