前面几节完成了模块Grid的自定义,模块Form自定义的过程和Grid的过程类似,但是要更复杂一些。先来设计一下要完成的总体目标。

1、可以有多个Form方案,对应于显示、新增、修改、审核、审批等功能;

2、对于上述各种功能可以选择不同的Form方案,比如说修改可以有几个方案,各个操作员可以选择他们感兴趣的Form方案来进行数据的修改。

3、每个Form方案中可以定义若干个字段分组(FieldSet或FieldContainer)。

4、每个字段分组中可以放置若干个字段。

5、每个Form方案可以定义成Tab或者Accordion显示方式。

6、可以放置下级模块的Grid在Form中,即master-detail方式。

具体的内容可以看我以前的博客:http://blog.csdn.net/jfok/article/details/24472139,下面我贴几个图显示一下自定义生成的form界面,好有个直观的了解。

1、最基本的Form界面,上面只有一个FieldSet,里面有若干个字段,还有一些操作按钮。

2、由二个FieldSet组成的Form,其中某些可以折叠。

3、在Form中加入子模块的Grid。

4、在Form中加入Tab的样式。

5、某些特殊格式的Form表。

6、一个综合的比较复杂的例子:这个例子中加入单条记录的多个子模块,可以协同进行操作。

上面列出了一些在原来版本已经可以完成的Form类型,以上例子都是完全根据配置信息由extjs解释执行而生成的。可以由管理人员在系统中直接新增和修改任何的Form项,由此完成了模块Form完全自定义的功能。

在展示的FormField中,除了可以生成字符Field,也可以完成日期、数值、Combo等复杂类型的字段,只要想得出来的功能,就能够写成配置,然后解释后展示出来。在下面的实现过程中,由于没有前后台的交互,我只会做一个比较简单的例子来展示如何自定义Form的实现。

21、手把手教你Extjs5(二十一)模块Form的自定义的设计的更多相关文章

  1. 22、手把手教你Extjs5(二十二)模块Form的自定义的设计[1]

    下面开始设计和完成一个简单的Form的自定义过程.先准备数据,在ModuleModel.js中的data属性下面,加入自定义Form的参数定义,下面的代码中定义了一个新的属性tf_formScheme ...

  2. 23、手把手教你Extjs5(二十三)模块Form的自定义的设计[2]

    在本节中将要加入各种类型的字段,在加入字段的时候由于可以一行加入多个字段,因此层次结构又多了一层fieldcontainer.form里面的主要层次结构如下: form -- fieldSet -- ...

  3. 24、手把手教你Extjs5(二十四)模块Form的自定义的设计[3]

    自定义的Form已经可以运行了,下面改一下配置,把Form里面的FieldSet放在Tab之下.修改一下ModuleModel.js中的data下的tf_FormSchemes下的方案,增加一个属性. ...

  4. 11、手把手教你Extjs5(十一)模块界面的总体设计

    上一节中设计了一些模块自定义中用到的要素,为了直观起见,这一节先建立一个模块的主界面.看过我 模块管理常规功能自定义系统的设计与实现 博客的人应该会有所了解了.一个模块的主界面是一个Grid,在其上方 ...

  5. 2、手把手教你Extjs5(二)项目中文件的加载过程

    上一节中用sencha工具自动创建了一个项目,并且可以在浏览器中查看.现在我们来看看js类加载过程.如下图所示: 1、首先:浏览器中输入 localhost:1841 ,调用 index.html; ...

  6. 20、手把手教你Extjs5(二十)模块Grid的多列表方案

    对于有很多字段的模块在一个grid中显示所有的字段,会显得很臃肿,对于不同的用户其侧重的字段类型也不尽相同,因此就有必要为Grid的列表设计多个方案.在这个自定义系统进行设计的时候,我已经将这部分内容 ...

  7. 13、手把手教你Extjs5(十三)模块字段和Grid列的定义[1]

    这一节加入模块自定义字段,并根据这些字段生成model.然后再定义grid中的分组和列.从这一切开始真正进入到了模块自定义的节奏当中,代码的复杂度和技巧性也大大提高.先从模块字段的自定义开始.先看一下 ...

  8. 12、手把手教你Extjs5(十二)执行菜单命令在tabPanel中显示模块

    上面设计好了一个模块的主界面,下面通过菜单命令的执行来把这个模块加入到主界面当中.在MainModule.js中有一个函数,生成了当前的菜单数据: // 根据data.systemMenu生成菜单条和 ...

  9. 19、手把手教你Extjs5(十九)模块Grid的其他功能的设想

    经过对自定义模块和Grid的设计和编码,现在已经能对一个有配置信息的模块来生成界面并进行一些简单的CURD操作.由于这是一个全解释性的前台的架构,因此你想到的任何新主意都可以放到所有的模块中. 比如对 ...

随机推荐

  1. 利用Fiddler抓取手机APP数据包

    Fiddler是一个调试代理,下载地址http://www.telerik.com/download/fiddler 下载安装运行后,查出运行机器的IP,手机连接同一网域内的WIFI,手机WIFI连接 ...

  2. JAVA-基本知识

    1.JAVA跨平台 其实就是在每个平台上要安装对应该操作系统的JVM,JVM负责解析执行,即实现了跨平台.JVM是操作系统与java程序之间的桥梁. 2.JRE:java运行环境,包含JVM+核心类库 ...

  3. ReactiveCocoa / RxSwift 笔记一

    原创:转载请注明出处 ReactiveCocoa / RxSwift Native app有很大一部分的时间是在等待事件发生,然后响应事件,比如 1.等待网络请求完成, 2.等待用户的操作, 3.等待 ...

  4. required 引发的小小思考

    原创:转载请注明出处 首先,因为遇到问题如下: class MainTabBar: UITabBar { override init(frame: CGRect) { super.init(frame ...

  5. [转]startActivityForResult的用法和demo

    有时候我们需要把A activity提交数据给B  activity处理,然后把结果返回给A 这种方式在很多种情况需要用到,比如我应用的程序需要有拍照上传的功能. 一种解决方案是  我的应用程序 〉调 ...

  6. dfs和bfs的简单总结

    首先是dfs,又名深度优先搜索.看名字就知道,它的核心思想就是一直搜索,先在一条路上面一路撸到底,如果到底没有办法前进了,那么判断是否到达终点,如果没有到达,那么就回溯到之前的点再撸. dfs的要点: ...

  7. 2015十大顶级开源ERP系统点评

    如今,企业资源规划(ERP)和客户关系管理(CRM)系统的必要性已经被各种组织和企业所认可:ERP和CRM能够直接为企业的业务效率和利润做出贡献. 但是随着今天企业商业形态的日趋多样化,互联网新经济的 ...

  8. 解决getJSON的缓存问题

    $.getJSON("/portal/edu/getAllEdu?adr="+Math.random(),function(data){

  9. mysql 远程连接不上 %用户已经添加了

    修改mysql的配置文件/etc/mysql/my.conf,将bind-address后面增加远程访问IP地址或者禁掉这句话就可以让远程机登陆访问了. 记得要重启mysql服务哦 service m ...

  10. 【转】Build Your own Simplified AngularJS in 200 Lines of JavaScript

    原文:http://blog.mgechev.com/2015/03/09/build-learn-your-own-light-lightweight-angularjs/ Build Your o ...