CN107203595B - 一种基于自由表单的动态生成web界面的方法 - Google Patents
一种基于自由表单的动态生成web界面的方法 Download PDFInfo
- Publication number
- CN107203595B CN107203595B CN201710305804.6A CN201710305804A CN107203595B CN 107203595 B CN107203595 B CN 107203595B CN 201710305804 A CN201710305804 A CN 201710305804A CN 107203595 B CN107203595 B CN 107203595B
- Authority
- CN
- China
- Prior art keywords
- input
- list
- page
- interface
- data
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/24—Querying
- G06F16/248—Presentation of query results
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/25—Integrating or interfacing systems involving database management systems
- G06F16/252—Integrating or interfacing systems involving database management systems between a Database Management System and a front-end application
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Computational Linguistics (AREA)
- Information Transfer Between Computers (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本发明提出了一种基于自由表单的动态生成web界面的方法,包括以下步骤:定义页面级信息;定义字段级信息;根据页面级信息,按照规则约束进行解析,动态渲染列表页面,并加载数据;根据字段级信息,自动渲染卡片页面,并加载数据;根据输入规则,校验输入是否正确;输出加载后的列表界面和列表界面。本发明将表单生成web界面,并且可对所生成的web界面进行自定义,使其使用更加灵活,同时,按照规则约束进行解析,能快速的动态渲染列表页面,并加载数据,相比传统的用部分自动化的技术来生成基于web的表单的方式,无需人工干预就可以自动生成web界面,还可以自定义多个功能按钮,便于操作。
Description
技术领域
本发明涉及web界面技术领域,特别涉及一种基于自由表单的动态生成web界面的方法。
背景技术
在许多基于网络的应用程序中,数据访问、数据操纵和数据演示通过对诸如数据库表等底层数据的用户接口来促进。为了标准化功能,用户接口能够以基于web的格式来呈现以使得具有对web浏览器的访问的任何用户都能够与底层数据交互。例如,数据可通过允许用户访问并操纵数据的一个或多个基于web的表单来呈现。为了创建基于web的表单,表单设计者通常手动设计数据层和演示层。数据层响应于来自演示层的命令与底层数据交互(例如,向数据库发出查询)并为演示层提供数据(例如,数据库查询的结果)。表单设计者还可将诸如过滤、主细节、基于服务器的分页以及编辑、删除和***命令等其他功能构建到数据层中。例如,数据层可根据其他准则来过滤查询结果以便将合适的数据集返回给演示层。
某些web表单开发平台利用部分自动化的技术来生成基于web的表单。例如,至少一个平台支持自动显示、编辑、更新和删除功能。然而,这些平台仍然需要手动活动以获得其他功能。例如,过滤、分页和排序通常即使使用这些开发平台也需要人工干预。因此,即使在使用部分自动化的技术时,仍然可消耗相当多的资源以便手动添加附加功能。
发明内容
本发明的目的旨在至少解决所述技术缺陷之一。
为此,本发明的目的在于提供了一种基于自由表单的动态生成web界面的方法,将自由表单动态生成web界面,使其操作更加灵活,无需消耗相当多的资源就可以添加附加功能。
为了实现上述目的,本发明提供一种基于自由表单的动态生成web界面的方法,包括以下步骤:
步骤S1,定义页面级信息,至少包括关联的元数据、列表页面数据分页规则、列表页面数据默认排序规则;
步骤S2,定义字段级信息,至少包括中文名称、元素类型、输入类型、输入设定;
步骤S3,根据页面级信息,按照规则约束进行解析,动态渲染列表页面,并加载数据;
其中,列表页面加载步骤如下:
步骤S301,根据功能编号读取表单配置;
步骤S302,根据列表显示字段渲染列表分列;
步骤S303,根据查询表或试图加载业务数据;
步骤S304,根据每页显示数量进行分页处理;
步骤S305,根据字段的元素类型和输入类型渲染列控件;
步骤S306,根据输入设定初始化控件中的数据;
步骤S307,根据表单列表按钮初始化按钮;
步骤S308,完成列表界面加载;
步骤S4,根据字段级信息,自动渲染卡片页面,并加载数据;
步骤S5,根据输入规则,校验输入是否正确;
步骤S6,输出加载后的列表界面和卡片界面。
进一步的,在步骤S3中,可根据自身业务自定义扩展类,实现Action接口,用于完成业务数据的保存、删除的特殊业务。
进一步的,所述列表页面还设置个性化按钮、查询按钮。
进一步的,在步骤S4中,卡片界面内还可以根据输入类型、输入设定,自动生成字段控件,字段控件至少包括下拉框、单选框、多选框。
进一步的,在步骤S5中,如果校验输入不正确,则提示重新输入,如果校验输入正确,则进入下一操作。
进一步的,在步骤S4中,卡片页面加载步骤如下:
步骤S401,根据功能编号读取表单配置;
步骤S402,根据卡片显示字段渲染详细页输入字段;
步骤S403,根据操作表查询业务数据;
步骤S404,根据字段的元素类型和输入类型渲染输入框的控件;
步骤S405,根据输入设定初始化控件中的数据;
步骤S406,根据是否只读控制输入项是否可编辑;
步骤S407,根据卡片是否为空控制输入项是否允许为空;
步骤S408,根据表单卡片按钮初始化按钮;
步骤S409,完成卡片界面加载。
进一步的,所述卡片页面加载是由双击列表数据后开始的。
本发明将表单生成web界面,并且可对所生成的web界面进行自定义,使其使用更加灵活,同时,按照规则约束进行解析,能快速的动态渲染列表页面,并加载数据,相比传统的用部分自动化的技术来生成基于web的表单的方式,无需人工干预就可以自动生成web界面,还可以自定义多个功能按钮,便于操作。
附图说明
本发明的上述和/或附加的方面和优点从结合下面附图对实施例的描述中将变得明显和容易理解,其中:
图1为本发明的主体流程图;
图2为本发明的列表页面加载流程图;
图3为本发明的卡片页面加载流程图。
具体实施方式
下面详细描述本发明的实施例,所述实施例的示例在附图中示出,其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的,旨在用于解释本发明,而不能理解为对本发明的限制。
下面结合具体实施方式对本发明作详细说明。
如图1-3所示,本发明提供的基于自由表单的动态生成web界面的方法,包括以下步骤:
步骤S1,定义页面级信息,至少包括关联的元数据、列表页面数据分页规则、列表页面数据默认排序规则;
步骤S2,定义字段级信息,至少包括中文名称、元素类型、输入类型、输入设定;
步骤S3,根据页面级信息,按照规则约束进行解析,动态渲染列表页面,并加载数据;
其中,列表页面加载步骤如下:
步骤S301,根据功能编号读取表单配置;
步骤S302,根据列表显示字段渲染列表分列;
步骤S303,根据查询表或试图加载业务数据;
步骤S304,根据每页显示数量进行分页处理;
步骤S305,根据字段的元素类型和输入类型渲染列控件;
步骤S306,根据输入设定初始化控件中的数据;
步骤S307,根据表单列表按钮初始化按钮;
步骤S308,完成列表界面加载;
此外,列表界面可根据自身业务自定义扩展类,实现Action接口,用于完成业务数据的保存、删除的特殊业务。列表页面还设置个性化按钮、查询按钮,个性化按钮可在扩展js中实现。
步骤S4,根据字段级信息,自动渲染卡片页面,并加载数据;所述卡片页面加载是由双击列表数据后开始的。
其中,卡片页面加载步骤如下:
步骤S401,根据功能编号读取表单配置;
步骤S402,根据卡片显示字段渲染详细页输入字段;
步骤S403,根据操作表查询业务数据;
步骤S404,根据字段的元素类型和输入类型渲染输入框的控件;
步骤S405,根据输入设定初始化控件中的数据;
步骤S406,根据是否只读控制输入项是否可编辑;
步骤S407,根据卡片是否为空控制输入项是否允许为空;
步骤S408,根据表单卡片按钮初始化按钮;
步骤S409,完成卡片界面加载。
此外,卡片界面内还可以根据输入类型、输入设定,自动生成字段控件,字段控件至少包括下拉框、单选框、多选框。
步骤S5,根据输入规则,校验输入是否正确;如果校验输入不正确,则提示重新输入,如果校验输入正确,则进入下一操作。
步骤S6,输出加载后的列表界面和卡片界面。
本发明将表单生成web界面,并且可对所生成的web界面进行自定义,使其使用更加灵活,同时,按照规则约束进行解析,能快速的动态渲染列表页面,并加载数据,相比传统的用部分自动化的技术来生成基于web的表单的方式,无需人工干预就可以自动生成web界面,还可以自定义多个功能按钮,便于操作。
尽管上面已经示出和描述了本发明的实施例,可以理解的是,上述实施例是示例性的,不能理解为对本发明的限制,本领域的普通技术人员在不脱离本发明的原理和宗旨的情况下在本发明的范围内可以对上述实施例进行变化、修改、替换和变型。本发明的范围由所附权利要求极其等同限定。
Claims (4)
1.一种基于自由表单的动态生成web界面的方法,其特征在于,包括以下步骤:
步骤S1,定义页面级信息,至少包括关联的元数据、列表页面数据分页规则、列表页面数据默认排序规则;
步骤S2,定义字段级信息,至少包括中文名称、元素类型、输入类型、输入设定;
步骤S3,根据页面级信息,按照规则约束进行解析,动态渲染列表页面,并加载数据;
其中,列表页面加载步骤如下:
步骤S301,根据功能编号读取表单配置;
步骤S302,根据列表显示字段渲染列表分列;
步骤S303,根据查询表或试图加载业务数据;
步骤S304,根据每页显示数量进行分页处理;
步骤S305,根据字段的元素类型和输入类型渲染列控件;
步骤S306,根据输入设定初始化控件中的数据;
步骤S307,根据表单列表按钮初始化按钮;
步骤S308,完成列表界面加载;列表界面可根据自身业务自定义扩展类,实现Action接口,用于完成业务数据的保存、删除的特殊业务;列表页面还设置个性化按钮、查询按钮,个性化按钮可在扩展js中实现;
步骤S4,根据字段级信息,自动渲染卡片页面,并加载数据;其中,卡片页面加载步骤如下:
步骤S401,根据功能编号读取表单配置;
步骤S402,根据卡片显示字段渲染详细页输入字段;
步骤S403,根据操作表查询业务数据;
步骤S404,根据字段的元素类型和输入类型渲染输入框的控件;
步骤S405,根据输入设定初始化控件中的数据;
步骤S406,根据是否只读控制输入项是否可编辑;
步骤S407,根据卡片是否为空控制输入项是否允许为空;
步骤S408,根据表单卡片按钮初始化按钮;
步骤S409,完成卡片界面加载;
步骤S5,根据输入规则,校验输入是否正确;
步骤S6,输出加载后的列表界面和卡片界面。
2.如权利要求1所述的基于自由表单的动态生成web界面的方法,其特征在于,在步骤S4中,卡片界面内还可以根据输入类型、输入设定,自动生成字段控件,字段控件至少包括下拉框、单选框、多选框。
3.如权利要求1所述的基于自由表单的动态生成web界面的方法,其特征在于,在步骤S5中,如果校验输入不正确,则提示重新输入,如果校验输入正确,则进入下一操作。
4.如权利要求1所述的基于自由表单的动态生成web界面的方法,其特征在于,所述卡片页面加载是由双击列表数据后开始的。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710305804.6A CN107203595B (zh) | 2017-05-03 | 2017-05-03 | 一种基于自由表单的动态生成web界面的方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201710305804.6A CN107203595B (zh) | 2017-05-03 | 2017-05-03 | 一种基于自由表单的动态生成web界面的方法 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN107203595A CN107203595A (zh) | 2017-09-26 |
CN107203595B true CN107203595B (zh) | 2021-11-30 |
Family
ID=59906330
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201710305804.6A Active CN107203595B (zh) | 2017-05-03 | 2017-05-03 | 一种基于自由表单的动态生成web界面的方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN107203595B (zh) |
Families Citing this family (8)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN108170706A (zh) * | 2017-11-22 | 2018-06-15 | 链家网(北京)科技有限公司 | 一种信息采集页面生成方法及装置 |
CN107886280B (zh) * | 2017-11-29 | 2022-02-18 | 深圳市易达云科技有限公司 | 一种订单操作项智能过滤显示方法及*** |
CN109165266A (zh) * | 2018-09-03 | 2019-01-08 | 中国平安人寿保险股份有限公司 | 表单生成方法、装置、计算机设备和存储介质 |
CN112004160B (zh) * | 2020-07-15 | 2022-04-05 | 福建新大陆通信科技股份有限公司 | 一种基于按页列表控件的界面交互方法、设备及介质 |
CN112465620B (zh) * | 2020-12-30 | 2023-12-19 | 广东金赋科技股份有限公司 | 基于动态表单与规则引擎的终端填单业务联动方法及装置 |
CN112711416B (zh) * | 2020-12-31 | 2021-10-26 | 北方工业大学 | 一种app的界面定制化实现方法 |
CN113110315A (zh) * | 2021-03-31 | 2021-07-13 | 深圳市法拉第电驱动有限公司 | 基于wpf的动态加载控件的上位机***及其控制方法 |
CN114356472A (zh) * | 2021-12-03 | 2022-04-15 | 浙江臻善科技股份有限公司 | 一种***界面差别化动态渲染的方法 |
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101241434A (zh) * | 2008-03-04 | 2008-08-13 | 浪潮集团山东通用软件有限公司 | 表单自定义方法 |
CN102789382A (zh) * | 2012-06-28 | 2012-11-21 | 用友软件股份有限公司 | 用于表单生成和运行的***及方法 |
CN104732306A (zh) * | 2013-12-19 | 2015-06-24 | 北京索为高科***技术有限公司 | 一种业务应用***的快速开发***及方法 |
CN105630502A (zh) * | 2015-12-28 | 2016-06-01 | 武汉传神信息技术有限公司 | 一种生成动态表单的方法和*** |
Family Cites Families (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US9336191B2 (en) * | 2009-05-05 | 2016-05-10 | Suboti, Llc | System, method and computer readable medium for recording authoring events with web page content |
CN102737128B (zh) * | 2012-06-20 | 2014-12-10 | 深圳市远行科技有限公司 | 一种基于浏览器的动态页面处理装置 |
CN103631570A (zh) * | 2012-08-21 | 2014-03-12 | 镇江雅迅软件有限责任公司 | 一种表单自定义方法 |
US20140173405A1 (en) * | 2012-12-19 | 2014-06-19 | Google Inc. | Using custom functions to dynamically manipulate web forms |
CN104881490B (zh) * | 2015-06-10 | 2019-11-22 | 中科宇图天下科技有限公司 | 一种web表单数据存取方法和*** |
-
2017
- 2017-05-03 CN CN201710305804.6A patent/CN107203595B/zh active Active
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101241434A (zh) * | 2008-03-04 | 2008-08-13 | 浪潮集团山东通用软件有限公司 | 表单自定义方法 |
CN102789382A (zh) * | 2012-06-28 | 2012-11-21 | 用友软件股份有限公司 | 用于表单生成和运行的***及方法 |
CN104732306A (zh) * | 2013-12-19 | 2015-06-24 | 北京索为高科***技术有限公司 | 一种业务应用***的快速开发***及方法 |
CN105630502A (zh) * | 2015-12-28 | 2016-06-01 | 武汉传神信息技术有限公司 | 一种生成动态表单的方法和*** |
Non-Patent Citations (1)
Title |
---|
李洪营;基于模型驱动的web表单开发工具的设计与实现;《中国优秀硕士学位论文全文数据库 信息科技辑》;20160215;I138-662 * |
Also Published As
Publication number | Publication date |
---|---|
CN107203595A (zh) | 2017-09-26 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN107203595B (zh) | 一种基于自由表单的动态生成web界面的方法 | |
JP6730399B2 (ja) | ダイアログカスタマイズのためのシステムおよび方法 | |
CN114035773B (zh) | 一种基于配置的低代码开发表单方法、***及装置 | |
CN102722372B (zh) | 一种通过分类配置自动生成代码的方法及*** | |
US7750924B2 (en) | Method and computer-readable medium for generating graphics having a finite number of dynamically sized and positioned shapes | |
US9582288B1 (en) | Method for integrating software components into a spreadsheet application | |
CN107025037B (zh) | 一种智能设备的控制方法及装置 | |
JP5219928B2 (ja) | 編集装置及び編集方法、プログラム | |
US20130290837A1 (en) | Method and Apparatus for Correcting Document Formatting Based on Source Document | |
CN108614693B (zh) | 一种针对页面组件的处理方法、装置及设备 | |
CN113641719A (zh) | 数据处理方法、装置、计算机及存储介质 | |
CN113553635A (zh) | 图库图元配置方法、装置、电子设备和存储介质 | |
CN106886390A (zh) | 一种Java对象生成和转换方法和Java对象生成和转换装置 | |
US9355130B1 (en) | Method and system for component parameter management | |
CN112328347A (zh) | 应用规则配置方法、装置和页面处理方法 | |
CN111079382A (zh) | 基于mvvm模式的表单渲染方法及*** | |
CN110968311A (zh) | 前端页面构建方法、装置及电子设备 | |
CN103294516A (zh) | 一种信息显示方法及装置 | |
WO2016133153A2 (ja) | 情報管理装置並びにファイル管理方法 | |
CN106227713A (zh) | 文档的处理方法及装置 | |
CN117931164B (zh) | 基于低代码的表单应用设计方法及*** | |
WO2020125541A1 (zh) | 选项名称多元化选单设定装置与方法 | |
CN108170415B (zh) | 一种基于可配置控件的轻型应用程序创建方法 | |
CN117271510A (zh) | 一种物料数据管理平台的构建方法和物料数据管理平台 | |
CN114254333A (zh) | 应用权限处理方法及装置 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |