.net web 开发平台- 表单设计器 一(web版)

.net web 开发平台- 表单设计器 一(web版)

大家好,又见面了,我是全栈君,祝每个程序员都可以多学几门语言。

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

.net web 开发平台- 表单设计器 一(web版)

保存后,訪问的效果:

.net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版)

保存后,訪问的效果:

.net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版).net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版)

 

保存后訪问的效果:

.net web 开发平台- 表单设计器 一(web版)

5.复选框

.net web 开发平台- 表单设计器 一(web版)

效果:

.net web 开发平台- 表单设计器 一(web版)

6.图片:

.net web 开发平台- 表单设计器 一(web版)

效果:

.net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版)

效果

.net web 开发平台- 表单设计器 一(web版)

8.多行文本框

.net web 开发平台- 表单设计器 一(web版)

效果:

.net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版)

效果

.net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版)

效果:

.net web 开发平台- 表单设计器 一(web版)

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

 

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

1.能设定静态数

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

3.能设定查询的參数。

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

1.列表控件(listBox)

设定静态数据

.net web 开发平台- 表单设计器 一(web版)

设定动态数据:

.net web 开发平台- 表单设计器 一(web版)

效果:

.net web 开发平台- 表单设计器 一(web版)

 

2.下拉列表框

.net web 开发平台- 表单设计器 一(web版)

 

.net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版)

效果:

.net web 开发平台- 表单设计器 一(web版)

 

4.单选列表

静态数据

.net web 开发平台- 表单设计器 一(web版)

动态数据

.net web 开发平台- 表单设计器 一(web版)

效果:

.net web 开发平台- 表单设计器 一(web版)

 

5.复选列表

.net web 开发平台- 表单设计器 一(web版)

 .net web 开发平台- 表单设计器 一(web版)

效果:

.net web 开发平台- 表单设计器 一(web版)

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

.net web 开发平台- 表单设计器 一(web版)

.net web 开发平台- 表单设计器 一(web版)

效果

.net web 开发平台- 表单设计器 一(web版)

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/118513.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 可以查看idea的激活码吗破解方法

    可以查看idea的激活码吗破解方法,https://javaforall.net/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

    2022年3月15日
    52
  • vim为什么不能打开文件了(vim怎么保存文件)

    vim打开的文件无法使用:wq保存的问题在使用vim编辑一个.c文件的时候,完成使用:wq保存报以下错误网上查了一下,应该是权限问题.一般做法是先退出当前vim,以sudovim进入即可。如果使用ctrl+z命令退出,授予权限之后无法使用fg命令返回vim中E121:无法打开并写入文件解决办法1、使用命令:w!sudotee%保存即可。其中:冒号(:)表示我们处于vim的退出模式;感叹号(!)表示我们正在运行shell命令;sudo和tee都是shell命令;%表示从当前

    2022年4月14日
    60
  • 知乎免登录插件2021

    在电脑中使用过网页版知乎的小伙伴们应该都知道,在使用前是必须进行登录的,为此小编就带来了知乎免登录插件2021,这是专门针对知乎登录问题而打造的一个浏览器插件脚本工具。虽然之前小编也有介绍过知乎uwp版,但是也有许多人更加偏爱网页版,那么最好就是配合这个脚本插件来进行使用哦,因为在访问网页版时会强制要求你登录账号,否则根本点不进去,无法正常使用,但是有了该插件,只需要启动即可轻松帮助用户实现不登录也可正常使用知乎网页版,并只要启动了知乎免登陆脚本不仅直接免去了登陆的流程,还丝毫不会影响用户浏览其中的问题、文

    2022年4月6日
    979
  • vc 获取月份的天数_根据距离1900年1月1日的天数(0起始),计算这一天的日期(年,月,日)…

    vc 获取月份的天数_根据距离1900年1月1日的天数(0起始),计算这一天的日期(年,月,日)…我的代码,算法不优美,但结果正确^_^#include#include#includevoidfoo(int&year,int&month,int&day){year=1900;month=1;day+=0;for(intn;n=(((year%4==0&&year%100!=0)||(year%400==0))…

    2022年8月12日
    4
  • (更新时间)2021年3月26日 python基础知识(模块制作)[通俗易懂]

    (更新时间)2021年3月26日 python基础知识(模块制作)[通俗易懂]模块制作<1>定义自己的模块在Python中,每个Python文件都可以作为一个模块,模块的名字就是文件的名字。比如有这样一个文件test.py,在test.py中定义了函数addtest.pydefadd(a,b):returna+b<2>调用自己定义的模块那么在其他文件中就可以先importtest,然后通过test.add(a,b)来调用了,当然也可以通过fromtestimportadd来引入main.pyimporttestr

    2022年9月2日
    3
  • 数据绑定以及Container.DataItem几种方式与使用方法分析[通俗易懂]

    数据绑定以及Container.DataItem几种方式与使用方法分析[通俗易懂]灵活的运用数据绑定操作绑定到简单属性:绑定到集合:'runat="server">绑定到表达式:绑定到方法返回值:绑定到Hashtable:绑定到Arr

    2022年7月2日
    26

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号