<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Ext Dependency Builder</title>
<link rel="stylesheet" type="text/css" href="inc/resources/css/ext-all.css" />
<script type="text/javascript" language ="javascript " src ="*.Script?m-core"></script>
<script type="text/javascript" language ="javascript ">
$import("org.ext.ext-core")
Ext.onReady(function(){
$import("org.ext.tabs.tabs")
var tabs = new Ext.TabPanel('tab-ct', true);
var tab1 = tabs.addTab('tab-item1', 'Home Tab');
//tabs.activate(0);
var tab2 = tabs.addTab('tab-item2', 'Tab2');
createTree("tab-item2")
tab1.on("activate",function(){
$import("org.ext.dialog.dialogs")
Ext.Msg.alert("message",this.id + "was activated!")
})
tabs.activate(1);
})
function createTree(ct){
$import("org.ext.tree.tree")
var Tree = Ext.tree;
var tree = new Tree.TreePanel(ct, {
animate:true,
loader: new Tree.TreeLoader(),
enableDD:true,
containerScroll: true,
singleExpand:true
});
var troot = new Tree.TreeNode({id:"a1",text:"datacenter",checked:true})
tree.setRootNode(troot)
for(var i = 1;i < 10; i ++){
var tnode = new Tree.TreeNode({id:"a" + i,text:"a" + i,checked:true})
troot.appendChild(tnode)
for(var j = 2; j< 10; j ++){
var tsub = new Tree.TreeNode({id:"b" + j,text:"b" + j,checked:true})
tnode.appendChild(tsub)
}
}
tree.render();
troot.expand()
}
</script>
</head>
<body>
分享到:
相关推荐
2. **组件动态载入**:使用`Ext.container.Container`的`load`方法或者`Ext.ComponentLoader`,可以在运行时加载新的组件或页面。例如,当用户点击某个链接时,动态加载一个新的面板: ```javascript var panel = ...
在EXTJS这个强大的JavaScript框架中,`Ext.Panel`和`TreePanel`是两个非常重要的组件,它们被广泛用于构建复杂的用户界面。这篇文章将探讨如何在这些组件中动态加载本地页面数据,以提升用户体验并实现灵活的数据...
"ext tree json 例子(不含EXT包)"这个标题暗示我们将讨论如何在不直接引用EXT完整包的情况下,仅使用EXT JS中关于TreePanel和JSON解析的部分来构建一个动态的树形结构。这可能涉及到手动引入EXT的核心组件,如...
### 用ExtJS实现动态载入树的知识点详解 #### 一、背景介绍与需求分析 在企业级应用开发中,树形结构是一种常见的数据展示形式,尤其在组织架构、文件系统等方面应用广泛。本文将详细介绍如何利用ExtJS框架来实现...
然后,我们需要创建一个JavaScript文件(org.js),在这个文件中编写ExtJS的代码来构建动态加载树。`Ext.onReady`函数会在DOM加载完成后执行,这是初始化ExtJS组件的最佳时机。我们创建一个新的`TreePanel`实例,...
15.5.2 IE下的优秀JavaScript调试工具Companion.JS 15.5.3 DebugBar和Companion.JS的基本操作 15.6 调试技巧 15.6.1 在Firebug中直接调试脚本 15.6.2 调试代码运行速度 15.6.3 查看对象属性 第16章 ExtJS案例...
关键类 这里主要涉及Ext JS的两个类: Ext.tree.TreeNode Ext.menu.Menu 相关API可以参考:http://extjs.com/deploy/ext/docs/ 三. 代码示例 1. 先看一下测试页面 代码如下:<html> <head> <meta ...
在实际开发中,开发人员通常会根据项目需求选择加载ext-base.js或ext-all.js,并结合CSS文件调整界面样式。使用调试版本进行开发和测试,待调试完成后,再转换为压缩和优化过的版本用于生产环境。示例和API文档则...
8. **Ext.LoadMask**: 载入遮罩,用于在执行耗时操作时显示等待提示。 **三、ExtJS 2.0教程内容** 1. **基础篇**: 介绍ExtJS的基本架构和使用环境,讲解如何创建第一个ExtJS应用。 2. **组件篇**: 详述各组件的...
Spring+Hibernate+Ext+dwr做的一个简单的grid的增删改查,面板布局, 通过autoload方式载入grid ,以及XML树的建立 ,连接MySql数据库 。JS文件代码在Demo文件夹下,JAVA代码在src下。适合新手
15.5.2 IE下的优秀JavaScript调试工具Companion.JS 15.5.3 DebugBar和Companion.JS的基本操作 15.6 调试技巧 15.6.1 在Firebug中直接调试脚本 15.6.2 调试代码运行速度 15.6.3 查看对象属性 第16章 ExtJS案例...
这个概念与JavaScript库Ext JS紧密相关,因为Ext JS提供了一个名为PagingStore的组件,专门用于处理和展示分页数据。 首先,我们来看"PagingStore.js",这很可能是Ext JS框架中的一个实现分页存储功能的脚本文件。...
例如:载入第一页的时候 代码: 代码如下: store.load({params:{start:0,limit:pageSize,Keyword:Ext.getCmp(‘input_name’).getValue()}}); 当单击下一页(上一页)时带参数 代码如下: doLoad : function(start){ ...
// 载入可拼车列表 ``` 在这个例子中,`MyDocnumStore_Load`函数接收一个Store作为参数,遍历其所有记录,如果记录满足条件(在这里是`PlanCarNo`不为空并且`Docnum`不等于 `_rec.get('Docnum')`),则将该记录的...
放大镜效果(magnifier)、阴影效果(shadow) 第一部分:鼠标交互 1.1 Draggables:拖拽所需文件: ui.mouse.js ui.draggable.js ui.draggable.ext.js 用法:文件载入后,可以拖拽class = "block"的层 $(document).ready...
ui.draggable.ext.js 用法:文件载入后,可以拖拽class = "block"的层 $(document).ready(function(){ $(".block").draggable(); }); draggable(options)可以跟很多选项 选项说明:...
ui.draggable.ext.js 用法:文件载入后,可以拖拽class = "block"的层 $(document).ready(function(){ $(".block").draggable(); }); draggable(options)可以跟很多选项 选项说明:...
基本的鼠标互动:拖拽(drag and dropping)、排序(sorting)、选择(selecting...第一部分:鼠标交互1.1 Draggables:拖拽所需文件:ui.mouse.jsui.draggable.jsui.draggable.ext.js 用法:文件载入后,可以拖拽class = “b
Safari 2 3575ms 475ms 753% Opera 9.1 3196ms 326ms 980% Average improvement: 867% <br>下表为jQuery1.1.3与常用的一些JS库选择器的对比: Browser Prototype jQuery Mootools Ext Dojo ...