CN113760282A - 表单界面的配置方法、装置、设备、介质及程序产品 - Google Patents

表单界面的配置方法、装置、设备、介质及程序产品 Download PDF

Info

Publication number
CN113760282A
CN113760282A CN202110130620.7A CN202110130620A CN113760282A CN 113760282 A CN113760282 A CN 113760282A CN 202110130620 A CN202110130620 A CN 202110130620A CN 113760282 A CN113760282 A CN 113760282A
Authority
CN
China
Prior art keywords
target
interface
user
instruction
configuring
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.)
Pending
Application number
CN202110130620.7A
Other languages
English (en)
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 Jingdong Tuoxian Technology Co Ltd
Original Assignee
Beijing Jingdong Tuoxian 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 Jingdong Tuoxian Technology Co Ltd filed Critical Beijing Jingdong Tuoxian Technology Co Ltd
Priority to CN202110130620.7A priority Critical patent/CN113760282A/zh
Publication of CN113760282A publication Critical patent/CN113760282A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/34Graphical or visual programming

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • General Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请提供了一种表单界面的配置方法、装置、设备、介质及程序产品,通过响应于用户对表单自助设计系统的操作指令,根据操作指令从待选元素集中确定目标表单元素,然后按目标展示样式对目标表单元素进行拼装组合,以确定目标表单,该目标表单用于对目标信息进行采集或展示。实现了用户不用依靠开发人员,直接利用表单自助设计系统来获取目标表单,解决了现有技术的表单配置模式存在流程繁琐重复,开发效率低,开发周期长,无法满足终端用户的及时性需求的技术问题。达到了所见即所得,快速获取目标表单的技术效果,并且还大大提高了表单开发的效率。

Description

