CN107203595A - 一种基于自由表单的动态生成web界面的方法 - Google Patents

一种基于自由表单的动态生成web界面的方法 Download PDF

Info

Publication number
CN107203595A
CN107203595A CN201710305804.6A CN201710305804A CN107203595A CN 107203595 A CN107203595 A CN 107203595A CN 201710305804 A CN201710305804 A CN 201710305804A CN 107203595 A CN107203595 A CN 107203595A
Authority
CN
China
Prior art keywords
list
input
page
data
interface
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.)
Granted
Application number
CN201710305804.6A
Other languages
English (en)
Other versions
CN107203595B (zh
Inventor
龙刚
张振宇
王春生
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
BEIJING HAYDEN ZHONGKE TECHNOLOGY Co Ltd
Original Assignee
BEIJING HAYDEN ZHONGKE TECHNOLOGY Co Ltd
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by BEIJING HAYDEN ZHONGKE TECHNOLOGY Co Ltd filed Critical BEIJING HAYDEN ZHONGKE TECHNOLOGY Co Ltd
Priority to CN201710305804.6A priority Critical patent/CN107203595B/zh
Publication of CN107203595A publication Critical patent/CN107203595A/zh
Application granted granted Critical
Publication of CN107203595B publication Critical patent/CN107203595B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/20Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
    • G06F16/24Querying
    • G06F16/248Presentation of query results
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/20Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
    • G06F16/25Integrating or interfacing systems involving database management systems
    • G06F16/252Integrating or interfacing systems involving database management systems between a Database Management System and a front-end application
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation 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界面,使其操作更加灵活,无需消耗相当多的资源就可以添加附加功能。
为了实现上述目的,本发明提供一种基于自由表单的动态生成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 (7)

1.一种基于自由表单的动态生成web界面的方法,其特征在于,包括以下步骤:
步骤S1,定义页面级信息,至少包括关联的元数据、列表页面数据分页规则、列表页面数据默认排序规则;
步骤S2,定义字段级信息,至少包括中文名称、元素类型、输入类型、输入设定;
步骤S3,根据页面级信息,按照规则约束进行解析,动态渲染列表页面,并加载数据;
其中,列表页面加载步骤如下:
步骤S301,根据功能编号读取表单配置;
步骤S302,根据列表显示字段渲染列表分列;
步骤S303,根据查询表或试图加载业务数据;
步骤S304,根据每页显示数量进行分页处理;
步骤S305,根据字段的元素类型和输入类型渲染列控件;
步骤S306,根据输入设定初始化控件中的数据;
步骤S307,根据表单列表按钮初始化按钮;
步骤S308,完成列表界面加载;
步骤S4,根据字段级信息,自动渲染卡片页面,并加载数据;
步骤S5,根据输入规则,校验输入是否正确;
步骤S6,输出加载后的列表界面和列表界面。
2.如权利要求1所述的基于自由表单的动态生成web界面的方法,其特征在于,在步骤S3中,可根据自身业务自定义扩展类,实现Action接口,用于完成业务数据的保存、删除的特殊业务。
3.如权利要求1所述的基于自由表单的动态生成web界面的方法,其特征在于,所述列表页面还设置个性化按钮、查询按钮。
4.如权利要求1所述的基于自由表单的动态生成web界面的方法,其特征在于,在步骤S4中,卡片界面内还可以根据输入类型、输入设定,自动生成字段控件,字段控件至少包括下拉框、单选框、多选框。
5.如权利要求1所述的基于自由表单的动态生成web界面的方法,其特征在于,在步骤S5中,如果校验输入不正确,则提示重新输入,如果校验输入正确,则进入下一操作。
6.如权利要求1所述的基于自由表单的动态生成web界面的方法,其特征在于,在步骤S4中,卡片页面加载步骤如下:
步骤S401,根据功能编号读取表单配置;
步骤S402,根据卡片显示字段渲染详细页输入字段;
步骤S403,根据操作表查询业务数据;
步骤S404,根据字段的元素类型和输入类型渲染输入框的控件;
步骤S405,根据输入设定初始化控件中的数据;
步骤S406,根据是否只读控制输入项是否可编辑;
步骤S407,根据卡片是否为空控制输入项是否允许为空;
步骤S408,根据表单卡片按钮初始化按钮;
步骤S409,完成卡片界面加载。
7.如权利要求6所述的基于自由表单的动态生成web界面的方法,其特征在于,所述卡片页面加载是由双击列表数据后开始的。
CN201710305804.6A 2017-05-03 2017-05-03 一种基于自由表单的动态生成web界面的方法 Active CN107203595B (zh)

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 true CN107203595A (zh) 2017-09-26
CN107203595B 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)

