搜档网
当前位置:搜档网 › ExtJs练习

ExtJs练习

ExtJs练习
ExtJs练习

1.ExtTabPanel用法:

2.属性 items 的用法:xtype

3.布局控件

ExtJS的布局基类为https://www.sodocs.net/doc/9a14523695.html,yout.ContainerLayout 其他布局都是集成该类的。

ExtJs的容器组件包含一个layout及layoutConfig配置属性。

如果没有指定容器组件的layout,则默认会使用ContainerLayout作为布局,该布局只是简单的把元素放到容器中,有的布局需要layoutConfig配置,有的则不需要layoutConfig 配置。

(1)列的布局

(2)Border布局

由https://www.sodocs.net/doc/9a14523695.html,yout.BorderLayout定义,布局名为: border 该布局把容器分为:东南西北中五个区域。分别由

east,south,west,north,center来表示。

在往容器中添加子元素的时候,我们只需指定这些子元素所在的位置,Border布局会自动把子元素放到布局指定的位置。

(3)Table布局

由类https://www.sodocs.net/doc/9a14523695.html,yout.TableLayout定义。名称:table 该布局负责把容器中的子元素按照类似普通html标签,看代码:

4.表格控件

表格由类Ext.grid.GridPanel定义,继承自Panel,其xtype为grid.

在Extjs中,表格Grid必须包含列定义信息,并指定表格的数据存储器Store。

表格的列信息由类Ext.grid.ColumnModel定义,而表格的数据存储器由Ext.data.Store 定义。

数据存储器解析的数据不同分为: Jsonstore 、 SimpleStore 、GroupingStore等,

如下代码:

5.树形控件

树控件由Ext.tree.TreePanel类定义,控件的名称为: treepanel 继承自Panel面板。

如下代码:

6.表单控件Form

表单在web应用中处于非常重要的地位,时刻都在使用表单收集用户信息与交互,并将收集到的有用信息提交到后台服务器。表单是客户端与服务器之间通信的主要桥梁。

如下代码:

. . . . . .

7.弹出窗口

(1)Ext.MessageBox.alert();

如下代码:

(2). Ext.MessageBox.confirm()

如下代码:

(3). Ext.MessageBox.prompt() // prompt:迅捷的,迅速的,按时的;提示如下代码:

可以输入多行的输入框:

如下代码:

再比如:

弹出一个window

进度条ProgressBar:

表单练习:

1. 文本框

Ext.onReady(function(){

var form1=new Ext.form.FormPanel({

width:350,

height:400,

frame:true,

renderTo:'win',

title:'formpanel',

bodyStyle:'padding:5px 5px 0', items:[

{

fieldLabel:'Username',

xtype:'textfield',

name:'user',

id:'user',

width:'200'

},

{

fieldLabel:'PWD',

xtype:'textfield',

name:'pass',

id:'pass',

width:'200'

}

]

});

});

2 下拉框 combox组件

关于xtype的类型,在extjs的form表单

Form components

---------------------------------------

form Ext.FormPanel

checkbox Ext.form.Checkbox

combo https://www.sodocs.net/doc/9a14523695.html,boBox

datefield Ext.form.DateField

field Ext.form.Field

fieldset Ext.form.FieldSet

hidden Ext.form.Hidden

htmleditor Ext.form.HtmlEditor

label https://www.sodocs.net/doc/9a14523695.html,bel

numberfield Ext.form.NumberField

radio Ext.form.Radio

textarea Ext.form.TextArea

textfield Ext.form.TextField

timefield Ext.form.TimeField

trigger Ext.form.TriggerField

Extjs4.0.7 desktop基础搭建

Extjs4.0.7 desktop初级搭建 涉及内容:1.classes.js的拆分 2.App.js和Settings.js里代码的含义 3.桌面图标的换行 4.一些小小的修改 首先上官网上下载最新版本的Extjs,本次讲解以4.0.7版本为例,下载地址https://www.sodocs.net/doc/9a14523695.html,/products/extjs/download/ext-js-4.0.7/1234 然后打开myeclipse新建一个web project工程,这个工程的结构如下 其中core文件夹用于存放desktop的核心代码 css文件夹用于存放样式表 ext文件夹用于存放ext-all.js等

