`

使用ExtJs开发项目总结

 
阅读更多

1、少用IFrame,或者不要使用Iframe。

 

2、每个页面Panel定义一个自定义的类,在OnReady直接写上即可。

 

3、没有必要就不要修改ExtJs原功能和CSS样式。

 

4、视图层(UI)、数据层(Data)、控制层(Action)分为3个JS来保存。

 

5、没有必要,千千万万不要定义全局变量,尽量使用局部变量。

 

6、充分利用Javascript的动态语言的动态这个特性。

 

7、少使用Cookie来保存一些变量。

 

8、要使用面向对象的思想去编写Javascript。

 

9、如果对原来控件功能修改,一定要想方法在一个地方达到目的,而不是大面积的修改。

 

10、在一个页面上同时存在多个请求时,不要使用AutoAbort这个属性。

 

11、在使用向后台提交数据时,注意前台的超时设置,及如果请求过长时,应该使用Loading来保证操作的独立性。

 

12、这条是希望可能达到的功能。就是可以学习游戏中的自动帮用户完成一些操作,或者可以使用教程的方式,在页面上动态的带动用户去完成一些未知道的功能。使用工具提示的方式去完成这个功能。

 

13、页面功能要尽量的简单,容易操作,功能独立性,我觉得没有必要在一个页面完成太多的功能。一个页面只有一个功能即可。

 

14、对于页面自适应,尽量使用CSS实现,不要使用JS来计算实现。

 

15、不要重叠太多面板,这样会导致DIV很多,浪费内存。

 

16、数据加载最好放在Panel的afterrender事件里完成。

 

17、少使用MessageBox来做为告警提示,最好使用在页面上直接提示。

 

18、不要把CSS直接写到JS当中。

 

19、如果使用BasicForm的Submit方法提交数据,且Form控件上存在Combox控件,则Combox必须设置hiddenName,否则提交的数据是Combox显示的文本,则不是值,hiddenName不要与Combox的id相同。例如:

{
        xtype : 'combo',
        fieldLabel : $lticketsc(name),
        id : name+'combo' ,
        hiddenName : name ,
        typeAhead : true,
        triggerAction : 'all',
        lazyRender : true,
        editable : false,
        value : '1',
        mode : 'local',
        store : new Ext.data.ArrayStore({
                    id : 0,
                    fields : [name , 'display'],
                    data : data //[[1, $d('topbook')], [2, $d('bottombook')]]
                }),
        valueField : name ,
        displayField : 'display'
    }

20、如果想在指定父容器中直接使用类.属性来获取属性的话,则可以通过控件中的这个属性来实现,ref : String

一个路径描述,与组件的 ownerCt 相关,它描述了把当前组件的命名引用放置到哪个父容器中去。...

一个路径描述,与组件的 ownerCt 相关,它描述了把当前组件的命名引用放置到哪个父容器中去。

祖先的坐标路径可以通过'/'字符进行分隔。 例如,将一个Toolbar Button的引用放入 拥有此Toolbar的Panel中 :

								
var
 myGrid = new
 Ext.grid.EditorGridPanel({
    title: 'My EditorGridPanel'
,
    store: myStore,
    colModel: myColModel,
    tbar: [{
        text: 'Save'
,
        handler: saveChanges,
        disabled: true,
        ref: '../saveButton'

    }],
    listeners: {
        afteredit: function
() {
            // 直接使用实例.属性来获取子控件saveButton,saveButton这个需要保证唯一


            myGrid.saveButton.enable();
        }
    }
});

在上面的代码中,如果 ref 'saveButton' ,那么引用将会被放置到Toolbar中。 ref 中的每个'/' 都会从组件的 ownerCt 向上移动一级。

 

1
6
分享到:
评论
7 楼 lyndon.lin 2011-08-16  
20、当用户在操作数据时,离开当前窗口,弹出友好提示框
6 楼 lyndon.lin 2011-08-15  
19、实现History进行和后退,实现重新打开系统或者按F5后,系统还会记忆在上一次的状态。
5 楼 lyndon.lin 2011-08-12  
18、不要把CSS直接写到JS当中。
4 楼 lyndon.lin 2011-08-10  
17、少使用MessageBox来做为告警提示,最好使用在页面上直接提示。
3 楼 lyndon.lin 2011-08-10  
16、数据加载最好放在Panel的afterrender事件里完成。
2 楼 lyndon.lin 2011-08-09  
虽然是由客户去决定这个需求,但是开发人员可以建议如何把复杂的功能简单化吧
1 楼 hyj1254 2011-08-09  
引用
13、页面功能要尽量的简单,容易操作,功能独立性,我觉得没有必要在一个页面完成太多的功能。一个页面只有一个功能即可。

这个貌似不是由开发人员决定的,而是由客户、经理决定。大多数时候,一个页面会被要求实现无数个功能。

相关推荐

    EXTJS开发总结.pdf

    在EXTJS开发中,与服务器端的通信是一个关键问题。EXTJS不自带服务器端适配层,因此需要开发者自行处理数据结构。主要的通信方式包括: 1. 使用`Ext.Ajax.request`进行异步请求,服务器可以返回JSON或HTML片段。 2. ...

    ExtJs 开发指南书籍 实例 可视化工具

    5. **ExjsHotel.rar**:这个可能是基于ExtJs开发的一个酒店预订系统的示例项目,开发者可以从中学习到如何构建一个完整的业务应用,包括如何组织代码、如何实现交互逻辑、如何处理用户输入等。 6. **extjs实用开发...

    EXTJS4开发的图片文章管理项目实例

    总结来说,这个EXTJS4开发的图片文章管理项目实例展示了前端EXTJS4的强大UI构建能力,后端JAVA的稳定处理性能,以及MYSQL数据库的数据存储功能。通过学习这个实例,开发者可以深入理解EXTJS4的MVC架构,JAVA的Web...

    ExtJS开发插件及Ext包

    总结,ExtJS开发插件和管理Ext包是构建高效、可扩展的Web应用的关键技术。通过学习和熟练掌握这些技能,开发者能够利用ExtJS的强大功能构建出功能丰富、用户体验优秀的应用程序。同时,利用如Spket这样的专业IDE,...

    extjs6.6框架的web项目(登录+首页)

    总结,EXTJS 6.6框架的Web项目提供了一个完整的登录和首页示例,展示了EXTJS在构建复杂Web应用时的强大能力。通过学习和理解这个项目,开发者可以更好地掌握EXTJS的核心特性,提升自己的前端开发技能。

    php+ExtJS 开发实战

    - **项目案例**: 通过具体的项目案例,展示了如何使用PHP处理业务逻辑,以及如何利用ExtJS构建用户界面。 - **最佳实践**: 分享了一些在开发过程中积累的最佳实践,包括代码优化、性能提升等方面的经验总结。 #### ...

    extjs网页控件开发

    ExtJS是一种基于JavaScript的...总结起来,"extjs网页控件开发"涵盖了ExtJS的核心技术,包括图表的创建和多级联动下拉列表框的实现。通过深入学习和实践,不仅可以提高开发效率,还能打造出具有专业水准的Web应用程序。

    Extjs开发总结(转).pdf

    ExtJS是一种富互联网应用(RIA)开发框架,专注于构建客户端应用程序。与Prototype和jQuery等轻量级库不同,ExtJS提供了完整的组件模型和丰富的用户...在实际项目中,不断学习和总结经验,是提升ExtJS开发技能的关键。

    asp.net与extjs开发点卡在线销售系统__0525.rar

    总结,这个“asp.net与extjs开发点卡在线销售系统”项目展示了如何结合两种技术构建一个完整的电子商务平台,涵盖了前端交互、后端处理、数据管理等多个方面,对于学习ASP.NET和EXTJS的开发者来说,是一个很好的实践...

    搭建利用Extjs库开发的环境

    为了更好地利用Extjs进行开发,本文将详细介绍如何在Spket IDE中配置Extjs开发环境,使得开发者能够享受到强大的代码提示与调试支持,提高开发效率。 #### 二、准备工作 在开始配置前,请确保以下条件已满足: 1. ...

    myeclipse中使用extjs缓慢 卡死 白屏 解决方法总结

    ### MyEclipse中使用ExtJS出现缓慢、卡死、白屏问题及解决方法总结 在进行Web开发时,经常会遇到一些工具与框架不兼容或配置不当导致的问题,这些问题往往会影响到开发效率。本文将针对在MyEclipse环境中使用ExtJS...

    合同管理系统 extjs开发的 让大家一起学习

    总结,EXTJS为合同管理系统的开发带来了高效、灵活和丰富的用户界面,通过其强大的功能,可以打造出满足企业需求的合同管理平台,提升企业的合同管理效率和规范化程度。无论是前端界面设计还是后台数据交互,EXTJS都...

    action+extjs开发

    总结来说,Action+ExtJS开发是将Java后端的业务处理能力和JavaScript前端的用户交互优势相结合,提供高性能、交互性强的Web应用解决方案。开发者需要熟练掌握Struts2框架以及ExtJS库,了解MVC模式,理解HTTP请求响应...

    EXTJS与.NET开发

    总结来说,EXTJS为.NET开发者提供了强大的前端开发工具,使他们能够创建出功能丰富、用户体验优秀的Web应用。通过理解并熟练掌握EXTJS与.NET的集成技术,开发者可以提高开发效率,同时提升应用程序的性能和用户体验...

    ExtJs小项目源码

    总结来说,这个"ExtJs小项目源码"是一个学习ExtJs、Servlet和基本数据库操作的理想起点。它可以帮助初学者熟悉前后端分离的开发模式,理解JavaScript库如何与Java后端服务协同工作,以及如何使用SQL Server进行数据...

    ExtJs可视化开发工具3.0

    总结起来,ExtJs可视化开发工具3.0是一个强大的开发辅助工具,它利用直观的可视化界面,简化了基于ExtJS的Web应用开发流程,提升了开发效率,降低了学习门槛,为开发者带来更加便捷和高效的开发体验。通过这个工具,...

    ExtJS 图形开发工具

    通过这款工具,开发者可以创建模型、控制器、视图和存储,同时实时查看应用程序的外观和行为,大大简化了ExtJS开发过程。 总结来说,"ExtJS 图形开发工具"是面向ExtJS开发者的强大助手,通过可视化设计和代码生成,...

    ExtJs(开发指南书籍+实例+可视化工具)

    ExtJs 是一个强大的...无论你是初学者还是有一定经验的开发者,这个资源包都能满足你的需求,助你在ExtJs开发之路上更进一步。通过深入学习和实践,你将能够利用ExtJs创建出功能强大、用户体验优秀的Web应用程序。

    Spring+Hibernate+Extjs项目实例

    "Spring+Hibernate+Extjs项目实例"是一个综合性的Web开发示例,它涵盖了后端的业务处理、数据库操作和前端的用户界面设计。通过这个实例,开发者可以学习到如何有效地整合这些技术,提升Web应用的开发效率和用户体验...

Global site tag (gtag.js) - Google Analytics