表单界面的配置方法、装置、设备、介质及程序产品
技术领域
本申请涉及计算机数据处理领域,尤其涉及一种数表单界面的配置方法、装置、设备、介质及程序产品。
背景技术
应用程序开发一般分为前端开发和后端开发两个部分,前端开发时经常会遇到表单界面的开发需求。表单是由基础的表单元素组合而成的,如文本框、单选框、下拉框等。
目前,现有的表单界面开发都是先收集终端用户的使用需求,然后将使用需求撰写成产品需求文档,交给前端开发人员进行相关代码工作的开发,最后经过测试人员的测试,才最终得到终端用户想要的目标表单。
但是,由于不同的终端用户存在着大量不同的需求,现有技术的表单配置模式存在流程繁琐重复,开发效率低,开发周期长,无法满足终端用户的及时性需求的技术问题。
发明内容
本申请提供一种表单界面的配置方法、装置、设备、介质及程序产品,让终端用户能够通过表单自助设计系统,自主根据自身需求快速获得目标表单,无需程序员和测试员的参与,以解决现有技术的表单配置模式存在流程繁琐重复,开发效率低,开发周期长,无法满足终端用户的及时性需求的技术问题。
第一个方面,本申请提供一种表单界面的配置方法,应用于表单自助设计系统,所述表单自助设计系统用于通过图形化设计界面构建表单,无需用户编写代码,该配置方法包括:
响应于用户对所述表单自助设计系统的操作指令,根据所述操作指令从待选元素集中确定目标表单元素;
按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,所述目标表单用于对目标信息进行采集或展示。
在一种可能的设计中,所述目标展示样式包括:空白样式,所述空白样式的设计界面为空白,所述按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,包括:
响应于用户的拖拽指令,将各个所述目标表单元素放置到所述空白设计界面的各个位置上;
响应于用户的属性编辑指令,根据所述属性编辑指令设置各个所述目标表单元素的属性值,以确定所述目标表单的最终展示样式,所述属性值包括:元素标题、提示文本、限制条件、是否必填。
在一种可能的设计中,所述目标展示样式包括:预设样式,所述按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,包括:
将各个所述目标表单元素放置到所述预设样式的各个预设位置上;
响应于用户的位置调整指令,根据所述位置调整指令将第一表单元素从第一预设位置移动到第二预设位置,所述目标表单元素包括至少一个所述第一表单元素;
响应于用户的属性编辑指令,根据所述属性编辑指令设置各个所述目标表单元素的属性值,以确定所述目标表单的最终展示样式,所述属性值包括:元素标题、提示文本、限制条件、是否必填。
可选的,在所述响应于用户对所述表单自助设计系统的操作指令之前,还包括:
响应于对所述目标信息的采集指令或展示指令,将所述目标信息拆分成多个数据单元;
从表单元素库中筛选出与所述数据单元对应的待选元素集,并将所述待选元素集展示在所述表单自助设计系统的工具栏上;
对应的,所述对所述表单自助设计系统的操作指令为用户对所述工具栏的操作指令。
在一种可能的设计中,所述表单元素库中的表单元素包括:基础表单元素以及自定义表单元素,所述基础表单元素包括:输入组件、选择组件以及文件上传组件,所述自定义表单元素为多个所述基础表单元素按预设形式组织的集合;
所述输入组件用于收集需要用户填写的内容信息,所述内容信息包括:文本、数字或者文本与数字的组合内容;
所述选择组件用于收集用户对预设内容的分类选择;
所述文件上传组件用于收集以预设文件格式存储的大量数据信息。
可选的,所述输入组件包括:单行文本框、多行文本框、密码框。
在一种可能的设计中,所述选择组件包括:复选框、单选框、下拉选择框。
可选的,所述文件上传组件包括文件上传对话框。
在一种可能的设计中,所述基础表单元素还包括隐藏域,所述隐藏域的作用包括:收集所述目标表单的使用者在填写所述目标表单时的操作行为信息。
在一种可能的设计中,该配置方法还包括:
通过预览界面实时显示所述设计界面在预设使用环境中的最终展示效果。
在一种可能的设计中,该配置方法还包括:
响应于用户的生成指令,确定所述目标表单的统一资源定位URL地址;
将所述URL地址配置到应用程序前端界面的菜单栏模块上。
第二个方面,本申请提供一种表单自助设计系统,包括:表单元素库以及设计界面,所述表单元素库用于存储各种不同类型的表单元素,所述设计界面用于给用户提供图形化的自助设计界面,以实现第一方面中任意一种可能的表单界面的配置方法
第三方面,本申请提供一种表单界面的配置装置,包括:
获取模块,用于获取用户对所述表单自助设计系统的操作指令;
处理模块,用于响应于所述操作指令,根据所述操作指令从待选元素集中确定目标表单元素;
所述处理模块,还用于按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,所述目标表单用于对目标信息进行采集。
在一种可能的设计中,所述目标展示样式包括:空白样式,所述空白样式的设计界面为空白,所述处理模块,还用于按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,包括:
所述处理模块,还用于响应于用户的拖拽指令,将各个所述目标表单元素放置到所述空白设计界面的各个位置上;
所述处理模块,还用于响应于用户的属性编辑指令,根据所述属性编辑指令设置各个所述目标表单元素的属性值,以确定所述目标表单的最终展示样式,所述属性值包括:元素标题、提示文本、限制条件、是否必填。
在一种可能的设计中,所述目标展示样式包括:预设样式,所述处理模块,还用于按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,包括:
所述处理模块,还用于将各个所述目标表单元素放置到所述预设样式的各个预设位置上;
所述处理模块,还用于响应于用户的位置调整指令,根据所述位置调整指令将第一表单元素从第一预设位置移动到第二预设位置,所述目标表单元素包括至少一个所述第一表单元素;
所述处理模块,还用于响应于用户的属性编辑指令,根据所述属性编辑指令设置各个所述目标表单元素的属性值,以确定所述目标表单的最终展示样式,所述属性值包括:元素标题、提示文本、限制条件、是否必填。
可选的,在所述获取模块,用于获取用户对所述表单自助设计系统的操作指令之前,还包括:
所述获取模块,还用于获取对所述目标信息的采集指令或展示指令;
所述处理模块,还用于根据所述采集指令或展示指令,将所述目标信息拆分成多个数据单元;
所述处理模块,还用于从表单元素库中筛选出与所述数据单元对应的待选元素集,并将所述待选元素集展示在所述表单自助设计系统的工具栏上;
对应的,所述对所述表单自助设计系统的操作指令为用户对所述工具栏的操作指令。
在一种可能的设计中,所述表单元素库中的表单元素包括:基础表单元素以及自定义表单元素,所述基础表单元素包括:输入组件、选择组件以及文件上传组件,所述自定义表单元素为多个所述基础表单元素按预设形式组织的集合;
所述输入组件用于收集需要用户填写的内容信息,所述内容信息包括:文本、数字或者文本与数字的组合内容;
所述选择组件用于收集用户对预设内容的分类选择;
所述文件上传组件用于收集以预设文件格式存储的大量数据信息。
可选的,所述输入组件包括:单行文本框、多行文本框、密码框。
在一种可能的设计中,所述选择组件包括:复选框、单选框、下拉选择框。
可选的,所述文件上传组件包括文件上传对话框。
在一种可能的设计中,所述基础表单元素还包括隐藏域,所述隐藏域的作用包括:收集所述目标表单的使用者在填写所述目标表单时的操作行为信息。
在一种可能的设计中,该配置装置还包括:
实时展示模块,用于通过预览界面实时显示所述设计界面在预设使用环境中的最终展示效果。
在一种可能的设计中,该配置装置还包括:
所述获取模块,还用于获取用户的生成指令,
所述处理模块,还用于根据所述生成指令确定所述目标表单的统一资源定位URL地址;
所述处理模块,还用于将所述URL地址配置到应用程序前端界面的菜单栏模块上。
第四个方面,本申请提供一种电子设备,包括:
存储器,用于存储程序指令;
处理器,用于调用并执行所述存储器中的程序指令,执行第一方面所提供的任意一种可能的表单界面的配置方法。
第五个方面,本申请提供一种存储介质,所述可读存储介质中存储有计算机程序,所述计算机程序用于执行第一方面所提供的任意一种可能的表单界面的配置方法。
第六方面,本申请还提供一种计算机程序产品,包括计算机程序,该计算机程序被处理器执行时实现第一方面所提供的任意一种可能的表单界面的配置方法。
本申请提供了一种表单界面的配置方法、装置、设备、介质及程序产品,通过响应于用户对表单自助设计系统的操作指令,根据操作指令从待选元素集中确定目标表单元素,然后按目标展示样式对目标表单元素进行拼装组合,以确定目标表单,该目标表单用于对目标信息进行采集或展示。实现了用户不用依靠开发人员,直接利用表单自助设计系统来获取目标表单,解决了现有技术的表单配置模式存在流程繁琐重复,开发效率低,开发周期长,无法满足终端用户的及时性需求的技术问题。达到了所见即所得,快速获取目标表单的技术效果,并且还大大提高了表单开发的效率。
附图说明
为了更清楚地说明本申请或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图是本申请的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动性的前提下,还可以根据这些附图获得其他的附图。
图1为本申请提供的表单自助设计系统示意图;
图2为本申请提供的一种表单界面的配置方法的流程示意图;
图3a-3c为本申请提供的目标表单元素从位置布局到属性值设置的应用场景示意图;
图4为本申请提供的另一种表单界面的配置方法的流程示意图;
图5为本申请提供的一种预览界面的示意图;
图6为本申请提供的一种表单界面的配置装置的结构示意图;
图7为本申请提供的一种电子设备的结构示意图。
具体实施方式
为使本申请实施例的目的、技术方案和优点更加清楚,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,包括但不限于对多个实施例的组合,都属于本申请保护的范围。
本申请的说明书和权利要求书及上述附图中的术语“第一”、“第二”、“第三”、“第四”等(如果存在)是用于区别类似的对象,而不必用于描述特定的顺序或先后次序。应该理解这样使用的数据在适当情况下可以互换,以便这里描述的本申请的实施例例如能够以除了在这里图示或描述的那些以外的顺序实施。此外,术语“包括”和“具有”以及他们的任何变形,意图在于覆盖不排他的包含,例如,包含了一系列步骤或单元的过程、方法、系统、产品或设备不必限于清楚地列出的那些步骤或单元,而是可包括没有清楚地列出的或对于这些过程、方法、产品或设备固有的其它步骤或单元。
前端开发工程师在工作中经常会遇到表单界面的开发需求,整个表单界面的核心开发工作是表单组件的构建和每个元素的校验。现有的表单界面开发模式是先收集终端用户的使用需求,然后将使用需求撰写成产品需求文档,交给前端开发人员进行相关代码工作的开发,最后经过测试人员的测试,才最终得到终端用户想要的目标表单。
但是,由于不同的终端用户存在着大量不同的需求,现有技术的表单配置模式存在流程繁琐重复,开发效率低,开发周期长,无法满足终端用户的及时性需求的技术问题。
为解决上述问题,本申请的发明构思是:
本申请发明人经过长期实践发现,基础表单元素的功能比较完善和固定,比如“文本输入框”、“下拉选择框”、“单选框”、“多选框”、“日期选择”、“判定框”等几种基础的表单元素在表单构建中使用的概率就比较频繁,而表单的校验也脱离不了“必填”、“非必填”、“字数限制”、“格式限时”等几种限制条件。前端开发人员惯性思维都是将之前写过的表单开发相关代码进行复制,然后再根据当前的产品需求文档进行调整。本申请发明人打破了这种惯用手段,直接将基础表单元素以及在之前已经积累的表单模块都存储在表单元素库中,终端用户只需要在设计界面上按自身需求进行拼装组合,或者说是对各个表单元素进行布局,然后调整表单元素的属性,经过表单自助设计系统自动生成相关的代码,即可形成一个新的表单模块,再将此表单模块链接到前端页面的菜单栏中即可完成新表单的设计。方便快捷,还省去了中间提需求文档,等待开发和测试的时间,大大提高了表单开发的效率,并且还有效避免了程序开发人员与终端用户理解上的偏差而造成的反复修改。
下面具体解释本申请提供的表单界面的配置方法及表单自助设计系统。
图1为本申请提供的表单自助设计系统示意图。如图1所示,该表单自助设计系统,包括:操作工具栏10和设计界面20,其中操作工具栏10中还包括:表单元素库101、表单模块生成按钮102和自定义元素生成按钮103。
表单元素库101用于存储各种不同类型的表单元素,并以图形化的形式展示出来,设计界面20用于给用户提供图形化的自助设计界面。用户只需要将表单元素从表单元素库中添加到自助设计界面上,然后再调整各个表单元素的位置,显示属性等信息,最后点击表单模块生成按钮102即可得到一个新的表单模块。
下面结合附图来对本申请提供的表单界面的配置方法的详细步骤进行介绍。
图2为本申请提供的一种表单界面的配置方法的流程示意图。如图2所示,该表单界面的配置方法的具体步骤,包括:
S201、获取用户对表单自助设计系统的操作指令。
在本步骤中,用户先创建一个空白设计界面,或者是选择预设的表单样式创建新的设计界面。然后到操作工具栏10中打开表单元素库101,进行表单元素的选择。
S202、根据操作指令从待选元素集中确定目标表单元素。
在本步骤中,用户在图1所示的表单自助设计系统的表单元素库101中选择需要的表单元素,如:文本框、单选框、复选框、日期框等。
具体的,用户将所需要的表单元素一一选中,在选中时,可以设置同一个表单元素所需要的数量,如选中了文本框,弹出对话框,设置添加的数量,如3个。
在一种可能的设计中,用户可以先将表单元素放入到表单元素篮中,待选完后,再一次性地将所选中的元素添加到设计界面20中。这样就可以减少多次打开表单元素库101的操作步骤。
需要说明的是,待选元素集可以是表单元素库101中的所有表单元素,也可以是经过分类后的一部分表单元素。例如,将表单元素库中的表单元素分成了:基础表单元素和自定义表单元素。基础表单元素包括:输入组件、选择组件以及文件上传组件等。输入组件用于收集需要用户填写的内容信息,所述内容信息包括:文本、数字或者文本与数字的组合内容,如文本框、密码框等;选择组件用于收集用户对预设内容的分类选择,如单选框和复选框等;文件上传组件用于收集以预设文件格式存储的大量数据信息。
S203、按目标展示样式对目标表单元素进行拼装组合,以确定目标表单。
在本步骤中,目标表单用于对目标信息进行采集或展示。
具体的,用户可以通过点击或拖拽的操作方式,将表单元素放置到设计界面20上,而设计界面20可以是一个空白的设计界面,也可以是带有预设样式的设计界面。
当目标展示样式包括空白样式,即设计界面为空白时,具体步骤为:
首先,响应于用户的拖拽指令,将各个目标表单元素放置到空白设计界面的各个位置上;
其次,响应于用户的属性编辑指令,根据属性编辑指令设置各个目标表单元素的属性值,以确定目标表单的最终展示样式,属性值包括:元素标题、提示文本、限制条件、是否必填。
需要说明的是,空白样式时,用户需要对各个目标表单元素的位置进行排布布局,然后再设置目标表单元素的属性值。
当目标展示样式包括预设样式时,具体步骤包括:
首先,将各个目标表单元素放置到预设样式的各个预设位置上;
然后,响应于用户的位置调整指令,根据位置调整指令将第一表单元素从第一预设位置移动到第二预设位置,目标表单元素包括至少一个第一表单元素;
最后,响应于用户的属性编辑指令,根据属性编辑指令设置各个目标表单元素的属性值,以确定目标表单的最终展示样式,属性值包括:元素标题、提示文本、限制条件、是否必填。
图3a-3c为本申请提供的目标表单元素从位置布局到属性值设置的应用场景示意图。图3a待选表单元素集或者是表单元素库的样例。图3b为用户将目标表单元素拖拽到设计界面的样例,图3b左半边为设计界面,图3b右半边为待选表单元素集。图3c为用户通过属性配置界面下达属性编辑指令的示意图,如业务方即终端用户选择了文本框表单元素,然后对文本框的属性进行配置,包括:
配置标题:用户想要采集或展示的数据,如:姓名、年龄、毕业学校等;
表单元素提示文案:用户想要采集数据的详细说明,如:请输入最高学历毕业学校;
元素限制条件:收集数据的格式限时,如:格式限制(数字格式、邮箱格式等)、长度限制(大于6个字符、小于10个字符等);
是否必填:设置用户是否必须填写,即表单元素的值是否可以为空。
本实施例提供了一种表单界面的配置方法,通过响应于用户对表单自助设计系统的操作指令,根据操作指令从待选元素集中确定目标表单元素,然后按目标展示样式对目标表单元素进行拼装组合,以确定目标表单,该目标表单用于对目标信息进行采集或展示。实现了用户不用依靠开发人员,直接利用表单自助设计系统来获取目标表单,解决了现有技术的表单配置模式存在流程繁琐重复,开发效率低,开发周期长,无法满足终端用户的及时性需求的技术问题。达到了所见即所得,快速获取目标表单的技术效果,并且还大大提高了表单开发的效率。
图4为本申请提供的另一种表单界面的配置方法的流程示意图。如图4所示,该表单界面的配置方法的具体步骤包括:
S401、获取用户对目标信息的采集指令或展示指令。
在本实施例中,目标表单的设计是围绕着目标信息来展开的,根据对目标信息是采集还是展示,会对应不同的表单结构样式。因此,要设计一个表单就需要先明确对目标信息是采集还是展示。
具体的,用户通过输入或导入对目标信息的需求,即采集需求或展示需求,通过表单自助设计系统来输入采集指令或展示指令。
S402、根据采集指令或展示指令,将目标信息拆分成多个数据单元。
在本步骤中,目标信息对应多个数据单元,比如:学生身份信息对应着:姓名、年龄、学校、年级、专业、照片、指导老师等。因此,需要利用信息拆分模型,或者是在专门的目标信息拆分界面,通过用户的手动设定,来确定拆分出来的数据单元。
S403、从表单元素库中筛选出与数据单元对应的待选元素集。
在本步骤中,每一种数据单元对应一种或多种表单元素,比如:年级这个数据单元,可以通过文本框来采集或展示,也可以通过下拉选择框来采集,或者是通过多个单选框来展示或采集。因此,表单自助设计系统,将数据单元所对应的表单元素从表单元素库中调取出来。
在本实施例中,表单元素库中的表单元素包括:基础表单元素以及自定义表单元素,所述基础表单元素包括:输入组件、选择组件以及文件上传组件,所述自定义表单元素为多个所述基础表单元素按预设形式组织的集合;
所述输入组件用于收集需要用户填写的内容信息,所述内容信息包括:文本、数字或者文本与数字的组合内容;
所述选择组件用于收集用户对预设内容的分类选择;
所述文件上传组件用于收集以预设文件格式存储的大量数据信息。
可选的,所述输入组件包括:单行文本框、多行文本框、密码框等。
所述选择组件包括:复选框、单选框、下拉选择框等。
所述文件上传组件包括文件上传对话框。
S404、将待选元素集展示在表单自助设计系统的工具栏上。
在本步骤中,将上一步从表单元素库中选出的待选元素集显示到工具栏上。这样就避免了在自定义表单元素很多时,给用户展示所有表单元素,会使得用户查找目标表单元素困难。使得表单自助设计系统的工具栏更加简洁易用,提高用户自助设计的可操作性。
S405、获取用户对工具栏的操作指令。
S406、根据操作指令从待选元素集中确定目标表单元素。
在本步骤中,用户从工具栏中选择所需要的目标表单元素,拖拽到设计界面上。
在一种可能的设计中,基础表单元素还包括隐藏域,所述隐藏域的作用包括:收集所述目标表单的使用者在填写所述目标表单时的操作行为信息。
具体的,隐藏域在页面中对于用户是不可见的,在表单中插入隐藏域的目的在于收集或发送信息,以利于被处理表单的程序所使用。浏览者单击发送按钮发送表单的时候,隐藏域的信息也被一起发送到服务器。
在一种可能的设计中,要给表单使用用户一信息,使其在提交表单时,同时将此信息提交上来以确定用户身份,如sessionkey时段关键字等。这部分信息在现有技术中一般用cookie实现,但使用隐藏域比使用cookie来实现要简便,而且不会出现浏览器不支持的问题,也可以避免用户禁用cookie而导致这部分信息无法采集的问题。
在一种可能的设计中,一个form表单里有多个提交按钮,为了使得后台程序区分清楚用户到底是按那一个按钮提交上来的信息,就可以写一个隐藏域,然后在每一个按钮处加上onclick="document.form.command.value="xx"",然后在接到数据后先检查command的值就会知道用户是按的那个按钮提交上来的信息。
在一种可能的设计中,一个网页中有多个form表单,显然多个form表格是不能同时提交的,但有时这些form表单确实存在着相互作用或关联,此时就可以通过在form表格中添加隐藏域来使各个表单联系起来。
并且,由于javascript不支持全局变量,但有时又必须用到全局变量,此时就可以把值先存在隐藏域里,这样它的值就不会丢失了。
S407、通过预览界面实时显示设计界面在预设使用环境中的最终展示效果。
需要说明的是,S407与S406和S408并没有顺序限制的要求,在用户进入表单自助设计系统后,可以自行打开预设环境的展示效果界面,如在安卓手机端或PC电脑的浏览器端的展示效果。可以理解的是,预设环境的数量可以为多个,这样就可以同时观察设计的表单在多个平台上的使用效果,提高表单模块的通用性。
图5为本申请提供的一种预览界面的示意图。如图5所示,左半边为设计界面,右半边为在手机端的APP应用程序上的展示效果图。通过实时展示最终效果,能够辅助非程序员的用户及时发现表单元素的选择或属性设置或位置布局上的缺陷,并及时修改更正。
S408、按目标展示样式对目标表单元素进行拼装组合,以确定目标表单。
在本步骤中,目标展示样式包括:空白样式和预设样式。这两种样式的具体步骤,参考图2中S203步骤的介绍,在此不再赘述。
需要说明的是,对于预设样式,导入到预设样式中的目标表单元素的数量可以少于预设样式中表单元素的数量,用户可以调整目标表单元素的位置。没有导入目标表单元素的位置,在最终展示时不显示,或者显示空白。
可以理解的是,目标表单元素的数量也可以多于预设样式,或者也可以更换预设样式中的表单元素类型。这就给用户基于预设样式进行个性化改造提供了便利。
S409、响应于用户的生成指令,确定目标表单的统一资源定位URL地址。
在本步骤中,用户点击了表单自助设计系统的生成表单模块按钮后,可以手动输入新建的表单模块的识别编码ID,或者由表单自助设计系统自动分配识别编码ID。
然后自动生成新建表单模块对应的封装代码程序,并确定目标表单的统一资源定位URL地址。
S410、将URL地址配置到应用程序前端界面的菜单栏模块上。
在本步骤中,程序开发人员只需要将URL地址配置到需要应用目标表单的应用程序的前端界面上,并绑定在对应的菜单栏模块上或者是页面上,即可实现对目标表单的应用。
本实施例提供了一种表单界面的配置方法,通过响应于用户对表单自助设计系统的操作指令,根据操作指令从待选元素集中确定目标表单元素,然后按目标展示样式对目标表单元素进行拼装组合,以确定目标表单,该目标表单用于对目标信息进行采集或展示。实现了用户不用依靠开发人员,直接利用表单自助设计系统来获取目标表单,解决了现有技术的表单配置模式存在流程繁琐重复,开发效率低,开发周期长,无法满足终端用户的及时性需求的技术问题。达到了所见即所得,快速获取目标表单的技术效果,并且还大大提高了表单开发的效率。
图6为本申请提供的一种表单界面的配置装置的结构示意图。该表单界面的配置装置600可以通过软件、硬件或者两者的结合实现。
如图6所示,该表单界面的配置装置600包括:
获取模块601,用于获取用户对所述表单自助设计系统的操作指令;
处理模块602,用于响应于所述操作指令,根据所述操作指令从待选元素集中确定目标表单元素;
所述处理模块602,还用于按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,所述目标表单用于对目标信息进行采集。
在一种可能的设计中,所述目标展示样式包括:空白样式,所述空白样式的设计界面为空白,所述处理模块602,还用于按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,包括:
所述处理模块602,还用于响应于用户的拖拽指令,将各个所述目标表单元素放置到所述空白设计界面的各个位置上;
所述处理模块602,还用于响应于用户的属性编辑指令,根据所述属性编辑指令设置各个所述目标表单元素的属性值,以确定所述目标表单的最终展示样式,所述属性值包括:元素标题、提示文本、限制条件、是否必填。
在一种可能的设计中,所述目标展示样式包括:预设样式,所述处理模块602,还用于按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,包括:
所述处理模块602,还用于将各个所述目标表单元素放置到所述预设样式的各个预设位置上;
所述处理模块602,还用于响应于用户的位置调整指令,根据所述位置调整指令将第一表单元素从第一预设位置移动到第二预设位置,所述目标表单元素包括至少一个所述第一表单元素;
所述处理模块602,还用于响应于用户的属性编辑指令,根据所述属性编辑指令设置各个所述目标表单元素的属性值,以确定所述目标表单的最终展示样式,所述属性值包括:元素标题、提示文本、限制条件、是否必填。
可选的,在所述获取模块601,用于获取用户对所述表单自助设计系统的操作指令之前,还包括:
所述获取模块601,还用于获取对所述目标信息的采集指令或展示指令;
所述处理模块602,还用于根据所述采集指令或展示指令,将所述目标信息拆分成多个数据单元;
所述处理模块602,还用于从表单元素库中筛选出与所述数据单元对应的待选元素集,并将所述待选元素集展示在所述表单自助设计系统的工具栏上;
对应的,所述对所述表单自助设计系统的操作指令为用户对所述工具栏的操作指令。
在一种可能的设计中,所述表单元素库中的表单元素包括:基础表单元素以及自定义表单元素,所述基础表单元素包括:输入组件、选择组件以及文件上传组件,所述自定义表单元素为多个所述基础表单元素按预设形式组织的集合;
所述输入组件用于收集需要用户填写的内容信息,所述内容信息包括:文本、数字或者文本与数字的组合内容;
所述选择组件用于收集用户对预设内容的分类选择;
所述文件上传组件用于收集以预设文件格式存储的大量数据信息。
可选的,所述输入组件包括:单行文本框、多行文本框、密码框。
在一种可能的设计中,所述选择组件包括:复选框、单选框、下拉选择框。
可选的,所述文件上传组件包括文件上传对话框。
在一种可能的设计中,所述基础表单元素还包括隐藏域,所述隐藏域的作用包括:收集所述目标表单的使用者在填写所述目标表单时的操作行为信息。
在一种可能的设计中,该配置装置600还包括:
实时展示模块603,用于通过预览界面实时显示所述设计界面在预设使用环境中的最终展示效果。
在一种可能的设计中,该配置装置600还包括:
所述获取模块601,还用于获取用户的生成指令,
所述处理模块602,还用于根据所述生成指令确定所述目标表单的统一资源定位URL地址;
所述处理模块602,还用于将所述URL地址配置到应用程序前端界面的菜单栏模块上。
值得说明的是,图6所示实施例提供的表单界面的配置装置,可以执行上述任一方法实施例中所提供的方法,其具体实现原理、技术特征、专业名词解释以及技术效果类似,在此不再赘述。
图7为本申请提供的一种电子设备的结构示意图。如图7所示,该电子设备700,可以包括:至少一个处理器701和存储器702。图7示出的是以一个处理器为例的电子设备。
存储器702,用于存放程序。具体地,程序可以包括程序代码,程序代码包括计算机操作指令。
存储器702可能包含高速RAM存储器,也可能还包括非易失性存储器(non-volatile memory),例如至少一个磁盘存储器。
处理器701用于执行存储器702存储的计算机执行指令,以实现以上各方法实施例所述的方法。
其中,处理器701可能是一个中央处理器(central processing unit,简称为CPU),或者是特定集成电路(application specific integrated circuit,简称为ASIC),或者是被配置成实施本申请实施例的一个或多个集成电路。
可选地,存储器702既可以是独立的,也可以跟处理器701集成在一起。当所述存储器702是独立于处理器701之外的器件时,所述电子设备700,还可以包括:
总线703,用于连接所述处理器701以及所述存储器702。总线可以是工业标准体系结构(industry standard architecture,简称为ISA)总线、外部设备互连(peripheralcomponent,PCI)总线或扩展工业标准体系结构(extended industry standardarchitecture,EISA)总线等。总线可以分为地址总线、数据总线、控制总线等,但并不表示仅有一根总线或一种类型的总线。
可选的,在具体实现上,如果存储器702和处理器701集成在一块芯片上实现,则存储器702和处理器701可以通过内部接口完成通信。
本申请还提供了一种计算机可读存储介质,该计算机可读存储介质可以包括:U盘、移动硬盘、只读存储器(read-only memory,ROM)、随机存取存储器(random accessmemory,RAM)、磁盘或者光盘等各种可以存储程序代码的介质,具体的,该计算机可读存储介质中存储有程序指令,程序指令用于上述各方法实施例中的方法。
本申请还提供一种计算机程序产品,包括计算机程序,该计算机程序被处理器执行时实现上述各方法实施例中的方法。
最后应说明的是:以上各实施例仅用以说明本申请的技术方案,而非对其限制;尽管参照前述各实施例对本申请进行了详细的说明,本领域的普通技术人员应当理解:其依然可以对前述各实施例所记载的技术方案进行修改,或者对其中部分或者全部技术特征进行等同替换;而这些修改或者替换,并不使相应技术方案的本质脱离本申请各实施例技术方案的范围。