Cited By (8)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN107886280A (zh) * 2017-11-29 2018-04-06 深圳市易达云科技有限公司 一种订单操作项智能过滤显示方法
CN108170706A (zh) * 2017-11-22 2018-06-15 链家网(北京)科技有限公司 一种信息采集页面生成方法及装置
CN109165266A (zh) * 2018-09-03 2019-01-08 中国平安人寿保险股份有限公司 表单生成方法、装置、计算机设备和存储介质
CN112004160A (zh) * 2020-07-15 2020-11-27 福建新大陆通信科技股份有限公司 一种基于按页列表控件的界面交互方法、设备及介质
CN112465620A (zh) * 2020-12-30 2021-03-09 广东金赋科技股份有限公司 基于动态表单与规则引擎的终端填单业务联动方法及装置
CN112711416A (zh) * 2020-12-31 2021-04-27 北方工业大学 一种app的界面定制化实现方法
CN113110315A (zh) * 2021-03-31 2021-07-13 深圳市法拉第电驱动有限公司 基于wpf的动态加载控件的上位机***及其控制方法
CN114356472A (zh) * 2021-12-03 2022-04-15 浙江臻善科技股份有限公司 一种***界面差别化动态渲染的方法

Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101241434A (zh) * 2008-03-04 2008-08-13 浪潮集团山东通用软件有限公司 表单自定义方法
US20120047426A1 (en) * 2009-05-05 2012-02-23 Suboti, Llc System, method and computer readable medium for recording authoring events with web page content
CN102737128A (zh) * 2012-06-20 2012-10-17 深圳市远行科技有限公司 一种基于浏览器的动态页面处理方法及装置
CN102789382A (zh) * 2012-06-28 2012-11-21 用友软件股份有限公司 用于表单生成和运行的***及方法
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
CN104732306A (zh) * 2013-12-19 2015-06-24 北京索为高科***技术有限公司 一种业务应用***的快速开发***及方法
CN104881490A (zh) * 2015-06-10 2015-09-02 中科宇图天下科技有限公司 一种web表单数据存取方法和***
CN105630502A (zh) * 2015-12-28 2016-06-01 武汉传神信息技术有限公司 一种生成动态表单的方法和***

Patent Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101241434A (zh) * 2008-03-04 2008-08-13 浪潮集团山东通用软件有限公司 表单自定义方法
US20120047426A1 (en) * 2009-05-05 2012-02-23 Suboti, Llc System, method and computer readable medium for recording authoring events with web page content
CN102737128A (zh) * 2012-06-20 2012-10-17 深圳市远行科技有限公司 一种基于浏览器的动态页面处理方法及装置
CN102789382A (zh) * 2012-06-28 2012-11-21 用友软件股份有限公司 用于表单生成和运行的***及方法
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
CN104732306A (zh) * 2013-12-19 2015-06-24 北京索为高科***技术有限公司 一种业务应用***的快速开发***及方法
CN104881490A (zh) * 2015-06-10 2015-09-02 中科宇图天下科技有限公司 一种web表单数据存取方法和***
CN105630502A (zh) * 2015-12-28 2016-06-01 武汉传神信息技术有限公司 一种生成动态表单的方法和***

Non-Patent Citations (4)