images文件夹用于存放desktop实例中images modules文件夹用于存放桌面上显示的模块 resources文件夹用于存放desktop实例自带的壁纸文件夹wallpapers 和Extjs中resources下的themes文件夹 接下来把App.js,Settings.js和index.jsp(即desktop.html)放在webroot 目录下面 一.classes.js的拆分:首先来看一下index.jsp中的代码 extjs4 desktop

在Eclipse中搭建ExtJS环境

下载:ExtJS 4.1.1 在Eclipse中安装spket插件 下载:spket-1.6.23.zip 最低要求:你需要java 1.5或更高版本运行安装程序,可独立使用 步骤: 1.作为eclipse的插件使用,按Plugin进入下载页面把他下载下来。 2.下载完成解压文件得到一个eclipse文件夹,将文件夹下的plugins和features两个文件夹拷贝到使用的Eclipse安装包下覆盖原有同名文件夹, 3.启动Eclipse,在工具栏window中打开preferences,弹出对话框左边会看到Spket, 4.打开Spket下的JavaScript Profile,点击New,添加Ext(名称可自定义) 5.点击Ext,选择右边的Add Library,选择ExtJS 6.选中ExtJS,选择右边的Add File,选中已下载的并解压的ExtJS包的根目录下的build 下的sdk.jsb3 7.这时会出现很多的选择框,我是全选了,点击ok就安装好了, 8.选中Ext,点击右面的Default,ok,然后重启eclipse,如果还不行,选中建立的js文件右击,有Open With,选择Spket JavaScript Editor,这样就应该可以了 让spket作为javascript的默认编辑器 步骤: Eclipse工具栏window --> preferences --> Editors --> File Associations --> 右面的File types选中*.js --> 下面的Associated editors选中Spket javascript Editor --> 按右面的按钮Default --> OK退出 建立js文件,的图标变成js文件对应的图片就成功了。 Hello word 项目建立 1.eclipse中新建Dynamic Web Project项目,命名为ExtjsTest 2.为避免eclipse的校验可进行如下操作 i 选中工程右键 --> Properties --> Resource --> Text file encoding -->

利用UbuntuExtMail30分钟配置好一个功能强大的邮件

利用Ubuntu ExtMail 30分钟配置好一个功能强 大的 利用Ubuntu ExtMail 30分钟配置好一个功能强大的服务器V1.1,以下文档通过19个大的步骤进行配置,配置成功! 由于网上Ubuntu ExtMail的步骤特别多,看了都头痛,在此特别给朋友们制作了一个简洁的安装文档,希望大家喜欢:) 环境: Ubuntu 8.04 TLS postfix 2.5.1 ExtMail 1.2 extman 1.1 1.安装依赖包 apt-get install mysql-client-5.0 mysql-server apache2 postfix postfix-mysql postfix-doc courier-authdaemon courier-authlib-mysql courier-pop courier-pop-ssl courier-imap courier-imap-ssl libsasl2-modules libsasl2-modules-sql sasl2-bin libpam-mysql openssl libapache2-mod-fastcgi libfcgi-perl build-essential libtool libnet-server-perl libnet-cidr-perl libberkeleydb-perl arc zoo lzop liblzo1 libstdc++5 libgd-gd2-perl libfile-tail-perl libdigest-sha1-perl libdigest-HMAC-perl libnet-ip-perl libnet-dns-perl libhtml-tagset-perl libhtml-parser-perl libio-stringy-perl libio-multiplex-perl libio-socket-ssl-perl libio-zlib-perl libnet-ssleay-perl libunix-syslog-perl libtimedate-perl libmailtools-perl libconvert-binhex-perl libconvert-tnef-perl libconvert-uulib-perl libcompress-zlib-perl libarchive-zip-perl libarchive-tar-perl perl-suid 你会被询问以下问题: Create directories for web-based administration? <– No General type of mail configuration: <– Internet Site System mail name: <– https://www.sodocs.net/doc/9a14523695.html, 2.下载extmail-1.2和extman-1.1,并修改配置 下载地址:https://www.sodocs.net/doc/9a14523695.html,/download tar xvzf extmail-1.2.tar.gz

ext入门学习

