如今为了适应需求的不断变化,动态表单设计器应运而生。它主要是为了满足界面的不断变化和提高开发速度。比如:一些页面客户可能也无法确定页面的终于布局,控件的位置,在哪种情况下显示或不显示等可能须要随时改动。为了应对这些需求而不去多次改动源码进行公布,就能够在项目中使用动态表单设计器。如今分享一下我做的动态表单设计器的设计思路,共同学习。

     想做一个表单设计器,首先要确定是做c/s的还是b/s。我考虑到以后的发展方向是c/s向b/s转化,所以就选择了b/s的方向,并且做b/s比做c/s要简单非常多。在做表单设计器之前,须要先实现各种控件,设计好各控件的各种属性。于是我选择对Ext中的各种控件进行封装,做成满足自己须要的控件。

首先说一下功能:

1.包括一些经经常使用到的控件:文本,超链接,button,文件上传,图片,文本输入框,多行文本输入框,日期,时间,列表框(listBox),下拉列表框(分为:可分页和不可分页两种),复选框,单选列表,复选列表,gridlist表格。当然设计器应该便于扩展,当以后须要其他的控件的时候能够非常方便的加入进去。

2.能够非常方便地对各控件进行操作(剪切,粘贴,复制,删除,位置大小的调整)。

3.能够非常方便的对控件的各属性进行设定。这样须要对控件作改动的时候,尽量做到不须要改动代码,在设计当中做一下改动就能够达到目的。

4.由于一些控件可能须要实现一些特殊的功能,所以须要提供编写js代码的界面。

(1)文本:文本控件非常easy,主要是对文本控件的样式和是否隐藏进行设定。

保存后,訪问的效果:

2.超链接:超链接须要可以设定打开连接的地址,和打开的方式(本页面打开,新窗体打开,模式窗体打开)

保存后,訪问的效果:

3.button:主要是可以设定点击button运行的方法

在脚本界面,能够编写js代码。保存后,訪问的效果例如以下:

4.文件上传:能够设定上传文件的类型,是否可上传多个文件等

保存后訪问的效果:

5.复选框

效果:

6.图片:

效果:

7.输入框:须要能指定可输入数据的类型,并能自己主动验证

效果

8.多行文本框

效果:

9.日期输入框:须要可以设定日期的格式

效果

10.时间输入框:须要可设定日期的格式

效果:

上面的这些控件都是一些简单的基本控件。

接下来的是和数据进行交互的控件.这些控件有以下的要求:

1.能设定静态数

2.能通过设定的參数动态的从数据库中读取数据。

3.能设定查询的參数。

4.能设定显示的字段和显示的方式并能实现联动

1.列表控件(listBox)

设定静态数据

设定动态数据:

效果:

2.下拉列表框

3.可动态读去数据可分页的下拉列表框

效果:

4.单选列表

静态数据

动态数据

效果:

5.复选列表

效果:

6.grildList列表(可设定查询的ajax地址,參数,显示的列)

效果

