`
coolerbaosi
  • 浏览: 730812 次
文章分类
社区版块
存档分类
最新评论

ExtJs开发总结

 
阅读更多

1、引入js和css文件时注意文件的路径问题;

2、导入ext-base.js后注意设置Ext.BLANK_IMAGE_URL的值(透明图片s.gif位置);

3、IE提示“缺少标识符,字符串或数字”错误,为配置时 “}”前多了逗号,且所处位置在Ext.onReady在同一个js文件

4、IE提示变量未定义,一般为有语法错误,如多余了”,”等

5、“无效字符”错误,可能是将”,”打成了”,”了

6、”缺少’}'”错误,问题是多个参数之间缺少了”,”导致

7、加载文件较多时,使用ExtJs可做一个加载提示

8、ext-base.js引入必须在ext-all.js之前

9、Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
初始化Ext状态管理器,在Cookie中记录用户的操作状态,如果不启用,象刷新时就不会保存当前的状态,而是重新加载
如果窗口中有用可拖动面板的话,你在拖动后如果启动了Ext.state.Manager.setProvider(new Ext.state.CookieProvider()),就算刷新后面板仍然会在你拖动后的位置。如果不启用的话是不是就会按照默认的排列方式排列

10、对浏览器禁用javascript的提示
<noscript class=”noticeDialog”><div>
<p>请开启浏览器的 JavaScript 支持!否则不能正常使用本系统<br>启用之后,刷新页面即可</p>
</div></noscript>

11、TabPanel中放置复杂组件时,注意需要设置TabPanel的Width

12、extjs中文字体在firefox里显示偏小的问题,解决方法是再创建一个名为ext-patch.css的css文件,内容见http://www.phpchina.com/html/78/78-28624.html

13、中文化问题,在 ext-all.js 后面,挂上 ext-lang-zh_CN.js 即可,如:
<script type=”text/javascript” src=”<%=contextPath%>/public/js/ext-base.js”></script>
<script type=”text/javascript” src=”<%=contextPath%>/public/js/ext-all.js”></script>
<script type=”text/javascript” src=”<%=contextPath%>/public/js/ext-lang-zh_CN.js”></script>

14、ComboBox加载后自动选择第一项
var pn_zlfx_cbb_grade = new Ext.form.ComboBox({
displayField: ‘name’,
valueField: ‘id’,
triggerAction: ‘all’,
width: 80,
lazyInit: false,
mode: ‘local’,
editable: false,
forceSelection: true,
store: new Ext.data.JsonStore({
url: SITE_URL+’get_zlfx.asp?grade_id=0′,
fields: ['id', 'name'],
root: ‘data’,
autoLoad: true,
listeners:{
load: function(store, records, options){
if (records.length != 0){
pn_zlfx_cbb_grade.setValue(records[0].data.id);
}
}
}
})

15、JsonStore排序:sortInfo: {field: “name”, direction: “ASC|DESC”}

16、Extjs类的配置属性是不能被动态配置的,就如同上面这样的写法,当然,可能可以通过调用或设置某些公共的方法和属性来改变这些配置属性,但不能直接设置.

17、xhtml strict模式:<!DOCTYPE html
PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd“>

18、Html文档<script>标签中的js代码放在<![CDATA[和]]>之间,使xhtml验证时忽略中间的内容

19、JsonStore添加Record
var orgaListRecord = new Ext.data.Record.create([
{name: 'id_combo1'},
{name : 'name'}
]);
var orgaList = new Ext.data.JsonStore({
url: ‘./get_organisme.php’,
root: ‘orga’,
fields: orgaListRecord
});
orgaList.add([
new orgaListRecord({'id_combo1': 3,'name': 'Other'})
]);
orgaList.load({add: true}); // instead of orgaList.load();

20、数据加载前须判断是否有数据:
if (typeof(pn_zlfx_gp_mark_subjects)==”undefined” || typeof(pn_zlfx_gp_mark_subjects.data)==”undefined”)
pn_zlfx_gp_setting.store.removeAll();
else
pn_zlfx_gp_setting.store.loadData(pn_zlfx_gp_mark_subjects);

21、尽量将处理过程放在关键位置,减少重复代码

22、默认排序方式:sortDir

23、服务器返回的JSON数据字段用’或”括起来,避免与js关键词与保留字冲突

24、Ext.encode()出错,问题是json数据有问题

25、store增加totalProperty配置,可用store.getCount()获取

26、store中文排序异常问题,通过重载Ext.data.Store.prototype.applySort函数来解决

27、store.load()是异步操作,如果希望在数据载入后再执行操作,可以通过以下方式执行:
store.load({
callback: function (records) {
alert(store.getTotalCount());
}
});

28、 EXTJS items不能显示问题收藏
有时经常碰到添加items时不能显示,郁闷不得行~~
经不断测试可能有如下几个方法可以解决:
1)试添加:Layout:’fit’
2)若xtype为’panel’,可试添加:
listeners: {
‘activate’: function(p) {p.doLayout();}
,single:true
}
3)若xtype为’tabpanel’,可试添加:
layoutOnTabChange:true
总的来说是cmp.doLayout()问题….

29、Ext.ajax.request增加form和isUpload:true时,请求方式为enctype=”multipart/form-data”传值,asp中需特别解析

30、ComboBox增加mode:’local’配置来手动控制数据载入,同时可防止数据的二次加载

31、要使ComboBox手动输入的值能得到提交,需要增加ComboBox的Blur事件处理函数
onComboBoxBlur: function(field){
field.setValue(field.getRawValue());
}

32、Firebug显示所有Extjs组件事件
Ext.util.Observable.prototype.fireEvent = Ext.util.Observable.prototype.fireEvent.createInterceptor(function() {
console.log(arguments);
return true;
});

33、工具栏Toolbar内容的增删
var tb = this.gp.getTopToolbar();
// 删除工具栏内容
var i = tb.items.getCount();
while(i){
Ext.fly(tb.items.get(i).getEl()).remove();
tb.items.removeAt(i);
}
// 重新添加工具栏内容
tb.add(‘包括(’, this.cbgType, ‘)’);

34、Ext.ux.form.LovCombo不能设置forceSelection为true,否则当控件失去焦点时显示值会清空

35、IE下Ext.GridPanel的autoWidth或者layout:’fit’会将宽度拉的很长的解决办法:

var grid = new Ext.grid.GridPanel({

bodyStyle:’width:100%’,

autoWidth:true,

…….

});
36、Ext.GridPanel加了CellSelection后,如设置viewConfig:{forceFit:true}点击单元格会导致表格跳动
解决方案:http://www.extjs.com/forum/showthread.php?p=282928#post282928

37、ComboBox执行Filter第一次无效的解决是 增加lastQuery:” 配置

38、Panel内部高度自适应+自动出现滚动条,增加以下配置
,autoScroll: true
,style:”height:100%;”
,bodyStyle:”height:100%;”

39、某些情况下TabPanel里加载iframe第一次不显示,可在panel显示后重新设置一下iframe的src强制加载一遍


分享到:
评论

相关推荐

    EXTJS开发总结.pdf

    EXTJS开发总结.pdf

    EXTJS开发总结[参考].pdf

    EXTJS开发总结[参考].pdf

    Extjs开发总结(转).pdf

    Extjs开发总结(转).pdf

    extjs 总结

    对于extjs开发的技术总结,ztree

    Extjs 各种总结和新实例

    本人对extjs 各种开发的亲身总结,包括多种列表、树、以及很多扩展功能

    extjs 总结,可以方便大家开发

    用extjs做了一个项目,我总结了一下我遇到一些组建 然后是怎么呈现出来的。算是自己的一些心得。当然当中也借鉴了一些网友的总结。谢谢这些前辈。

    Extjs开发精华

    这是我多年来开发extjs总结的开发例子、代码。

    Extjs超实用ppt

    EXTJS介绍,如何使用,tag标签介绍,Extjs开发实例总结。表单介绍,grid操作,弹出窗口,提示框等

    ExtJs高级技巧

    开发过程中总结ExtJs3.1一些技巧.

    快意编程 EXT JS Web开发技术详解.pdf

    《快意编程:Ext JS Web开发技术详解》是笔者在多年项目开发过程中的经验总结,它通过丰富的实例由浅入深、循序渐进地介绍了目前采用Ext JS进行Web开发的使用方法,从而帮助软件设计人员快速掌握Ext JS开发技术的使用...

    extjs帮助文件

    extjs官方代码,帮助文件,开发工具,docs,例子,总结,资料

    JQuery学习总结及实例中文WORD版

    因此出现了很多对Javascript 的封装库,比如Prototype、Dojo、ExtJS、JQuery等,这些库对Javascript进行了封装,简化了开发。这些库是对 Javascript的封装,也就是咱们调用JQuery 资源太大,传...

    前端开发分享

    做产品运维系统的前后端开发总结的一些技巧、模式等分享。包含前端基础、若干模式(闭包与库,匿名函数, PUB/SUB模式等介绍,含代码), Extjs4 的开发基础等。

    基于SSH2+Maven+EasyUI+MySQL技术实战开发易买网电子商务交易平台

    现在几乎只要软件开发项目,越来越多的公司采用富客户端技术,由于extjs过于宠大,及学习成本较高,更多的企业选择采用小巧而易用的jeasyui作为前端展示框架。 Maven是基于项目对象模型(POM),可以通过一小段描述...

    GWT-ext 布局示例

    GWT-Ext 是基于 Google Web Toolkit(GWT)和 ExtJs 的功能强大的网页开发控件库。它非常适用于进行纯 Java 语言的富 Internet 应用的快速开发。本系列文章将详细讲解 GWT-Ext 的基本结构和功能特点,并通过代码示例...

    ASP.NET软件工程师

    如使用的开发环境为VS2010,.net 4.0类库,SQL erver2008,LinQ技术,.net MVC3.0,jquery,extjs,Silverlight4等富客户端技术等,保证了技术在三年之内不会落伍 6、首次采用: 视频授课+上机课作业练习+上机课作业讲解+...

    slickgrid测试

    SlickGrid 是一个Javascript编写的数据控件,其采用数据虚拟显示的特性备受后来的Grid推崇,如ExtJS DataGrid,其架构设计优秀,UI交互功能非常丰富,插件化的可扩展功能开发非常值得Web开发人员学习,本文列出基本...

    Ext Js权威指南(.zip.001

    第1章 ext js 4开发入门 / 1 1.1 学习ext js必需的基础知识 / 1 1.2 json概述 / 3 1.2.1 认识json / 3 1.2.2 json的结构 / 3 1.2.3 json的例子 / 4 1.2.4 在javascript中使用json / 4 1.2.5 在.net中使用...

    javascript中创建对象的几种方法总结

    编程在不断的简化,可是“用户体验、性能、兼容性、可扩展……”要求却在不断提高,随之涌现出Prototype、jQuery、ExtJs、Dojo等优秀的框架(类库),大大简化了web开发。 越来越多的人开始深入研究和使用...

Global site tag (gtag.js) - Google Analytics