Ext入门学习 一:Ext是什么 ExtJS是一个javascript框架,用于在客户端创建丰富多彩的web应用程序界面。ExtJS 可以用来开发RIA也即富客户端的AJAX应用。 ExtJs最开始基于YUI技术,由开发人员Jack Slocum开发,通过参考Java Swing等机制来组织可视化组件。 二:Ext能干什么 主要是用来制作富客户端的Web应用。包括但不限于: (1)可以动态创建web组件,动态维护web的Dom对象 (2)灵活地获取界面组件对象,方便对对象的操作和控制 (3)大量的组件对象帮助构建复杂的web应用 (4)友好的Ajax支持 (5)完善的事件处理机制 三:Ext有什么 四:Ext的HelloWorld 1:环境准备 (1)到官网上下载最新的版本,目前是ext-3.3-beta (2)下载后解压后,看看里面的包结构: adapter:负责将里面提供的第三方底层库(包括Ext自带的底层库)映射为Ext所支持的底层库。 build:压缩后的ext全部源码(里面分类存放)。 docs: API帮助文档。 exmaples:提供使用ExtJs技术做出的小实例。 resources:Ext UI资源文件目录,如CSS、图片文件都存放在这里面。 package:按包分类的源码 source:无压缩Ext全部的源码(里面分类存放) 遵从Lesser GNU (LGPL)开源的协议。Ext-all.js:压缩后的Ext全部源码。 ext-all-debug.js:无压缩的Ext全部的源码(用于调试)。

ext-core.js:压缩后的Ext的核心组件,包括sources/core下的所有类。 ext-core-debug.js:无压缩Ext的核心组件,包括sources/core下的所有类。 (3)开发的时候只需要把resources包中的css和images放到common下面,还有把ext-all.js和adapter/ext/ext-base.js放入到js中就可以了 2:HelloWorld.html 五:Ext的面向对象简介 //相当于Java的package https://www.sodocs.net/doc/9a14523695.html,space("https://www.sodocs.net/doc/9a14523695.html,"); //完全使用Ext的创建对象语法太繁琐,还是用我们熟悉的js的语法来写 https://www.sodocs.net/doc/9a14523695.html,.Class1=function(){ this.aa = "cc"; this.t1=function(){ this.aa="t1"; }; }; https://www.sodocs.net/doc/9a14523695.html,.Class2=function(){ this.t1=function(){ this.aa="cc2 tt2"; }; }; //表示Class2继承Class1,这里面没有采用Ext的extends https://www.sodocs.net/doc/9a14523695.html,.Class2.prototype=new https://www.sodocs.net/doc/9a14523695.html,.Class1();

Extjs4开发笔记(收集整理)

Extjs4开发笔记(一)——准备工作 2011-06-28 来源:mhzg 作者:mhzg (共2 条评论) 使用extjs4 mvc+asp来实现员工管理系统,系统会使用大量的extjs4组件及插件,期待着这个系统完成。 本文内容已经重新更新,旧版请查看 https://www.sodocs.net/doc/9a14523695.html,/a/20116/20116281100279-old.html。 重写原因:由于开始准备的时候,就是按照传统开发去做的,写了一部分之后,有网友和同事提出:“为什么不用MVC模式”呢?这样的问题让我对目前传统开发的心发生了一些细微变法,对啊,为什么不用MVC模式呢?我征求了一下同事及热心网友的意见,都同意使用MVC模式开发。从而,我删掉了原来所有目录,重新按照MVC模式去组织目录结构,很快的,目录结构准备好了。 那。。我们重新来过,使用EXTJS4.0的MVC模式,开发这套员工管理系统。给个简称吧。SMS(你懂得。呵呵!)。 一、建立环境: Data:数据库文件夹,里面放着管理系统用的数据库文件。数据库目前只有三张表。分别是: Menu:菜单项 user:员工注册信息 userinfo:员工个人资料信息 Images:图片目录,一些自定义的图片文件 Include:服务端文件目录,里面包含ASP所用到的Conn.asp、Function.asp等文件App:整个SMS所用到的自定义JS文件,里面有一个controller文件夹,一个view 文件夹。controller文件夹放置主代码,view文件夹放置各组件。这几个文件夹中的内容会在第二章进行介绍。 Extjs4:此目录放置Extjs4的库文件。

node.js入门手册:那些最流行的web开发框架 (1)