* Cited by examiner, † Cited by third party
Title
JOSÉ A. MACÍAS 等: "Customization of Web applications through an intelligent environment exploiting logical interface descriptions", 《IEEE》 *
基于模型驱动的WEB表单开发工具的设计与实现: "李洪营", 《中国优秀硕士学位论文全文数据库 信息科技辑》 *
王琛: "模板化的Web列表页面信息自动抽取方法的研究", 《现代计算机(普及版)》 *
舒红平 等: "基于JAVA的WEB页面自动生成***", 《成都信息工程学院学报》 *

Cited By (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108170706A (zh) * 2017-11-22 2018-06-15 链家网(北京)科技有限公司 一种信息采集页面生成方法及装置
CN107886280A (zh) * 2017-11-29 2018-04-06 深圳市易达云科技有限公司 一种订单操作项智能过滤显示方法
CN109165266A (zh) * 2018-09-03 2019-01-08 中国平安人寿保险股份有限公司 表单生成方法、装置、计算机设备和存储介质
CN112004160A (zh) * 2020-07-15 2020-11-27 福建新大陆通信科技股份有限公司 一种基于按页列表控件的界面交互方法、设备及介质
CN112004160B (zh) * 2020-07-15 2022-04-05 福建新大陆通信科技股份有限公司 一种基于按页列表控件的界面交互方法、设备及介质
CN112465620A (zh) * 2020-12-30 2021-03-09 广东金赋科技股份有限公司 基于动态表单与规则引擎的终端填单业务联动方法及装置
CN112465620B (zh) * 2020-12-30 2023-12-19 广东金赋科技股份有限公司 基于动态表单与规则引擎的终端填单业务联动方法及装置
CN112711416A (zh) * 2020-12-31 2021-04-27 北方工业大学 一种app的界面定制化实现方法
CN113110315A (zh) * 2021-03-31 2021-07-13 深圳市法拉第电驱动有限公司 基于wpf的动态加载控件的上位机***及其控制方法
CN114356472A (zh) * 2021-12-03 2022-04-15 浙江臻善科技股份有限公司 一种***界面差别化动态渲染的方法

Also Published As

Publication number Publication date
CN107203595B (zh) 2021-11-30

Similar Documents

Publication Publication Date Title
CN107203595A (zh) 一种基于自由表单的动态生成web界面的方法
CN102779040B (zh) 一种生成自定义表单的方法和装置
KR102007005B1 (ko) 데이터 목록을 이용하는 웹사이트 구축 디바이스, 시스템, 및 방법
CN105511873B (zh) 用户界面控件展示方法及装置
CN114035773B (zh) 一种基于配置的低代码开发表单方法、***及装置
US7581169B2 (en) Method and apparatus for form automatic layout
CN109408764B (zh) 页面区域划分方法、装置、计算设备和介质
US20050216834A1 (en) Method, apparatus, and computer-readable medium for dynamically rendering a user interface menu
CN101005681A (zh) 界面自动生成方法和界面自动生成***
CN104699681A (zh) 一种基于元数据库的数据处理方法
CN106021394A (zh) 一种网站的建站方法和装置
CN103777936B (zh) Erp表单的可变用户级视图的实现方法及装置
CN113535176A (zh) 一种页面生成方法及装置
CN113535165A (zh) 界面生成方法、装置、电子设备及计算机可读存储介质
US9779077B2 (en) Representation of data records in graphic tables
CN114239524A (zh) 问卷生成方法、装置、计算机设备及存储介质
CN114741079B (zh) 软件开发方法、平台、电子设备和计算机可读存储介质
CN115186643A (zh) 签报模板的自定义配置方法、装置、设备和存储介质
CN106886435A (zh) 微件的加载方法及装置
US9514249B2 (en) Re-arrangeable, and customizable access controllable data tree hierarchies, and methods of use thereof
TWI677822B (zh) 網頁介面管理系統、方法及可讀存儲介質
CN116051061A (zh) 信息处理方法、装置、电子设备及可读存储介质
CN110968311A (zh) 前端页面构建方法、装置及电子设备
CN114692581A (zh) 电子表单子表显示方法、装置、设备以及存储介质
WO2016133153A2 (ja) 情報管理装置並びにファイル管理方法

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