Claims (16)

1.一种表单界面的配置方法,其特征在于,应用于表单自助设计系统,所述表单自助设计系统用于通过图形化设计界面构建表单,而无需用户编写代码,所述配置方法包括:
响应于用户对所述表单自助设计系统的操作指令,根据所述操作指令从待选元素集中确定目标表单元素;
按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,所述目标表单用于对目标信息进行采集或展示。
2.根据权利要求1所述的表单界面的配置方法,其特征在于,所述目标展示样式包括:空白样式,所述空白样式的设计界面为空白,所述按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,包括:
响应于用户的拖拽指令,将各个所述目标表单元素放置到所述空白设计界面的各个位置上;
响应于用户的属性编辑指令,根据所述属性编辑指令设置各个所述目标表单元素的属性值,以确定所述目标表单的最终展示样式,所述属性值包括:元素标题、提示文本、限制条件、是否必填。
3.根据权利要求1所述的表单界面的配置方法,其特征在于,所述目标展示样式包括:预设样式,所述按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,包括:
将各个所述目标表单元素放置到所述预设样式的各个预设位置上;
响应于用户的位置调整指令,根据所述位置调整指令将第一表单元素从第一预设位置移动到第二预设位置,所述目标表单元素包括至少一个所述第一表单元素;
响应于用户的属性编辑指令,根据所述属性编辑指令设置各个所述目标表单元素的属性值,以确定所述目标表单的最终展示样式,所述属性值包括:元素标题、提示文本、限制条件、是否必填。
4.根据权利要求1-3中任意一项所述的表单界面的配置方法,其特征在于,在所述响应于用户对所述表单自助设计系统的操作指令之前,还包括:
响应于对所述目标信息的采集指令或展示指令,将所述目标信息拆分成多个数据单元;
从表单元素库中筛选出与所述数据单元对应的待选元素集,并将所述待选元素集展示在所述表单自助设计系统的工具栏上;
对应的,所述对所述表单自助设计系统的操作指令为用户对所述工具栏的操作指令。
5.根据权利要求4所述的表单界面的配置方法,其特征在于,所述表单元素库中的表单元素包括:基础表单元素以及自定义表单元素,所述基础表单元素包括:输入组件、选择组件以及文件上传组件,所述自定义表单元素为多个所述基础表单元素按预设形式组织的集合;
所述输入组件用于收集需要用户填写的内容信息,所述内容信息包括:文本、数字或者文本与数字的组合内容;
所述选择组件用于收集用户对预设内容的分类选择;
所述文件上传组件用于收集以预设文件格式存储的大量数据信息。
6.根据权利要求5所述的表单界面的配置方法,其特征在于,所述输入组件包括:单行文本框、多行文本框、密码框。
7.根据权利要求5所述的表单界面的配置方法,其特征在于,所述选择组件包括:复选框、单选框、下拉选择框。
8.根据权利要求5所述的表单界面的配置方法,其特征在于,所述文件上传组件包括文件上传对话框。
9.根据权利要求5所述的表单界面的配置方法,其特征在于,所述基础表单元素还包括隐藏域,所述隐藏域的作用包括:收集所述目标表单的使用者在填写所述目标表单时的操作行为信息。
10.根据权利要求4所述的表单界面的配置方法,其特征在于,还包括:
通过预览界面实时显示所述设计界面在预设使用环境中的最终展示效果。
11.根据权利要求10所述的表单界面的配置方法,其特征在于,还包括:
响应于用户的生成指令,确定所述目标表单的统一资源定位URL地址;
将所述URL地址配置到应用程序前端界面的菜单栏模块上。
12.一种表单自助设计系统,其特征在于,包括:表单元素库以及设计界面,所述表单元素库用于存储各种不同类型的表单元素,所述设计界面用于给用户提供图形化的自助设计界面,以实现权利要求1-10中任意一项所述的表单界面的配置方法。
13.一种表单界面的配置装置,其特征在于,包括:
获取模块,用于获取用户对所述表单自助设计系统的操作指令;
处理模块,用于响应于所述操作指令,根据所述操作指令从待选元素集中确定目标表单元素;
所述处理模块,还用于按目标展示样式对所述目标表单元素进行拼装组合,以确定目标表单,所述目标表单用于对目标信息进行采集。
14.一种电子设备,其特征在于,包括:
处理器;以及,
存储器,用于存储所述处理器的计算机程序;
其中,所述处理器配置为经由执行所述计算机程序来执行权利要求1至11任一项所述的表单界面的配置方法。
15.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至11任一项所述的表单界面的配置方法。
16.一种计算机程序产品,包括计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至11任一项所述的表单界面的配置方法。
CN202110130620.7A 2021-01-29 2021-01-29 表单界面的配置方法、装置、设备、介质及程序产品 Pending CN113760282A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202110130620.7A CN113760282A (zh) 2021-01-29 2021-01-29 表单界面的配置方法、装置、设备、介质及程序产品

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202110130620.7A CN113760282A (zh) 2021-01-29 2021-01-29 表单界面的配置方法、装置、设备、介质及程序产品