Node.js 入门手册:那些最流行的Web 开发框架 ?actionHero—actionHero is a minimalist transactional API framework for sockets and http clients ?archetype—A web framework leveraging Node.js ?aries—Annotation based MVC framework ?blueprint—Blueprint for a Startup. Middleware, & MVC routing over Node.js & Mongoose ?broke—A porting of the most famous Django Web Framework ?Capsela—A high-level, promises-based web framework with an emph asis on testability (see website) ?Cargobox—Express port with better OOP ?chain—An evented convention for building Node Applications (Stopped Development, for ejsgi) ?Coffeemate—Push coffee-script into web development! ?COKE—A lightweight MVC framework base on Express that speeds up your web development. (Rails like) ?CompoundJS (formerly RailwayJS) —An MVC web framework, similar t o Ruby on Rails, Express/Connect-compatible. Also see here. ?Crux—An MVC web application framework and project management uti lity, similar in some ways to Rails. ?Derby—MVC framework making it easy to write realtime, collaborative applications that run in both Node.js and browsers ?djangode—A framework that borrows some useful concepts from Djang o (March 2010, node.JS 0.1.30) ?drty—A Django port to NodeJS. Many Django features, still under hea vy development. (January, 2011, 0.2.6) ?Drumkit --- DrumKit is a plugin-powered, full-stack Web development fr amework for Node.js. ?Express—A robust feature rich web development framework inspired by Sinatra ?Express Train—An lightweight MVC web framework built on top of exp ress, offering consistent project structure. ?Ext Core for NodeJS—Templating and some basic tricks of ExtCore an d ExtJS(XTemplate,Ext.util.format) ?Flatiron—an adaptable framework for building modern web applications. URL Routing with Director, templating with Plates, data management wit h Resourceful, middleware with Union (connect-compatible), plugins with B roadway, logging with Winston. ?Geddy—A hackable Web-app development framework similar to Merb /Rails/Pylons/Django ?GenJi—A simple micro-framework for nodejs.

EXTjs组件

组件 每个ExtJS应用程序都是由一或多个称为组件(components)的部件(widgets)组成的.所有的组件都是https://www.sodocs.net/doc/9a14523695.html,ponent的子类,https://www.sodocs.net/doc/9a14523695.html,ponent包含自动化生命周期管理的功能,如创建、渲染、尺寸控制、定位和销毁等,因此所有组件都自动拥有这些功能。ExtJS提供了非常多可直接使用的组件,并且从这些组件继承并扩展自己的自定义组件也是很容易的一件事情。 组件层次结构 容器(Container)是一种可以包含其他组件的特殊组件。一个典型的应用程序是由许多按树状机构嵌套在一起的组件组成的,称之为组件层次结构。容器负责管理子组件的生命周期,包括子组件的创建、渲染、尺寸控制、定位和销毁。一个典型的应用程序组件层次结构一般使用Viewport作为顶级容器,它的子元素可以包含其他嵌套的容器或者非容器组件:

容器的items属性配置用来添加子组件。以下这个例子使用Ext.create创建了两个Panel,然后将这两个Panel作为子组件添加到一个Viewport中: 容器使用布局管理器(LayoutManagers)来管理容器中子组件的尺寸和定位。

XType(组件类型)和延迟实例化 每个组件都有一个用来表示类型的名字,称为xtype。例如,组件Ext.panel.Panel的xtype为'panel'。上面那个例子展示了如何添加已经创建好的组件到容器中。如果在容器的子元素(items)配置中,为子元素指定xtype,子元素不会马上实例化,而是由容器决定子元素何时该实例化。例如:一个使用到TabPanel(选项卡)的应用程序,选项卡的每一tab页只有在用户单击的时候才会去渲染。 下面的示例代码中每个tab页都会监听各自的渲染完成(rendered,在渲染结束后触发)事件,在渲染后弹出提示。运行这个示例马上会弹出一个提示,那是因为运行后默认tab页被渲染并立即呈现在容器中了。第二tab页的提示不会弹出,只有你单击了第二页,它才会实例化并呈现。这说明了tab页会按需进行实例化和渲染。

ext3、ext4 orphan inode机制分析

