extjs 动态树。
写完接近崩溃边缘... 不废话直接贴代码
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<link rel="stylesheet" type="text/css" href="pagesExt/extjs2.0/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="pagesExt/css/style.css" />
<script type="text/javascript" src="pagesExt/extjs2.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="pagesExt/extjs2.0/ext-all.js"></script>
<script type="text/javascript" src="pagesExt/extjs2.0/source/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="pagesExt/extjs2.0/ext/themeChange.js"></script>
<link rel="stylesheet" href="Contents/Style.css" type="text/css" />
<script language="JavaScript" src="JSClass/FusionCharts.js"></script>
<script type="text/javascript">
<!--
Ext.BLANK_IMAGE_URL = 'pagesExt/extjs2.0/resources/images/default/s.gif';
var root=new Ext.tree.AsyncTreeNode({
id:"-100",//根节点id
expanded :true,
text:"后台管理"
});
var treeLoa = new Ext.tree.TreeLoader({
dataUrl:'sys/sd?hellow=',
});
Ext.onReady(function() {
new Ext.Viewport( {
enableTabScroll : true,
layout : "border",
items : [ {
title : "面板",
region : "north",
height : 100,
html : "<center><h1>网站后台管理系统!</h1></center>",
collapsible:true,
bbar :[
{
id:'BA',text:"注册",iconCls:'addup',
handler: function(){
window.location.href="pagesExt/Adduser.jsp";
}
},
'->',
{
id:'CB',text:"登录",iconCls:'login',
handler: function(){
window.location.href="pagesExt/Login.jsp";
}
}
]
}, {
region: 'west',
collapsible: true,
title: 'Navigation',
xtype: 'treepanel',
width: 200,
loader : treeLoa,
autoScroll: true,
root:root,
split: true,
rootVisible: false,
tbar : [
'皮肤选择:',
{
xtype : 'themeChange',
width : 80,
listWidth : 80
},
'->'
],
bbar : [
{
width : 80,
listWidth : 80
}
],
listeners : {
click : function(node,e){
mainPanel.load({
url:node.attributes.url,
callback : function(){
mainPanel.setTitle(node.text);
},
scripts: true
});
}
}
}, {
xtype : "tabpanel",
region : "center",
id : 'mainContent'
} ]
});
var mainPanel = Ext.getCmp('mainContent');
})
//-->
</script>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<base href="<%=basePath%>">
<title>My JSP 'MyIndex.jsp' starting page</title>
</head>
<body>
</body>
</html>
分享到:
相关推荐
在本文中,我们将探讨如何实现ExtJS动态树以及其中的节点拖拽功能。动态树是一种能够实时更新和修改的树形结构,允许用户添加、删除和移动节点。这种功能在各种应用场景中非常有用,如文件系统、组织结构或层级数据...
标题中的“EXTJS动态树支持checkbox全选”指的是EXTJS中树组件的一个特性,即在树形结构中添加复选框(checkbox)功能,并支持全选和全取消选中操作。这样的功能对于需要用户进行多项选择的场景非常有用,比如文件...
1. **ExtJS动态树(TreePanel)**: ExtJS TreePanel组件是用于显示和操作树形数据的控件。它支持多种特性,如拖放、分页、异步加载等。创建一个动态树,我们需要定义树节点的数据模型(TreeNode),配置数据源...
在本篇文章中,我们将深入探讨ExtJS中的动态树以及中文API的使用。 动态树的核心在于其数据绑定机制。在ExtJS中,树形控件通常与数据源(如Store)绑定,当数据源发生变化时,树会自动更新。你可以通过Ajax请求获取...
**ExtJS动态树与数据库交互详解** 在Web开发中,数据可视化是不可或缺的一部分,而树形结构作为一种层次清晰、组织有序的数据展现方式,被广泛应用于菜单系统、文件目录、组织架构等场景。ExtJS,一个强大的...
在EXTJS中实现动态树,主要是通过EXTJS的TreePanel组件来完成,下面将详细介绍EXTJS动态树的实现过程及其相关知识点。 1. TreePanel组件: TreePanel是EXTJS中用来展示树形结构数据的组件。它包含节点(Node)、根...
以下是一个简单的EXTJS动态树实现的步骤: 1. **定义数据模型(Model)**:首先,我们需要定义一个数据模型来描述树节点的结构。例如: ```javascript Ext.define('NodeModel', { extend: 'Ext.data.Model', ...
ExtJS 是一个强大的JavaScript框架,...通过分析和学习这段代码,你可以更好地理解和应用ExtJS动态树的实现方式。记住,实际项目中可能还需要结合服务器端的接口设计和数据格式,确保数据能正确地加载到树形结构中。
EXTJS动态树是一种基于JavaScript的UI组件,用于在网页中构建可交互的树形结构数据展示。EXTJS是一个强大的前端框架,提供了丰富的组件库,包括表格、表单、树、图表等多种元素,使得开发者能够创建出功能丰富且用户...
总结起来,"jsp+access+extjs动态树实例"是一个综合性的Web开发案例,它结合了服务器端的JSP处理、数据库操作以及客户端的动态展示技术,展示了如何利用现有工具和技术实现一个功能丰富的交互式动态树视图。...
总之,通过深入理解和灵活运用上述概念和方法,我们可以创建出交互性强、响应迅速的ExtJS动态树应用,同时结合Accordion布局提供更丰富的用户界面。在实际开发中,应根据项目需求和性能考虑,合理配置和优化动态树的...
动态树加载菜单是 ExtJS 中一种常见且实用的功能,它允许用户在需要时按需加载树节点,从而提高应用性能,减少初次加载时的数据量。 动态树加载,也称为懒加载或按需加载,是指在用户滚动、展开节点或执行其他操作...
extjs、struts2、mysql做的一个动态树,仅是一个动态树的小demo,不涉及角色、权限,并且数据是手动加入到数据库中的;资源中包涵数据库sql,只需创建一个名称为tree的数据库,执行sql就可以了,另外修改一下练级...
一个关于extjs的动态树demo 好久没裸写(不用框架)过了,都不记得关闭数据连接的语句写在哪里了。 这个demo至少要你懂得一些extjs语法,否则,你会看着很费劲。 里面提供了需要的表结构和mysql驱动 如果你不会mysql...
1. **EXTJS动态树**: EXTJS的动态树(TreePanel)组件允许开发者创建可交互的树形结构,这些结构可以动态地加载数据。树节点可以包含子节点,可以展开或折叠,支持拖放操作,非常适合用来展示层次化的信息,如目录...
extjs的动态树的生成,还好就是extjs的一些属性的应用
实用智慧密集:如何使用EXTJS实现无级树,省份树等代码实现,需要的可以参考看看试试,应该可以的,听快速的
标题“Extjs 动态加载树”涉及到的是一个前端开发技术话题,主要集中在使用Extjs框架构建能够动态加载数据的树形结构。Extjs是一个基于JavaScript的组件化UI库,常用于开发富客户端应用。动态加载树(Dynamic ...
`EXTJS动态树的实现举例+示例代码.rar`和`Y梨Ext动态树的完整示例代码.rar`等文件提供了实际的实现代码,帮助开发者理解如何配置和使用异步加载。 3. **API文档**: `Ext+中文文档-API.rar`和`Ext_Database.rar`...
在给定的标题和描述中,主要涉及了ExtJS中的动态树(tree)功能以及与AJAX的结合使用。下面将详细介绍这些知识点。 **动态树(Dynamic Tree)** 动态树是ExtJS中的一种控件,用于展示层次结构的数据。它可以实时地...