.net web 开发平台- 表单设计器 一(web版)的更多相关文章

  1. .net erp(办公oa)开发平台架构概要说明之表单设计器

    背景:搭建一个适合公司erp业务的开发平台.   架构概要图: 表单设计开发部署示例图    表单设计开发部署示例说明1)每个开发人员可以自己部署表单设计至本地一份(当然也可以共用一套开发环境,但是如 ...

  2. YbSoftwareFactory 代码生成插件【十六】:Web 下灵活、强大的审批流程实现(含流程控制组件、流程设计器和表单设计器)

    程序=数据结构+算法,而企业级的软件=数据+流程,流程往往千差万别,客户自身有时都搞不清楚,随时变化的情况更是家常便饭,抛开功能等不谈,需求变化很大程度上就是流程的变化,流程的变化会给开发工作造成很大 ...

  3. 基于Extjs的web表单设计器 第七节——取数公式设计之取数公式的使用

    基于Extjs的web表单设计器 基于Extjs的web表单设计器 第一节 基于Extjs的web表单设计器 第二节——表单控件设计 基于Extjs的web表单设计器 第三节——控件拖放 基于Extj ...

  4. 基于Extjs的web表单设计器 第六节——界面框架设计

    基于Extjs的web表单设计器 基于Extjs的web表单设计器 第一节 基于Extjs的web表单设计器 第二节——表单控件设计 基于Extjs的web表单设计器 第三节——控件拖放 基于Extj ...

  5. 基于Extjs的web表单设计器 第五节——数据库设计

    这里列出表单设计器系列的内容,6.7.8节的内容应该在春节后才有时间出了.因为这周末就请假回老家了,准备我的结婚大事.在此提前祝大家春节快乐! 基于Extjs的web表单设计器 基于Extjs的web ...

  6. 基于Extjs的web表单设计器

    由于这样工作和自身的一些原因很长一段时间没有写过博客了.最近想把自己前面一段时间搞出的一个表单设计器的相关经验或者经历记录下来.分享给大家,也算是对自己前2个月的一个总结回顾吧. 首先介绍一下开发此版 ...

  7. 基于Extjs的web表单设计器 第二节——表单控件设计

    这一节介绍表单设计器的常用控件的设计. 在前面两章节的附图中我已经给出了表单控件的两大分类:区域控件.常用控件.这里对每个分类以及分类所包含的控件的作用进行一一的介绍,因为它们很重要,是表单设计器的基 ...

  8. 基于Extjs的web表单设计器 第三节——控件拖放

    看过之前设计器截图的朋友应该有印象,可能会发觉我们的设计器UI设计布局其实类似Visual studio 的设计界面,采用的是左.中.右三个区域布局.左侧为控件区域.中间为表单的画布设区域.右侧为属性 ...

  9. 基于Extjs的web表单设计器 第一节

    前面一节介绍了表单设计器的背景和最终的大概样式,本节主要介绍表单设计器的需求及功能设计. 在讲需求之前先明确几个常用的概念: 主表或者卡片表——具有多行多列的一个区域的控件块,如下图所示. 明细表—— ...

随机推荐

  1. Spring面试笔记

    1. Spring工作机制及为什么要用?Spring 是一个开源框架,是为了解决企业应用程序开发复杂性而创建的.Spring既是一个AOP框架,也是一IOC容器.SpringFramework的组成: ...

  2. OpenCV例程实现人脸检测

    前段时间看的OpenCV,其实有很多的例子程序,参考代码值得我们学习,对图像特征提取三大法宝:HOG特征,LBP特征,Haar特征有一定了解后. 对本文中的例子程序刚开始没有调通,今晚上调通了,试了试 ...

  3. Day20 Django之Model多对多、中间件、缓存、信号和分页

    一.Form补充 class IndexForm(forms.Form): # c = [ # (1, 'CEO'), # (2, 'CTO') # ] # 静态字段,属于IndexForm类,即使数 ...

  4. File System Shell

    Overview appendToFile cat chgrp chmod chown copyFromLocal copyToLocal count cp du dus expunge get ge ...

  5. 编程框架—Autofac

    Autofac是一款轻量级的IOC框架,性能高. Autofac基本使用步骤: 1.创建容器建造者(Builder): 2.对Builder注册类型. 3.Buildder创建容器(Container ...

  6. Entity Framework 实践系列 —— 搞好关系 - 两情相悦(双向一对一)【转载】

    Entity Framework 实践系列 —— 搞好关系 - 两情相悦(双向一对一) 自从搞好了单向一对一关系,装满代码的心中塞进了挥之不去的情丝 —— 单相思.谁都知道音乐世界离不开情感,可谁又知 ...

  7. PAT (Basic Level) 1013. 数素数 (20)

    令Pi表示第i个素数.现任给两个正整数M <= N <= 104,请输出PM到PN的所有素数. 输入格式: 输入在一行中给出M和N,其间以空格分隔. 输出格式: 输出从PM到PN的所有素数 ...

  8. GHOST还原

    整理日: 2015年2月16日 GHOST GHO2Disk STEP01 STEP02 STEP03 STEP04 STEP05 STEP06 STEP07

  9. 10个WordPress增强型编辑器大检阅

    Wordpress之所以优秀不在于其本身,而在于无数的插件开发者和性能优化人员.使用过Wordpress的人都知道,WP本身的编辑器极其简陋,就连简单的表格编辑也没有,可能吧这篇文章将介绍一些免费的增 ...

  10. js 作用域,变量提升

    先看下面一段代码: 代码执行的结果是: 1st alert : a = 0 2nd alert : a = undefined 5th alert : a = 0 3rd alert : a = 3 ...