Extjs学习汇总
一、入门--百度知道
Extjs介绍、发展史
地址：http://baike.baidu.com/view/1350145.html?wtp=tt
二、资料
官网地址：http://www.sencha.com/ （最好注册一个用户、每次看都用谷歌翻译整个页面）
中文网站：http://extjs.org.cn/ （不咋的，可以看作是官网介绍，翻译了部分官网文章。）
官方源文件：Ext-3.1.0.rar
其他教程：《Ext 3.0中文API.CHM》,《Ext Core 手册.PDF》,《EXT中文手册》,《ExtJS实用开发指南》、《掏钱学ExtJs完全版》、《ExtJS深入浅出》、《ExtJS_3.0_Cookbook》、《EXTJS源码分析》
三、问题汇总：
1.官方问题汇总（EXT FAQ）：（http://www.sencha.com/learn/Ext_FAQ_Grid）推荐
官方收集的常见问题和解决方案。
2.Ext grid 如何将两列的值显示到同一列中？（http://www.iteye.com/problems/1268）
//将字段first_name与last_name合二为一，取得full_name。
//例子如下：
var reader = new Ext.data.ArrayReader({},[
{name:'full_name',type:'string',mapping:'first_name+ " " + obj.last_name'},
{name: 'age'}
]);
var grid = new Ext.grid.GridPanel({
store: new Ext.data.Store({
render: reader,
data: Ext.grid.dummyData
}),
columns:[
{header: 'Full Name',dataIndex: 'full_name'},
{header: 'Age',dataIndex:'age'}
]
})
3.ExtJS Grid Tooltip实现方法总结（http://hi.baidu.com/gislovers/blog/item/4ef349974cf7ed47d0135ee7.html）
4.Combobox属性详解（http://77321660.iteye.com/blog/407678）推荐
5.ExtJS Grid 改变单元格颜色的方法（http://kbing001.iteye.com/blog/465510）推荐
6.Extjs Themes Download（http://extjs.fudini.net/）
7.ExtJS技巧笔记（http://yourgame.iteye.com/blog/464691）推荐
8.ExtJS中radioGroup和checkboxGroup的取值和赋值（http://hi.baidu.com/zhangxuan1224/blog/item/f7597706cb1d8a7702088183.html）
9.深入剖析ExtJS 2.2实现及应用连载：Ext.extend函数的扩展（http://www.iteye.com/topic/312866）
10.ExtJS编程基础--类（http://hi.baidu.com/pigshome/blog/item/249559346b7ae24d251f149b.html）
11.ExtJS Grid Drag Drap Grid拖动 （http://www.cnblogs.com/zhjp11/archive/2009/12/08/1619262.html）
12.TextField 隐藏的时候fieldlaber怎么隐藏（http://www.iteye.com/problems/15296）
隐藏fieldLabel的两种方法：hideLable:true和不给fieldLabel属性并设labelSeparator:""
13.关于ext form上传文件的问题 （http://ext.group.iteye.com/group/topic/5950）
14.如何把store里的所有数据转换成JSON传给后台（http://blog.csdn.net/yueue/article/details/4555089）
var lstAddRecord=new Array();
store.each(function(record) {
lstAddRecord.push(record.data);
});
Ext.Ajax.request({
url: 'function/rivaldata/rivalDataAction.do?tag=add',
params: {strJson:Ext.encode(lstAddRecord)}
});
15.【Extjs学习一】Extjs2继承函数简单分析及疑问（http://www.iteye.com/topic/195409）推荐
16.Ext3 chart 图标（http://www.iteye.com/topic/478806）
17.Ext 3.X新增内容系列文章之三：DWR的替代品Ext.Direct（http://blog.csdn.net/zhangxin09/article/details/4740131）
18.Ext formpanel submit 提交与ext.ajax.request提交的区别（http://wjt276.iteye.com/blog/806466）
19.ext grid 没有数据时不显示横向滚动条的解决办法（http://waitingmyself.blog.163.com/blog/static/15721332009155261221/）
this.grid.getView().mainBody.dom.style.width = this.grid.getView().getTotalWidth();
this.grid.getView().mainBody.dom.style.height = '1px';
(this.grid为创建的grid)
20.ext grid在panel中高度的问题（http://zhidao.baidu.com/question/99743477）
21.ext panel iframe的问题 （http://topic.csdn.net/u/20090919/01/a7297f8b-5989-4155-8d3e-986d4d81ec14.html）推荐
22.Ext 弹出窗体最大化（http://blog.csdn.net/lfp0202/article/details/4738684）
22.Ext.extend 在EXT框架中实现类继承的机制（http://hi.baidu.com/520huan_byaxiom/blog/item/d803fb1360adf524dc5401d7.html）
23.Ext.grid现ext.grid显示隐藏行（http://www.cnzzad.com/tut/57908.html）推荐
通过行号在GridView通过调用 addRowClass(rowNumber,className),removeRowClass(rowNumber,className) 来设置目标行的css类，在这个css类里你可以设定display:none来达到你要的效果。
24.Ext：设置 Ext panel的背景色和边界（http://hi.baidu.com/ccutshyhao/blog/item/8ac4c3422d8af31b72f05d7f.html）
25.ext-grid常见问题 FAQ: Grid（http://www.iteye.com/topic/197071）推荐
26.ExtJs2.0学习系列(7)--Ext.FormPanel之第四式(其他组件示例篇)（http://www.pin5i.com/showtopic-19617.html）推荐
27.ExtJS Grid 滚动到指定Record+选择多行（http://atian25.iteye.com/blog/425760）推荐（此人博客写的不错）
28.ExtJS Grid 选择文字以便复制 （http://atian25.iteye.com/blog/428946）推荐
29.ExtJS Panel中放入iframe的三种方法(http://bamanzi.iteye.com/blog/459003)
//way 1 //it works
var frame1 = document.createElement("IFRAME");
frame1.id = "frame1";
frame1.frameBorder = 0;
frame1.src = "reports/empty-report.html";
frame1.height = "100%";
frame1.width = "100%";
var panel2 = new Ext.Panel( {
id : "panel2",
items: [ frame1 ]
//contentEl: "frame1" //this won't work
});
//way 2 //it works, too
var panel2 = new Ext.Panel( {
id: "panel2",
fitToFrame: true,
html: '<iframe id="frame1" src="../examples/layout/table.html" frameborder="0" width="100%" height="100%"></iframe>'
});
//way 3 //it works
// first, we need to add a line in HTML
//<iframe id="frame1_rename" frameborder="0" height="100%" width="100%" src="reports/empty-report.html"/>
var panel2 = new Ext.Panel( {
id: "panel2",
contentEl: "frame1"
});
// 后面将frame导航到其它URL
document.getElementById("frame1").src = "/extjs3/examples/layout/vbox.html";
30.ExtJS的xtype列表(http://www.blogjava.net/rain1102/archive/2009/11/20/303005.html)
- xtype Class
- 基本组件：
- box Ext.BoxComponent 具有边框属性的组件
- button Ext.Button 按钮
- colorpalette Ext.ColorPalette 调色板
- component Ext.Component 组件
- container Ext.Container 容器
- cycle Ext.CycleButton
- dataview Ext.DataView 数据显示视图
- datepicker Ext.DatePicker 日期选择面板
- editor Ext.Editor 编辑器
- editorgrid Ext.grid.EditorGridPanel 可编辑的表格
- grid Ext.grid.GridPanel 表格
- paging Ext.PagingToolbar 工具栏中的间隔
- panel Ext.Panel 面板
- progress Ext.ProgressBar 进度条
- splitbutton Ext.SplitButton 可分裂的按钮
- tabpanel Ext.TabPanel 选项面板
- treepanel Ext.tree.TreePanel 树
- viewport Ext.ViewPort 视图
- window Ext.Window 窗口
- 工具栏组件：
- toolbar Ext.Toolbar 工具栏
- tbbutton Ext.Toolbar.Button 按钮
- tbfill Ext.Toolbar.Fill 文件
- tbitem Ext.Toolbar.Item 工具条项目
- tbseparator Ext.Toolbar.Separator 工具栏分隔符
- tbspacer Ext.Toolbar.Spacer 工具栏空白
- tbsplit Ext.Toolbar.SplitButton 工具栏分隔按钮
- tbtext Ext.Toolbar.TextItem 工具栏文本项
- 表单及字段组件：
- form Ext.FormPanel Form 面板
- checkbox Ext.form.Checkbox checkbox 录入框
- combo Ext.form.ComboBox combo 选择项
- datefield Ext.form.DateField 日期选择项
- field Ext.form.Field 表单字段
- fieldset Ext.form.FieldSet 表单字段组
- hidden Ext.form.Hidden 表单隐藏域
- htmleditor Ext.form.HtmlEditor html 编辑器
- numberfield Ext.form.NumberField 数字编辑器
- radio Ext.form.Radio 单选按钮
- textarea Ext.form.TextArea 区域文本框
- textfield Ext.form.TextField 表单文本框
- timefield Ext.form.TimeField 时间录入项
- trigger Ext.form.TriggerField 触发录入项
31.Extjs中ComboBox选中默认值(http://easycode.iteye.com/blog/503090)
32.浏览器宽高（http://topic.csdn.net/u/20080716/14/a78201a1-95ad-429e-94a6-27d057596c09.html）
alert("网页可见区域宽： document.body.clientWidth："+document.body.clientWidth);
alert("网页可见区域高： document.body.clientHeight："+document.body.clientHeight);
alert("网页可见区域宽： document.body.offsetWidth (包括边线的宽)："+document.body.offsetWidth);
alert("网页可见区域高： document.body.offsetHeight (包括边线的高)："+document.body.offsetHeight);
alert("网页正文全文宽： document.body.scrollWidth："+document.body.scrollWidth);
alert("网页正文全文高： document.body.scrollHeight："+document.body.scrollHeight);
alert("网页被卷去的高： document.body.scrollTop："+document.body.scrollTop);
alert("网页被卷去的左： document.body.scrollLeft："+document.body.scrollLeft);
alert("网页正文部分上： window.screenTop："+window.screenTop);
alert("网页正文部分左： window.screenLeft："+window.screenLeft);
alert("屏幕分辨率的高： window.screen.height："+window.screen.height);
alert("屏幕分辨率的宽： window.screen.width："+window.screen.width);
alert("屏幕可用工作区高度： window.screen.availHeight："+window.screen.availHeight);
alert("屏幕可用工作区宽度： window.screen.availWidth："+window.screen.availWidth);
33.Ext异步加载与同步加载（http://1000.iteye.com/blog/446681）
34.主题：ext性能探讨（http://www.vifir.com/bbs/html/20080529/589880.html）推荐
35.ext中查询后传给callback函数的数据到底是什么类型（http://www.iteye.com/problems/13187）推荐
36.tabPanel 如何动态改变ico（http://www.iteye.com/problems/15719）
37.ExtJS模板使用：推荐
http://damoqiongqiu.iteye.com/blog/412435
http://www.iteye.com/topic/376555
http://www.cnblogs.com/zqmingok/articles/1698336.html
38.extjs 怎么保存树数据(附代码)（http://www.iteye.com/problems/38906）
四、插件
1.DatePickerPlus日期插件（ http://www.lubber.de/extjs/datepickerplus/?&extv=3.2.1&lang=EN）
2.编辑树Grid（http://max-bazhenov.com/dev/ux.maximgb.tg/index.php ）