ext3、ext4的orphan inode机制分析 一、概述 orphan在英文中是孤儿的意思,在这里取被遗弃、被删除之意。 orphan inode是什么样的inode呢?这种inode是怎样产生的呢? 先介绍一个概念,文件的引用计数,准确地说应该是inode的引用计数,因为一般来说一个文件会对应 一个inode。文件的引用计数,简单地说是表示有多少个文件指向该文件,准确地说是文件的硬链接的个数。 情况1:设想一个进程,open一个文件,然后unlink该文件,然后进行文件读写。这是允许的,并且在进程退出时,内核会自动将引用计数为0的文件删除。 但是如果该进程尚未退出之前,系统崩溃了,那么,内核就没有机会将已被unlink、并且引用计数为0 的inode从磁盘上删除了。 情况2:设想我们正在截断一个大文件(系统调用truncate),但是操作尚未完成,系统就崩溃了。同样,内核也没有办法将该文件的所有数据块全部删除了。 ext3、ext4的orphan inode机制就是处理上述两种情况的。基本思想是这样的:如果要删除或截断一个inode,要先把这个inode记录到磁盘上的一个特殊的orphan inode链表上。如果删除或截断操作能够 正常完成,那么,就从磁盘上的orphan inode链表上删除该inode;否则,如果删除或截断操作未完成之前,系统就发生崩溃了,那么,系统重启后,文件系统会遍历磁盘上的orphan inode链表,对链表上的每一个inode都重新进行一遍删除或截断操作,以此来保证这些inode真正在磁盘上被删除,维护文 件系统的一致性。 内核版本:2.6.35 二、相关数据结构及之间的关系 先总体说一下orphan inode的组织。 orphan inode需要在两个地方组织,分别是在内存中和在磁盘上。不论在哪里,从抽象角度来看,orphan inode都被组织成一个单向链表。 1、ext4_inode struct ext4_inode { __le32 i_dtime; /* Deletion Time */ ......... } 这个是磁盘上的inode的结构,i_dtime本来表示该inode被删除的时间,在orphan inode机制中,因 为此时该域的值并不重要,故借用一下,用于记录下一个被unlink/truncate的inode号。

Extjs4 API文档阅读

