`

EXT富客户端后台管理系统 初步代码 -- vb2005xu自己动手系列

阅读更多

<!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}
];

//潜水
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>


  • 描述: 项目抓图 其中的互动提示条 可以实现网络抓取 实时屏幕取词功能
  • 大小: 126.7 KB
2
0
分享到:
评论
3 楼 vb2005xu 2009-06-25  
对你这个问题我很遗憾,EXT好久没有使用了,都是jquery了,这个代码我也忘了,
2 楼 le_el 2009-06-25  
还有,在FF与SAFARI中,运行效果不行。
1 楼 le_el 2009-06-24  
请教,如何在 BJExtreme.prototype.ui.mainTopic  上再加上横向排列含分级的菜单项??

相关推荐

    EXT富客户端后台管理系统 初步代码第1/2页

    EXT富客户端后台管理系统是一种基于Web的应用程序框架,用于构建具有丰富用户界面的后台管理系统。EXT是一个JavaScript库,它提供了大量的组件和工具,可以方便地创建桌面应用级别的用户体验。EXT富客户端系统通常...

    Ext slider扩展以级范例代码----下载不扣分,回帖加1分,欢迎下载,童叟无欺

    Ext slider扩展以级范例代码----下载不扣分,回帖加1分,欢迎下载,童叟无欺Ext slider扩展以级范例代码----下载不扣分,回帖加1分,欢迎下载,童叟无欺Ext slider扩展以级范例代码----下载不扣分,回帖加1分,欢迎...

    最新JAVA通用后台管理系统(ext-js、 Hibernate、 Spring mvc、 spring)可用

    标题中的“最新JAVA通用后台管理系统”是一个基于Java技术栈开发的综合管理平台,它整合了多种流行的技术框架,包括EXT-JS、Hibernate、Spring MVC和Spring。这些技术都是Java Web开发中的重要组成部分,下面将详细...

    最新Java后台管理系统(ext-js4,Hibernate 4,Spring mvc3)

    该资源是一个基于Java技术栈开发的后台管理系统,其核心组件包括EXT-JS4、Hibernate 4和Spring MVC3。这是一套成熟的Web应用程序框架,用于构建高效、可维护的企业级应用。下面将详细介绍这些关键技术和它们在系统中...

    ext后台管理

    "EXT后台管理"是一个基于ExtJS前端框架,结合PHP后端语言和MySQL数据库构建的小型应用程序系统。..."EXT后台管理"系统展示了如何将这些技术融合在一起,为用户提供一个功能完备、操作便捷的后台管理平台。

    最新JAVA通用后台管理系统(ext-js,Hibernate,Spring mvc,spring)可用

    标题中的“最新JAVA通用后台管理系统”是一个基于Java技术构建的企业级应用系统,它结合了多种技术框架,包括Ext-js、Hibernate、Spring MVC和Spring。这些技术在Java开发中都有着广泛的应用,下面将对这些关键技术...

    最新Java后台管理系统(ext-js4、 Hibernate 4、 Spring mvc3)

    该资源是一个基于Java技术栈开发的后台管理系统,主要采用了Ext-JS4作为前端框架,Hibernate 4作为持久层框架,Spring MVC3作为控制器框架。这个系统设计和实现的知识点涵盖了许多Java开发的重要方面,下面将详细...

    Ext grid中渲染进度条,超帅 源码-----下载不扣分,回帖加1分,欢迎下载,童叟无欺。

    Ext grid中渲染进度条,超帅 源码-----下载不扣分,回帖加1分,欢迎下载,童叟无欺。Ext grid中渲染进度条,超帅 源码-----下载不扣分,回帖加1分,欢迎下载,童叟无欺。Ext grid中渲染进度条,超帅 源码-----下载不扣分...

    Ext+java学生管理系统源代码带数据库

    【标题】"Ext+java学生管理系统源代码带数据库"揭示了这个项目是使用Ext JS作为前端框架,结合Java作为后端开发的一种学生信息管理系统。它不仅提供了完整的源代码,还包括了与之配套的数据库,这对于学习和理解如何...

    Ext后台模板

    Ext后台模板是一款基于Ext JS框架开发的管理界面模板,它以简洁、清晰的布局和设计为特点,旨在提供高效、易用的后台操作系统。Ext JS是一个强大的JavaScript库,专用于构建富客户端应用,尤其适用于创建数据密集型...

    Ext后台图书管理系统(源码)

    标题中的"Ext后台图书管理系统(源码)"揭示了这是一个采用Ext框架构建的后端图书管理系统,并且提供了源代码。这表明该系统可能是为了教学或实际项目应用而设计的,允许开发者深入研究和修改其内部机制。 描述部分...

    ext-ms-win-gdi-desktop-l1-1-0.dll

    ext-ms-win-gdi-desktop-l1-1-0.dll 用于解决这个dll文件丢失问题,下载后将此文件放置在相关文件根目录下,即可解决丢失问题

    EXTjavaScript 适合于做后台管理的界面的使用代码

    EXTJavaScript 的核心是EXTJS,它是一个用纯JavaScript编写的客户端富因特网应用程序(RIA)框架。 在后台管理界面的开发中,EXTJavaScript 提供了一系列的控件和组件,如表格(Grid)、树形视图(Tree)、表单...

    extJS ext 自学 富客户端

    extJS ext 自学 富客户端,掏钱自学extjs。

    ext.net后台管理

    EXT.NET后台管理是一种基于Web的高效、功能丰富的前端开发框架,专为构建强大的后台管理系统而设计。EXT.NET结合了EXT JS的用户界面组件和.NET框架的强大力量,特别是C#编程语言,提供了丰富的交互式控件和组件,...

    chinese-bert-wwm-ext.rar

    《哈工大版Chinese-BERT-wwm-ext for PyTorch深度解析》 在自然语言处理(NLP)领域,预训练模型已经成为基石,而BERT(Bidirectional Encoder Representations from Transformers)模型更是其中的明星。本文将深入...

    纯Ext搭建的后台管理模板

    纯Ext搭建的模板,网页右键不能查看源码。内含联系方式,可以联系我。

    ext 深入浅出 富客户端

    ext 深入浅出 富客户端ext 深入浅出 富客户端

    Ext入门-详细教程

    Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-详细教程Ext入门-...

Global site tag (gtag.js) - Google Analytics