Publications (1)

Publication Number Publication Date
CN113760282A true CN113760282A (zh) 2021-12-07

Family

ID=78786540

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202110130620.7A Pending CN113760282A (zh) 2021-01-29 2021-01-29 表单界面的配置方法、装置、设备、介质及程序产品

Country Status (1)

Country Link
CN (1) CN113760282A (zh)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114357959A (zh) * 2021-12-17 2022-04-15 深圳市金证前海金融科技有限公司 表单编辑方法、装置、设备及存储介质
CN114546205A (zh) * 2022-04-26 2022-05-27 北京金堤科技有限公司 对展示信息进行编辑的方法和装置
CN115221849A (zh) * 2022-07-12 2022-10-21 平安科技(深圳)有限公司 一种报表填充方法、计算机设备及存储介质
CN115983216A (zh) * 2022-12-21 2023-04-18 广州辰创科技发展有限公司 一种智能表单自动生成方法

Cited By (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114357959A (zh) * 2021-12-17 2022-04-15 深圳市金证前海金融科技有限公司 表单编辑方法、装置、设备及存储介质
CN114546205A (zh) * 2022-04-26 2022-05-27 北京金堤科技有限公司 对展示信息进行编辑的方法和装置
CN114546205B (zh) * 2022-04-26 2022-07-15 北京金堤科技有限公司 对展示信息进行编辑的方法和装置
CN115221849A (zh) * 2022-07-12 2022-10-21 平安科技(深圳)有限公司 一种报表填充方法、计算机设备及存储介质
CN115221849B (zh) * 2022-07-12 2023-07-18 平安科技(深圳)有限公司 一种报表填充方法、计算机设备及存储介质
CN115983216A (zh) * 2022-12-21 2023-04-18 广州辰创科技发展有限公司 一种智能表单自动生成方法
CN115983216B (zh) * 2022-12-21 2023-11-14 广州辰创科技发展有限公司 一种智能表单自动生成方法

Similar Documents

Publication Publication Date Title
US11321057B2 (en) Single-page web application builder system and method based on a finite-state machine
CN113760282A (zh) 表单界面的配置方法、装置、设备、介质及程序产品
CN113094037A (zh) 表单和工作流的交互方法、开发平台、设备及存储介质
KR102170306B1 (ko) 레이아웃 템플릿 기반 통합 사이트 관리 시스템 및 방법
US9459780B1 (en) Documenting interactive graphical designs
CN113741898B (zh) 表单生成方法、装置及设备
US10460019B2 (en) Computer implemented system and method for transforming web content for display on multiple form factors
US20240111565A1 (en) Systems and methods for developing digital experience applications
CN113095056B (zh) 生成方法、处理方法、装置、电子设备以及介质
EP3113016A1 (en) Tracing dependencies between development artifacts in a development project
CN118502857A (zh) 用户界面的交互处理方法、装置、设备、介质及程序产品
JP6310527B1 (ja) オブジェクト分析装置、オブジェクト分析方法、及びプログラム
US10289388B2 (en) Process visualization toolkit
CN112825038A (zh) 基于通用组件语言规范的可视化页面制作方法和相关产品
WO2019225621A1 (ja) 設定装置、設定方法及び設定プログラム
CN114090436A (zh) 测试方法及装置
CN111435313A (zh) 一种软件换肤的方法及装置
CN114091423A (zh) 一种自定义报表的生成方法、装置、设备及存储介质
CN115981643A (zh) 业务关联组件的配置方法、系统、设备及存储介质
JP6551082B2 (ja) テスト支援装置、テスト支援方法およびテスト支援プログラム
CN111596828B (zh) cookie同步方法、装置及计算机可读存储介质
CN114860125A (zh) 流程图处理方法、装置、设备及介质
CN114706580A (zh) 前端网页开发方法、装置、存储介质和电子设备
CN113506099A (zh) 申报业务的配置系统、方法、计算机设备和存储介质
CN113535162A (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