Extjs4 API文档阅读(一)——类系统(Class System) 2011-07-02 来源:互联网作者:佚名(共0 条评论) ExtJS4使用新的类机制进行了大量的重构。为了支撑新的架构,ext4几乎重写了每一个类,因此最好先好好的理解一下新的架构,再开始编码。 ExtJS4使用新的类机制进行了大量的重构。为了支撑新的架构,ext4几乎重写了每一个类,因此最好先好好的理解一下新的架构,再开始编码。 本文适合想在extjs4中扩展现有类或者创建新类的开发者。其实,不管是想扩展还是使用,都建议您仔细阅读一下(如果E文好的,建议您还是阅读英文原文。链接地址是:https://www.sodocs.net/doc/9a14523695.html,/ext-js/4-0/#/guide/class_system)。文章共分4个部分,建议每一部分都仔细研究下,对之后的开发工作,会有意想不到的好处。 第一部分:概述。说明了强大的类机制的必要性 第二部分:编码规范。讨论类、方法、属性、变量和文件命名 第三部分:DIY。详细的编码示例 第四部分:错误处理和调试。提供一些有用的调试和异常处理技巧 一、概述 ExtJS4拥有超过300个的类.迄今为止,我们的社区拥有超过20万来自世界各地,使用不同后台语言的开发者.要在这种规模的框架上提供具有以下特点的架构,需要面临巨大的挑战: 1、简单易学。 2,快速开发、调试简单、部署容易。 3,良好的结构、可扩展性和可维护性。 二、编码和规范 *在所有类、命名空间(namespace)和文件名中使用一致的命名约定,有助于保持代码的良好结构和可读性。 1) Classes 类名只能包含字母和数字。允许包含数字,但是大部分情况下不建议使用,除非这些数字是专业术语的一部分。不要使用下划线,连字符等非数字字母符号。例如: https://www.sodocs.net/doc/9a14523695.html,eful_util.Debug_Toolbar is discouraged 2.MyCompany.util.Base64 is acceptable 3. 类名应该包含在使用点号分隔的命名空间中。至少,要有一个顶级命名空间。例如: 1.MyCompany.data.CoolProxyMyCompany.Application

非常好的gwt-ext培训教程

Gwt-Ext 的概述 GWT-Ext 是基于Google Web Toolkit(GWT)和ExtJs 的功能强大的网页开发控件库。它非常适用于进行纯Java 语言的富Internet 应用的快速开发。本系列文章将详细讲解GWT-Ext 的基本结构和功能特点,并通过代码示例来演示该技术的具体实现。本文是该系列的第一部分,将带领您快速入门GWT-Ext,并演示如何快速搭建GWT-Ext 的开发环境。 概述 GWT-Ext 是基于Google Web Toolkit(GWT)和ExtJs 的功能强大的网页开发控件库。它扩展了GWT,在ExtJs 的基础上实现了有排序功能的表格(Grid)、分页、过滤,支持有拖拽功能的树,高度可定制的组合下拉框(Combobox)、目录、对话框、表单(Form)以及功能丰富、强大且易用的API。GWT-Ext 拥有GNU Lesser General Public Licence (LGPL)(请参阅参考资料),V3.0 的许可证。因此它是一个非常灵活,允许在开源和商业中应用的控件库。 GWT 的介绍(请参阅参考资料)已经非常丰富,我们这个系列主要关注在GWT-Ext 的介绍和应用上。GWT-Ext 是在GWT 和ExtJs 的基础上对表现层的进一步封装。我们可以理解GWT 提供了Ajax 的一套基础框架,而ExtJs 提供了以JavaScript 和CSS 样式表为基础的非常丰富的表现层接口。那么GWT-Ext 就是在GWT 的基础上,将ExtJs 的JavaScript 接口映射或者封装为Java 的接口。在Java 的环境下开发和调试开发表现层,可以大大提高开发的速度。 回页首 GWT-Ext 开发环境搭建 在这个系列中,将通过示例的方式,一步步地介绍如何搭建一个GWT-Ext 的开发环境。本章将通过图解与代码结合的方式搭建演示平台框架,并且演示如何部署这个平台到Tomcat 容器中。 下载开发环境 我们将使用Eclipse 和插件Cypal Studio 来搭建控件演示平台。Cypal Stutio 是一个GWT 成熟的开发工具。它能非常方便地帮助我们搭建GWT 的开发以及调试环境,并且能够实现编译和打包的工作,省去了开发GWT 过程中很多繁琐的过程。 需要下载的产品和技术请参阅参考资源中的“获得产品和技术”部分。 安装Cypal Studio 插件 解压Eclipse 到本地硬盘,同时解压cypal.studio.for.gwt-1.0.zip 到Eclipse 的plugins 目录下。然后解压下载的gwt-windows-1.5.0.zip 。最后,启动Eclipse 。 选择Eclipse 目录Window >Preferences > Cypal Stutio,填写GWT 相关的信息如图1所示。GWT Home 填写GWT 的解压根目录。如果Java VM 的要求较高,可以从512M 提高到1024M 。如图1 所示。

Hibernate+Spring+Struts2+ExtJS开发CRUD功能

Hibernate+Spring+Struts2+ExtJS开发CRUD功能 https://www.sodocs.net/doc/9a14523695.html,/myloon/archive/2007/11/08/1873652.aspx 入门: 各种开源框架环境及下载: Hibernate:3.x https://www.sodocs.net/doc/9a14523695.html,/需要hibernate core 和annotations 包。 Spring:2.x https://www.sodocs.net/doc/9a14523695.html,/ Struts2:2.x https://www.sodocs.net/doc/9a14523695.html,/2.x/ ExtJS:2.X https://www.sodocs.net/doc/9a14523695.html,/ JSON:JSON可以到https://www.sodocs.net/doc/9a14523695.html,/查看详细内容,这里使用json-lib https://www.sodocs.net/doc/9a14523695.html,/ 本所需要的包: 2、配置: (1)首先是配置web.xml,配置方法可以在下面的配置文件代码注释中查看,这里主要是Struts2的配置: struts2 org.apache.struts2.dispatcher.FilterDispatcher struts2 /*

和Spring的配置: contextConfigLocation /WEB-INF/spring/*.xml org.springframework.web.context.ContextLoaderList ener Web.xml的全部文件: struts2 contextConfigLocation /WEB-INF/spring/*.xml encodingFilter org.springframework.web.filter.CharacterEncodingFilter encoding UTF-8 struts2 org.apache.struts2.dispatcher.FilterDispatcher struts2

ExtJS之Ext.Ajax.request用法详解

ExtJS之Ext.Ajax.request用法详解 Java代码 1Ext.Ajax.request({ 2 url:'findbyid.action', 3 params:{ 4 id:cell.getId() 5 }, 6 success: function(resp,opts) { 7 var respText = Ext.util.JSON.decode(resp.responseText); 8 name=https://www.sodocs.net/doc/9a14523695.html,; 9 oid=respText.id; 10 findbyid(graph,cell,oid,name); 11 //Ext.Msg.alert('错误', https://www.sodocs.net/doc/9a14523695.html,+"====="+respText.id); 12 }, 13 failure: function(resp,opts) { 14 var respText = Ext.util.JSON.decode(resp.responseText); 15 Ext.Msg.alert('错误', respText.error); 16 } 17 18 }); 在Ext开发过程中,基本上时刻需要用到异步请求,那么这个请求到 底是怎么执行的呢,我们接下来来探讨下 首先:Ext.Ajax类继承了Ext.data.Connection,为Ajax的请求提供了 最大灵活性的操作方式 再简单请求基础上我们加上一个使用的 说明的是这种请求通常都是放在触发某个事件的处理方法中的 url:就是我们要请求的路径 params:里面的参数用逗号隔开,就是我们要发出请求带的参数

EXTJS(入门篇10)UsingViewsinyourApplications

Using Views in your Applications 本系列文章为翻译文章,翻译自API文档,也是入门级别的文章,请初学者仔细阅读,如果翻译有不妥的地方,请谅解,如果转载请注明作者及出处。 从用户的角度看,我们的应用程序只不过是视图的集合。尽管大多有价值的部分都在控制器和模型中,但是视图却是和用户直接交互的。在本指导文档中,将就如何构建我们应用程序的视图展开叙述。 Using Existing Components 最简单的方式就是使用Ext.create函数来创建一个已经定义好的组件。例如我们可以创建一个特别简单的panel,仅仅包括一些html内容: 该代码十分简单,只是创建一个全屏的组件,里面包含了一些文字内容。我们可以使用该方法创建任意的内在组件,但是比较实用的方法是,我们创建该组件的子类,以便实现我们自定义: 虽然看起来,结果是相同的,但是我们有了一个我们自己的类,这就是我们需要遵循的模式

—创建已有组件的子类,在我们需要的时候再对它进行实例化。让我们看看这都有些什么变化: 1.Ext.define函数允许我们创建一个新的类,继承我们已经存在的类。 2.我们遵循MyApp.view.MyView的命名规则,尽管我们可以任意命名,但是最好还是 遵循我们的规则,方便以后管理以及程序的简单明了。 3.我们可以再config中定义新的配置项。 我们在定义我们的全新子类的时候,可以使用超类的配置项进行配置,或者在创建的时候,把该类的配置项作为参数传递进去,以便创建: A Real World Example 下面我们来看一个比较规范的视图类文件,是Twitter中的文件:

extjs入门案例大全

Ext.onReady(function(){ var cm = new Ext.grid.ColumnModel([ {header:'编号',dataIndex:'id'}, {header:'名称',dataIndex:'name'}, {header:'描述',dataIndex:'descn'} ])。 var data = [ ['1','name1','descn1'], ['2','name2','descn2'], ['3','name3','descn3'], ['4','name4','descn4'], ['5','name5','descn5'] ]。 var ds = new Ext.data.Store({ proxy:new Ext.data.MemoryProxy(data), reader:new Ext.data.ArrayReader({},[ {name:'id'}, {name:'name'}, {name:'descn'} ]) })。 ds.load()。 var grid = new Ext.grid.GridPanel({ ds:ds, cm:cm, width:300, height:400, renderTo:'grids', tbar:[ { xtype:'datefield' } ] })。 grid.render()。 })。 Ext.onReady(function(){ new Ext.Panel({renderTo:"hello",title:"第一个

",width:300,height:300,html:'

Hello World

'})。 })。 TabControl Ext.onReady(function(){ new Ext.TabPanel({renderTo:"hello",width:300,height:200,items:[new Ext.Panel({title:"面板1",height:30}),new Ext.Panel({title:"面板2",height:30}),new Ext.Panel({title:"面板3",height:30})]})。 })。 总结: Ext.onReady(function(){ new Ext.Panel({ renderTo:"hello", title:"面板", html:'面板内容', height:100, width:200 })。 })。 创建按钮事件: new Ext.Button({ renderTo:"hello", text:"添加", pressed:true, height:30, handler:Ext.emptyFn })。 new Ext.Viewport({ layout:"border", items:[{region:"north",

通用后台管理系统(ExtJS 5.1 + Hibernate 4.1.7 + Spring MVC 3.2.8)

系统可作为OA、网站、电子政务、ERP、CRM、APP后台等基于B/S架构的应用软件系统的快速开发框架。 一、特色 1、采用Spring MVC的静态加载缓存功能,在首页将Javascript文件、CSS文件和图片等静态资源文件加载进来放进内存,极大提高ExtJS的加载速度。 2、三种皮肤主题:经典、灰色和海王星,支持多浏览器和多分辨率。 3、分别封装了模型层、控制层、业务逻辑层和数据持久层的通用操作模块,层次分明,大大减少代码冗余,二次开发效率高。 4、系统是公司多个项目的基础框架,稳定性好,支持大并发。 二、主要功能 1、采用ExtJS 5.1无限制版本,放心用于网站开发。 2、ExtJS富文本编辑器增加修改信息。 3、ExtJS的HtmlEditor的图片文件上传插件。 4、Grid列表和表单,包含添加、删除、批量删除、修改、查看、图片查看和按条件查询列表等功能。 5、导入导出Excel数据,支持xlsx和xls文件。 6、资源管理(菜单管理)。

7、用户管理和部门管理。 8、权限管理。不仅可管理各个功能模块的权限,也可以管理功能模块里的页面按钮权限。 9、报表统计。也可以嵌入其他报表工具插件。 10、采用开源的互动地图Javascript库Leaflet,处理自定义在线地图。Panel里包含2个组件,在2个组件间传递参数显示数据。 所有源码都公开,包含MySQL、Oracle和SQL Server的SQL文件,QQ:1298588579(请先加QQ咨询技术细节) 源码点此获取 三、开发工具和采用技术 1、开发工具:Eclipse、MyEclipse和其他IDE。 2、采用Spring 3中最新最稳定的Spring MVC 3.2.8版本。 3、采用Hibernate 4.1.7。Spring MVC 3.2.8支持的最高Hibernate版本是4.1.7,更高的Hibernate版本和Spring MVC 3.2.8组合会遇到兼容问题。 4、Hibernate集成二级缓存框架Ehcache。 5、数据库是MySQL、Oracle和SQL Server,Hibernate的Dialect可使程序移植到其他数据库。 6、采用开源的互动地图Javascript库Leaflet,处理自定义在线地图。 7、采用Google Guava Collections,性能高于Apache Collections。 8、全局处理GET和POST中文编码。 四、代码结构 部分代码作用: 1、BaseParameter、ExtJSBaseController、BaseService、BaseDao:分别封装了模型层、控制层、业务逻辑层和数据持久层的通用操作模块。 2、ListView、PageView和QueryResult:作为ExtJS的后台分页模块。 3、SystemInitListener:加载以XML格式的数据字典,放进内存供调用。 4、LoginFilter:处理登录各种情况,将session为null的操作重定向到登录页面。 5、CustomDateEditor:处理日期参数并注册到控制器里,否则Spring MVC的参数处理将出错。 6、ExceptionCode、ServiceException:处理异常信息。 7、CacheFactory:处理Ehcache二级缓存。 8、还有其他很多工具类等等。

JAVA.Extjs.Hibernate.Web开发应用免费教程集锦

JAVA/JSP/C++: C++程序设计原理与实践(中文高清电子书) https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-645.aspx Visual.C++开发实战宝典(源码+视频) https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-767.aspx Visual C++从初学到精通(源码+视频+PPT) https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-766.aspx 你必须知道的495个C语言问题(高清pdf电子书) https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-731.aspx FreeMarker应用指导(中文PDF电子书) https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-708.aspx Java范例开发大全(视频教程+实例源码) https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-687.aspx JAVA核心基础视频教程展示 https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-625.aspx JAVA从入门到精通.山寨QQ项目 https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-321.aspx 中国人民银行企业培训视频教程(JAVA方向) https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-499.aspx 7K月薪面试题之交通灯管理系统 https://www.sodocs.net/doc/9a14523695.html,/bbs/showtopic-382.aspx

相关主题