《ExtJs视频教程》全套已全面出炉，欢迎大家关注！目录如下：
第1讲 ExtJs介绍及应用举例
第2讲 组件解析
第3讲 ExtJS事件处理
第4讲 ExtJS事件处理续一
第5讲 ExtJS事件处理续二
第6讲 ExtJs组件应用之动态树
第7讲 ExtJs组件应用之动态树续一
第8讲 ExtJs组件应用之动态树续二
第9讲 ExtJs组件应用之动态树续三
第10讲 ExtJs组件应用之动态树续四
第11讲 ExtJs组件应用之动态树续五
第12讲 ExtJs组件应用之动态树续六
第13讲 布局
第14讲 布局续
第15讲 布局续二
第16讲 表单
第17讲 表单续一
第18讲 表单续二
...
第三部分：解析器与数据的关系
一、XmlReader的构造方法定义如下：
XmlReader( Object meta, Object recordType )
二、JsonReader的构造方法定义如下：
JsonReader( Object meta, Object recordType )
三、ArrayReader的构造方法定义如下：
ArrayReader( Object meta, Object recordType )
都表示实例化这些解析器时，需要传递2个参数，一个是meta,一个是recordType。
但是不同的解析器他们需要的 ...
第二部分:Store的核心阐释
Store即数据存储器，主要用于提供给GridPanel，EditorGridPanel等关联数据用的。
Store由Proxy（数据源）和DataReader（数据解析器）组成。
换句话说：
第一、数据存储器需要有数据才能叫数据存储器，而这个数据就是通过数据源获得；
第二、获得数据后还需要通过数据解析器将这些数据进行解析，从而成为客户端认可的符合一定格式的数据。
通过以上两个条件，这个数据存储器才能真正的为GridPanel等服务。
现在来看一下Store是如何运作的：
看API，我们只需要关心他的4个配置选项：data、proxy、reader、url ...
第一部分：阐述grid与store的关系、gird中的ColumnModel与store中的fields的关系。
grid，即列表，他的核心功能就是用来展现数据列表，包括列表各列的头信息和实际数据。
grid的各列头信息是由ColumnModel来定义的。
grid的实际数据列表是通过Store来展现的。
grid的实例化如下：
var grid = new Ext.grid.GridPanel({
cm:cm,
store:store
...
});
相关图片示例如下：
ColumnModel中有两个非常重要的配置选项：header和dataInde ...
一般情况下，项目采用了UTF-8的字符集格式，那么所有的js文件的格式也都为UTF-8格式后就不会有任何乱码的问题出现。但是如果项目采用了GBK等编码，那么js文件的编码格式就不能这么随便了，需要根据你的项目的编码情况而定。
就拿项目编码为GBK为例吧。
首先，jsp页面文件为GBK格式，那么他的头部也就有如下的设置：
<%@ page contentType="text/html;charset=GBK"%>
head标签中有：
<meta http-equiv="content-type" content="text/html; charset= ...
序号结合分页显示：一、效果图：
二、相关js脚本：1、全局变量：var record_start = 0;2、grid的columns部分 columns : [new Ext.grid.RowNumberer({ header : "序号", width : 40, renderer:function(value,metadata,record,rowIndex){ return record_start + 1 + rowIndex; }&n ...
如果你对EXT有兴趣但不知道如何下手，如果你有了API但不知道如何看如何用，如果你够认真的话，那么就看下面的内容，我保证你看了就会用API了，但是你必须看完，另，如果你没有API的话，我提供一个2.0的API给你，在附件里下载。
================================开始===================================
有人这样提问：
我怎么判断当前节点是否选中呀
function onItemClick(checked){
var myItems =[];
var checkedNodes =tree.getChecked();
...
应网友反馈，现提供动态树的完整示例代码工程，以方便大家学习和交流。请看附件处 下载
Ext.Msg.alert( String title, String msg, [Function fn], [Object scope] )方法应用起来后能看到蒙版的效果。也就是除了alert框内的东东能点击外，其他部分均不可操作。
图1-alert效果图
其实蒙版效果也可完全作用于任何一个组件。通过调用Element的mask()方法即可。
那么他们间是如何联系的呢？
先来看看Ext的组件的超类Ext.Component,这个类中有getEl()方法，返回的是Element元素对象实例。
因此，如果是想蒙版一个组件实例，即可这样应用。如：
var fp = new Ext.form ...
EXTJS动态树的实现举例
一、描述：通过dwr实现JS与后台的交互，从而实现动态树中叶子节点和目录节点的增加和编辑、以及节点的拖曳，节点的增删和拖曳都会改变自身以及它所在的目录节点下的相关节点的序号，能使得后台与前台同步。这个序号借助了tree中node的index。
1、相关基础：
servlet、mysql、dwr、json
2、涉及的ExtJs中部分知识点：
menu、tree、window以及事件机制
3、实现的效果图：
a)ExtJs动态树-右键叶子节点菜单
b)ExtJs动态树-选择右键叶子节点菜单的“编辑”选项
c)ExtJs动态树-右键目录节点菜单
d)ExtJs动态树 ...
我在一个论坛看到EXT传递参数的问题，觉得很多学EXT的人都会碰到：
++++++++++++++++++++++++++++++++++++++++
通过示例代码中的msg-box.js
我们可以看到
Ext.get('mb1').on('click', function(e){
Ext.MessageBox.confirm('Confirm', 'Are you sure you want to do that?', showResult);
});
这样的代码，还有它的回调函数showResult：
function showResult(btn){
...
理解了layout之后，再看看FormPanel源码，发现它指定了layout:'form',而FormPanel又是Container的子孙类，所以，它就是用了FormLayout布局。只是通过FormPanel，将FormLayout所需要的配置都做了些初始化提取出来了，便于开发者使用和理解。所以，在FormPanel渲染后就会用FormLayout来进行doLayout功能。
所以写成下面两种方式的代码，效果是一样的：
一、用FormPanel
Ext.onReady(function(){
var panel = new Ext.FormPanel({
renderTo: ...
1、配置选项layout什么时候可用？
只有Ext.Container的子类或子孙类才具有layout的功能，
如果在这些子孙类中不指定layout的配置选项，那么layout就有个默认值是'auto',即为Ext.layout中的超类：Ext.layout.ContainerLayout。
每个layout类，看layout包下的类，都是直接或间接的继承了Ext.layout.ContainerLayout，并且每个layout类都会注册到Ext.Container.LAYOUTS中去，如：Ext.Container.LAYOUTS['form'] = Ext.layout.FormLayo ...
ext中有关继承的实现的关键代码如下：（Ext.js中）
extend:
extend : function(){
// inline overrides
var io = function(o){
for(var m in o){
this[m] = o[m];
}
};
var oc = Object.prototype.constructor;
...
//先定义匿名方法，第一个括号对里的，必须要有这个括号对，之后第二个括号对用来执行这个匿名方法，如果这个匿名方法返回的是function，那么可以加第三个括号对。
(function(){
alert("aa")
return function(){
alert("bb");
}
})();// 输出结果：aa
//带参数的匿名方法使用
(function(a,b){
alert(a);
alert(b);
return function(c){
alert(c);
}
})("匿名方法的第一个参数值","匿名方法的第二个参数值")(" ...
if(!Person.extend){//若extend属性还未存在则执行里面的代码
Person.applay(Person,{
extend:function(){
alert("定义时执行");
return function(){
alert("hello");
}
}()// 注意这里加了一对()，表示在new一个Person对象的时候就会立即执行extend后面定义的方法，并且返回里面return的方法给extend属性，
//那么这样，extend就是一个方法类型的属性了
});
}
//因为之前!Pe ...
/**
* 第二部分：能在定义时就能执行的方法的写法 function(){...}();
*/
/**
* 一、普通的方法的定义与执行
*/
// 1-1、普通的方法定义，不带返回值的情况
fun = function() {
alert("执行");
};
// 1-2、普通的方法执行，不带返回值的情况
// fun();// 输出结果：执行
// 2-1、普通的方法定义，带返回值，且返回值是个字符串的情况
fun = function() {
alert("执行");
return "返回的是字符串";
}
// 2-2、普通的方法 ...
/**
* 分析Ext.js
*/
/**
* 第一部分：对象属性的添加和设置
*/
Person = {
sex : 'woman'// 初始属性设置
};
Person.applay = function(source, copy, defaults) {
if (defaults) {
Person.applay(source, defaults)
}
if (source && copy && typeof copy == 'object') {
for (var p in copy) {
// alert(p); ...
地址:
http://bbs.langsin.com/viewthread.php?tid=5498
免费预览地址:
http://imgshr.jpg.name/ttthrrwtvhytthhyjjwzzsjzjshszjyyjrry.swf
Ext.extend方法是用来实现类的继承。
extend(Object subclass,Object superclass,[Object overrides] : Object
第一个参数：子类
第二个参数：父类
第三个参数：要覆盖的属性。
这里需要强调一下，子类继承下来的是父类中通过superclass.prototype方式定义的属性（包括用此方法定义的函数）。
例子如下：
<script type="text/javascript">
function S(){
}
S.prototype.s = "s";
S.prototype.s1 = ...
用了ExtJs后，IE打开页面是空白的问题解决:
好不容易搞了个EXTJS的DEMO(自己写的)，然后里面就写了个HTML页面，结果浏览器访问时，发现FIREFOX显示正常，而IE却显示空白页面。
这个时候是需要检查一下html的DTD有没有写，如果没有写，加上就可以了。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999 ...
当使用了ExtJs后，脚本documentElement.clientWidth得到的值是0，需要换成Ext.getBody().getWidth()来获得。
关于解决IE的min-width方法就可以这样写：
//===========Style===============//
#hxcy{ text-align:right;margin:0 auto; min-width:778px;width: expression((Ext.getBody().getWidth() < 778) ? "778px" : "auto" );}
/*---注意：这里将documentElemen ...
yahaitt
- 浏览: 29765 次
- 性别:
- 来自: 杭州
- 详细资料
搜索本博客
我的相册
共 14 张
最近加入圈子
最新评论
-
ExtJs视频教程集锦
怎么ftp上还没有, 急死了!
-- by slmdyk -
EXTJS动态树的实现
不明白你说的意思
-- by yahaitt -
EXTJS动态树的实现
你好! 请问添加节点时, 提示需要验证: http://localhost:80 ...
-- by davy138 -
ExtJs想入门的请进-解读 ...
非常感谢！正在学extjs，正不知道该如何下手。对java script不熟悉， ...
-- by xt95 -
关于动态树的完整示例代码 ...
...
-- by yahaitt
评论排行榜