当前位置: 首页 > 图文教程 > 网络编程 > Javascript > EXT富客户端后台管理系统 初步代码

Javascript
jquery 弹出层实现代码
jQuery 扩展对input的一些操作方法
扩展jQuery 键盘事件的几个基本方法
Iframe 自适应高度并实时监控高度变化的js代码
CCPry JS类库 代码
jquery text()要注意啦
json 入门基础教程 推荐
json 实例详细说明教程
JavaScript中的JSON 中文版翻译
javascript GUID生成器实现代码
DOM 脚本编程中的兄弟节点
JavaScript Sort 表格排序
提高网站性能之 如何对待JavaScript
js 函数的执行环境和作用域链的深入解析
键盘 keycode的值 javascript时触发事件时很有用的要素
cnblogs csdn 代码运行框实现代码
简单实用的HTML到UBB转换脚本工具实现说明
Javascript结合css实现网页换肤功能
JQuery 网站换肤功能实现代码
JS OOP包机制,类创建的方法定义

Javascript 中的 EXT富客户端后台管理系统 初步代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 175 ::
收藏到网摘: n/a

EXT富客户端后台管理系统 初步代码提供给大家 <!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=UTF-8">
<title><%$sitename%></title>
<%*加载的Extjs 资源文件 -- 开始*%>
<link rel="stylesheet" type="text/css" href="<%$extjs_res%>" />
<script type="text/javascript" src="<%$extjs_adapter%>"></script>
<script type="text/javascript" src="<%$extjs_laction%>"></script>
<%*加载的Extjs 资源文件 -- 结束*%>
<%*执行块的JS区域 -- 开始*%>
<script type="text/javascript">
//具体开发 -- BJExtreme类
BJExtreme= function(){} ;
BJExtreme.prototype.getAuthor = function(){
return '许消寒' ;
}
BJExtreme.prototype.getVersion = function(){
return '2008年08月13日 17:00' ;
}
BJExtreme.prototype.getController = function(){
return 'index.php' ;
}
BJExtreme.prototype.buildLinkStr = function(ctl,act){
if (ctl == undefined)
return BJExtreme.prototype.getController() ;
if (act == undefined)
act = null ;
return BJExtreme.prototype.getController() + '?ctl=' + ctl + '&act=' + act ;
}
BJExtreme.prototype.showWindow = function(title1,width1,height1,html1){
if (this.win == undefined){
this.win = new Ext.Window({
title: title1,
width: width1 ,
height: height1 ,
html: html1
});
}
else {
this.win.close();
this.win = new Ext.Window({
title: title1,
width: width1 ,
height: height1 ,
html: html1
});
}
this.win.show();
}
/*对出现的UI组件单独封装*/
BJExtreme.prototype.ui = function(){} ;
BJExtreme.prototype.ui.mainTopic = {
title: 'Beijing Extreme 后台管理', region: 'north' ,
html: '<embed src="<%$prj_dir%>/swf/top_title.swf" quality="high" type="application/x-shockwave-flash" width="450" height="50"></embed>'
};
/*左侧菜单项操作 -- 开始*/
//定义初始话状态时的菜单条对象
BJExtreme.prototype.ui.menuBar = {
xtype: 'treepanel' ,
title: '菜单',region: 'west',width: 200 ,collapsible: true ,
loader: null , root: null ,rootVisible: true , listeners: null
};
//旅游相关
BJExtreme.prototype.ui.menuBar.Traveling = {
text: '旅游' ,
leaf: false , // 这个设为false 则显示文件夹图标 , true 则显示单项图标
children: null
};
BJExtreme.prototype.ui.menuBar.Traveling.children = [
{text: '北京',leaf: true ,ctl: 'Peking',act: ''},
{text: '西藏' ,leaf: true ,ctl: 'Tibet' ,act: ''},
{text: '泰国' ,leaf: true},
{text: '香格里拉',leaf: true,ctl:'Shangrila',act: ''}
];
//藏医相关
BJExtreme.prototype.ui.menuBar.Mibetdoctor = {
text: '藏医' ,
leaf: false ,
children: null
};
BJExtreme.prototype.ui.menuBar.Mibetdoctor.children = [
{text: '藏医历史',leaf: true},
{text: '藏医理论' ,leaf: true},
{text: '诊断' ,leaf: true},
{text: '病症' ,leaf: true},
{text: '治疗',leaf: true}
];
EXT富客户端后台管理系统 初步代码提供给大家
//潜水
BJExtreme.prototype.ui.menuBar.Diving = {
text: '潜水' ,
leaf: false ,
children: null
};
//登山
BJExtreme.prototype.ui.menuBar.Mountain = {
text: '登山' ,
leaf: false ,
children: null
};
//攀岩
BJExtreme.prototype.ui.menuBar.Rockclimbe = {
text: '攀岩' ,
leaf: false ,
children: null
};
//徒步
BJExtreme.prototype.ui.menuBar.Onfoot = {
text: '徒步' ,
leaf: false ,
children: null
};
//摩托车
BJExtreme.prototype.ui.menuBar.Motorcycle = {
text: '摩托车' ,
leaf: false ,
children: null
};
//项目中集成的模块
BJExtreme.prototype.ui.menuBar.ModuleInProject = {
text: '项目中集成的模块' ,
leaf: false ,
children: null
};
BJExtreme.prototype.ui.menuBar.ModuleInProject.children = [
{
text: '互动提示条',leaf: true,ctl: 'ExtjsStudy',act: 'linkTips',
//这个运行的优先级高于下面的那个通用的监听控制器
listeners:{click: function (n){window.open(BJExtreme.prototype.buildLinkStr(n.attributes.ctl,n.attributes.act));return false ;}}
}
];
//初始化 菜单项元素 信息 -- 这个必须在 -- 当前菜单是使用异步树组件生成的 , 以后可以添加其他不同的实现
BJExtreme.prototype.ui.menuBar.loader = new Ext.tree.TreeLoader();
BJExtreme.prototype.ui.menuBar.root = new Ext.tree.AsyncTreeNode({
expanded: true ,
children: [
BJExtreme.prototype.ui.menuBar.Traveling ,
BJExtreme.prototype.ui.menuBar.Mibetdoctor ,
BJExtreme.prototype.ui.menuBar.Diving ,
BJExtreme.prototype.ui.menuBar.Mountain ,
BJExtreme.prototype.ui.menuBar.Rockclimbe ,
BJExtreme.prototype.ui.menuBar.Onfoot ,
BJExtreme.prototype.ui.menuBar.Motorcycle ,
BJExtreme.prototype.ui.menuBar.ModuleInProject
]
});
//定义一个简单的响应事件
BJExtreme.prototype.ui.menuBar.listeners = {
click: function (n) //n.attributes 可以获得AsyncTreeNode的children中的对象
{
if (n.attributes.leaf == true) //叶选项
{
//n.attributes.text n.attributes.leaf
var ctlStr = BJExtreme.prototype.buildLinkStr(n.attributes.ctl,n.attributes.act);
myextreme.showWindow('当前控制器',400,300,ctlStr) ;
}
else //包含子菜单
{
//not to do
}
}
};
//菜单选项结束
//主内容面板
BJExtreme.prototype.ui.contentPane = {
id: "main_content", xtype: "tabpanel" , region: 'center' ,items: [{title: '主内容面板'}]
};
//状态条
BJExtreme.prototype.ui.statusBar = {
xtype: "tabpanel" , region: 'south' ,items: [{title: '状态条'}]
};
BJExtreme.prototype.buildMainPane = function(BJExtremeObj){
//Ext.Viewport 用来将对象渲染到页面中的body块中,会自动改变,每个页面仅限一个
this.mainPane = new Ext.Viewport({
enableTabScroll: true ,
layout: 'border', //设为fit则不能显示复合面板
items: [
BJExtremeObj.ui.mainTopic,
BJExtremeObj.ui.menuBar ,
BJExtremeObj.ui.contentPane ,
BJExtremeObj.ui.statusBar
]
}) ;
}
var myextreme = new BJExtreme() ;
Ext.onReady(
function(){
//Ext.MessageBox.alert('BJExtreme Version',myextreme.getVersion());
//Ext.MessageBox.alert('BJExtreme Version',myextreme.buildLinkStr('t','b'));
myextreme.buildMainPane(myextreme) ;
}
);
</script>
<%*执行块的JS区域 -- 结束*%>
</head>
<body>
<!-- //页面中子导航菜单 -->
</body>
</html>