一种动态表单自动更新的方法、系统、计算机设备和介质与流程

1.本发明涉及互联网技术领域，特别是涉及一种动态表单自动更新的方法、动态表单自动更新系统、计算机存储介质和计算机设备。


背景技术：

2.现有技术中，动态表单的应用越来越普及，然而传统动态表单的开发过程中存在需求不明确、需求易变更等问题，导致前期开发的表单代码存在大范围修改的问题，从而出现工作量增加、开发期延长的问题。
3.因此，如何实现对动态表单的自动更新成为当前亟待解决的问题。


技术实现要素：

4.为了解决上述问题至少之一，本发明第一个实施例提供一种动态表单自动更新的方法，应用于浏览器，包括：
5.响应于用户端的表单启动操作向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
6.解析并执行所述资源，触发表单引擎以获取第一表单元数据，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
7.根据所述第一表单元数据设置事件监听函数并生成动态表单代码；
8.运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
9.响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器，并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据。
10.在一个具体的实施例中，所述根据所述第一表单元数据设置事件监听函数并生成动态表单代码进一步包括：
11.根据所述第一表单元数据的数据结构设置事件监听函数；
12.根据所述第一表单元数据的数据结构生成动态表单代码。
13.在一个具体的实施例中，所述根据所述第一表单元数据的数据结构设置事件监听函数进一步包括：
14.根据所述第一表单元数据的数据层级关系按照预设元素结构进行划分，所述预设元素结构包括父元素和嵌套的子元素，所述第一表单元数据包括至少一个父元素；
15.将所述事件监听函数设置在所述父元素上，所述事件监听函数响应于所述浏览器运行所述动态表单代码触发，并将监听到的由所述浏览器响应于所述用户端的表单编辑操作生成的编辑触发信号传输至所述前端服务器。
16.在一个具体的实施例中，所述根据所述第一表单元数据的数据结构生成动态表单代码进一步包括：
17.根据所述第一表单元数据的结构化数据遍历其包括的对象和该对象包括的键值对并生成对应的动态表单代码。
18.在一个具体的实施例中，所述编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化，所述响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器进一步包括：
19.所述事件监听函数监听所述编辑触发信号并将该编辑触发信号的结构化数据编辑包缓存在所述浏览器，按预定间隔时间将该预定间隔时间内的全部结构化数据编辑包发送至所述前端服务器，并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据。
20.在一个具体的实施例中，所述结构化数据编辑包包括：
21.第一结构化数据，包括第一编辑键值对，用于表征第一表单编辑操作，所述第一表单编辑操作为所述用户端在所述浏览器呈现的可视化动态表单上修改所述第一表单元数据的一个已有对象的一个已有键值对的值，所述第一编辑键值对包括修改的所述属性和/或所述值的第一内容键值对、以及表征该第一内容键值对的坐标位置的第一坐标键值对；
22.或者
23.第二结构化数据，包括第二编辑键值对，用于表征第二表单编辑操作，所述第二表单编辑操作为所述用户端在所述浏览器呈现的可视化动态表单上新增所述第一表单元数据的一个已有对象的一个键值对以及该键值对的属性和值，所述第二编辑键值对包括新增的第二内容键值对、以及表征该第二内容键值对的坐标位置的第二坐标键值对；
24.或者
25.第三结构化数据，包括第三编辑键值对，用于表征第三表单编辑操作，所述第三表单编辑操作为所述用户端在所述浏览器呈现的可视化动态表单上新增所述第一表单元数据的一个对象以及该对象的至少一个键值对以及该键值对的属性和值，所述第三编辑键值对包括新增的第三内容键值对、以及表征该第三内容键值对的坐标位置的第三坐标键值对，所述第三内容键值对包括嵌套的各子内容键值对，所述第三坐标键值对包括与各子内容键值对对应的嵌套的子坐标键值对。
26.在一个具体的实施例中，利用预设置的加密函数对所述结构化数据编辑包进行数字签名和非对称加密。
27.在一个具体的实施例中，在所述响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器之后，所述方法还包括：
28.利用预设置的回调函数进行数据统计并输出统计数据。
29.在一个具体的实施例中，所述动态表单包括文本框、多行文本框、密码框、隐藏域、复选框、单选框、文件上传框和下拉选择框中的一个或多个。
30.本发明第二个实施例提供一种动态表单自动更新的方法，应用于前端服务器，包括：
31.响应于浏览器发送的资源请求指令将存储的资源发送至浏览器，以使得所述浏览器解析并执行所述资源，触发表单引擎；
32.响应于所述表单引擎的请求调用后端服务器的数据接口读取存储在数据库中的第二表单元数据并发送至所述浏览器，以使得所述表单引擎获取第一表单元数据并存储在所述浏览器中、根据所述第一表单元数据设置事件监听函数并生成动态表单代码，以使得浏览器运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
33.响应于接收的编辑触发信号调用后端服务器的数据接口修改存储在数据库中的第二表单元数据，所述编辑触发信号为所述浏览器响应于用户端的表单编辑操作生成的、由所述事件监听函数监听并传输的。
34.本发明第三个实施例提供一种动态表单自动更新的方法，应用于后端服务器，包括：
35.响应于前端服务器的调用，使用其与数据库连接的数据接口读取存储在所述数据库中的第二表单元数据并传输至所述前端服务器，经所述前端服务器传输至浏览器并缓存为第一表单元数据，以使得所述浏览器触发的表单引擎根据所述第一表单元数据设置事件监听函数并生成动态表单代码，以使得所述浏览器运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
36.响应于所述前端服务器的调用，使用其与数据库连接的数据接口根据所述浏览器输出的修改后的第一表单元数据修改存储在所述数据库中的第二表单元数据，所述修改后的第一表单元数据为所述浏览器响应于用户端的表单编辑操作修改的、并生成编辑触发信号、由所述事件监听函数监听并将所述编辑触发信号传输至前端服务器。
37.本发明第四个实施例提供一种动态表单自动更新的方法，应用于数据库，包括：
38.响应于后端服务器的数据接口的数据请求输出存储的第二表单元数据，以使得所述后端服务器将所述第二表单元数据传输至前端服务器并经所述前端服务器传输至浏览器并缓存为第一表单元数据，以使得所述浏览器获取并缓存第一表单元数据，以使得所述浏览器触发的表单引擎根据所述第一表单元数据设置事件监听函数并生成动态表单代码，以使得所述浏览器运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
39.响应于后端服务器的数据接口的更新请求，并根据所述后端服务器发送的修改后的第一表单元数据更新存储的第二表单元数据，所述修改后的第一表单元数据为所述浏览器响应于用户端的表单编辑操作修改的、并生成编辑触发信号、由所述事件监听函数监听并将所述编辑触发信号传输至前端服务器、经所述前端服务器传输至所述后端服务器。
40.本发明第五个实施例提供一种动态表单自动更新的方法，应用于用户端，包括：
41.根据输入的表单启动操作触发浏览器，以使得所述浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源、解析并执行所述资源、触发表单引擎以获取第一表单元数据，以使得所述表单引擎根据所述第一表单元数据设置事件监听函数并生成动态
表单代码，以使得所述浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
42.根据输入的表单编辑操作触发浏览器，以使得所述浏览器修改所述第一表单元数据并生成编辑触发信号，由所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器、并经所述前端服务器调用后端服务器的数据接口并根据修改后的第一表单元数据更新存储在所述数据库中的第二表单元数据。
43.本发明第六个实施例提供一种动态表单自动更新系统，包括用户端、浏览器、前端服务器、后端服务器和数据库，所述浏览器被配置为：
44.响应于用户端的表单启动操作向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
45.解析并执行所述资源，触发表单引擎以获取第一表单元数据，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
46.根据所述第一表单元数据设置事件监听函数并生成动态表单代码；
47.运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
48.响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器，并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据。
49.本发明第七个实施例提供一种计算机可读存储介质，其上存储有计算机程序，
50.该程序被处理器执行时实现如第一个实施例所述的方法；
51.或者
52.该程序被处理器执行时实现如第二个实施例所述的方法；
53.或者
54.该程序被处理器执行时实现如第三个实施例所述的方法；
55.或者
56.该程序被处理器执行时实现如第四个实施例所述的方法；
57.或者
58.该程序被处理器执行时实现如第五个实施例所述的方法。
59.本发明第八个实施例提供一种计算机设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，
60.所述处理器执行所述程序时实现如第一个实施例所述的方法；
61.或者
62.所述处理器执行所述程序时实现如第二个实施例所述的方法；
63.或者
64.所述处理器执行所述程序时实现如第三个实施例所述的方法；
65.或者
66.所述处理器执行所述程序时实现如第四个实施例所述的方法；
67.或者
68.所述处理器执行所述程序时实现如第五个实施例所述的方法。
69.本发明的有益效果如下：
70.本发明针对目前现有的问题，制定一种动态表单自动更新的方法、系统、计算机设备和介质，通过设置的事件监听函数监听浏览器响应于用户端的表单编辑操作生成的编辑触发信号，并根据该编辑触发信号通过前端服务器和后端服务器更新存储在数据库的表单元数据，以实现动态表单的自动映射更新，从而弥补了现有技术中存在的问题，有效提高动态表单的应用灵活性，提高开发效率，降低开发成本，具有广泛的应用前景。
附图说明
71.为了更清楚地说明本发明实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
72.图1示出本发明的一个实施例所述动态表单自动更新方法的流程图；
73.图2示出本发明的一个实施例所述动态表单自动更新系统的结构框图；
74.图3示出本发明的一个实施例所述动态表单自动更新方法的交互泳道图；
75.图4示出本发明的一个实施例所述动态表单自动更新方法的流程示意图；
76.图5示出本发明的一个实施例所述事件监听函数和表单元数据的结构示意图；
77.图6示出本发明的一个实施例所述结构化数据编辑包的示意图；
78.图7a-7l示出本发明的另一个实施例所述动态表单的开发者模式的示意图；
79.图8示出本发明的另一个实施例所述动态表单自动更新方法的流程图；
80.图9示出本发明的另一个实施例所述动态表单自动更新方法的流程图；
81.图10示出本发明的另一个实施例所述动态表单自动更新方法的流程图；
82.图11示出本发明的另一个实施例所述动态表单自动更新方法的流程图；
83.图12示出本发明的另一个实施例所述动态表单自动更新系统的结构框图；
84.图13示出本发明的另一个实施例所述的一种计算机设备的结构示意图。
具体实施方式
85.为了更清楚地说明本发明，下面结合优选实施例和附图对本发明做进一步的说明。附图中相似的部件以相同的附图标记进行表示。本领域技术人员应当理解，下面所具体描述的内容是说明性的而非限制性的，不应以此限制本发明的保护范围。
86.如图1所示，本发明的一个实施例提供了一种动态表单自动更新的方法，应用于浏览器，包括：
87.响应于用户端的表单启动操作向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
88.解析并执行所述资源，触发表单引擎以获取第一表单元数据，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
89.根据所述第一表单元数据设置事件监听函数并生成动态表单代码；
90.运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
91.响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器，并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据。
92.在本实施例中，如图12所示，表单引擎为实现动态表单自动更新的核心技术，该表单引擎包括可视化编辑器和表单动态框架，其中可视化编辑器根据结构化数据的数据层级关系呈现可视化的数据结构，以实现对结构化数据的可视化操作，表单动态框架为包括多个函数并且可调用可执行所述函数以实现对动态表单的自动更新。
93.值得说明的是，表单引擎还可以包括其他组件，例如可视化组件等，本技术对此不作具体限定，本领域技术人员应当根据实际应用情况选择适当的组件，在此不再赘述。
94.在本实施例中，浏览器响应于用户端输入的表单启动操作从前端服务器获取资源，解析并执行所述资源、触发表单引擎以获取第一表单元数据，由所述表单引擎根据所述第一表单元数据设置事件监听函数并生成动态表单代码，所述浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数，并响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，由设置的事件监听函数监听并转发编辑触发信号至前端服务器，通过前端服务器和后端服务器更新存储在数据库的表单元数据，以实现动态表单的自动映射更新，从而弥补了现有技术中存在的问题，有效提高动态表单的应用灵活性，提高开发效率，降低开发成本，具有广泛的应用前景。
95.在一个具体的实施例中，如图2所示为动态表单自动更新系统，包括用户端、浏览器、前端服务器、后端服务器和数据库。其中，用户端可以为计算机、便携式计算机、平板电脑、智能手机等可运行浏览器的终端设备，用户通过用户端可以启动浏览器，并通过输入表单启动操作访问动态表单，表单启动操作为在浏览器中输入动态表单对应的互联网标准资源地址url，再通过表单编辑操作在浏览器中修改动态表单，表单编辑操作包括对动态表单进行修改和新增等操作；浏览器为支持html5技术的浏览器，能够识别动态表单的映射程序并可视化显示；前端服务器为一个高性能的http和反向代理web服务器nginx，通过调用接口超文本传输协议http，调用后端服务器并与后端服务器进行数据传输；后端服务器为linux系统部署的springboot的java后端服务，通过调用接口jdbc调用数据库并与数据库进行数据传输；数据库为关系型数据库，用于存储动态表单的表单元数据。
96.值得说明的是，本技术对前端服务器、后端服务器和数据库的硬件结构不做具体限定，可以为独立的硬件，也可以为基于同一个硬件的不同部分，本领域技术人员应当根据实际应用情况选择适当的硬件结构，在此不再赘述。
97.如图1-4所示，以动态表单自动更新系统的工作流程进行详细说明：
98.第一，浏览器响应于用户端的表单启动操作向前端服务器发送资源请求指令，并
从所述前端服务器获取资源。
99.具体的，如图3所示，
100.s1.用户端响应于用户输入的表单启动操作触发浏览器。
101.在本实施例中，用户通过用户端启动浏览器，并通过输入动态表单对应的互联网标准资源地址url访问动态表单。具体的，根据url地址触发浏览器。即用户端根据输入的表单启动操作触发浏览器。
102.s2.浏览器向前端服务器发送资源请求指令。
103.在本实施例中，浏览器根据接收的url地址向前端服务器发送资源请求指令，请求存储在前端服务器的资源，所述资源包括静态资源html文本和动态资源js文件。
104.值得说明的是，在浏览器响应于用户端的表单启动操作向前端服务器发送资源请求指令、并从所述前端服务器获取资源之前，该浏览器根据动态表单的 url通过前端服务器、后端服务器和数据库访问过该动态表单，并将该动态表单的静态资源html文本和动态资源js文件存储在前端服务器中。
105.s3.前端服务器向浏览器返回资源。
106.在本实施例中，前端服务器将存储的包括静态资源html文本和动态资源 js文件的资源发送至浏览器。
107.第二，浏览器解析并执行所述资源、触发表单引擎以获取第一表单元数据，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中。
108.具体的，如图3所示，
109.s4.浏览器解析并执行资源、触发表单引擎。
110.在本实施例中，浏览器解析并执行资源中的动态资源js文件，同时触发表单引擎以通过表单引擎执行动态表单的自动映射。
111.s5.表单引擎的表单动态框架向前端服务器发送请求以获取第一表单元数据。
112.在本实施例中，通过触发的表单引擎利用表单引擎的表单动态框架向前端服务器发送请求，通过前端服务器调用后端服务器、经后端服务器从数据库获取存储在数据库中的表单元数据。
113.s6.前端服务器使用第一调用接口调用后端服务器。
114.在本实施例中，如图4所示，前端服务器为前端web服务器，前端服务器与后端服务器通过前端服务器的第一调用接口进行通信，所述第一调用接口为超文本传输协议http，用于与后端服务器进行通信。具体的，前端服务器通过第一调用接口向后端服务器发送超文本传输协议http，包括动态表单的 url地址对应的超文本传输协议http。即前端服务器响应于所述表单引擎的表单动态框架的请求调用后端服务器的数据接口以读取存储在数据库中的第二表单元数据。
115.s7.后端服务器使用第二调用接口从数据库获取第二表单元数据。
116.在本实施例中，后端服务器为后端应用服务器，与数据库通过后端服务器的第二调用接口进行通信，所述第二调用接口为jdbc(java databaseconnectivity)，即java数据库连接接口，用于与数据库进行通信，包括向数据库请求数据库存储的动态表单对应的
第二表单元数据，也就是动态表单的url 地址对应的存储在数据库中的数据地址。所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值。即后端服务器响应于前端服务器的调用，使用其与数据库连接的数据接口读取存储在所述数据库中的第二表单元数据。
117.s8.数据库将第二表单元数据返回后端服务器。
118.在本实施例中，数据库为关系型数据库，存储动态表单的元数据，该元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值。元数据通过包括的多个键值对表征动态表单，也就是说通过结构化数据的属性和值描述对象。换句话说，结构化数据也称作行数据，是由二维表结构来逻辑表达和实现的数据，严格地遵循数据格式与长度规范，主要通过关系型数据库进行存储和管理。即数据库响应于后端服务器的数据接口的数据请求输出存储的第二表单元数据。
119.值得说明的是，利用结构化数据描述动态表单的属性和值，该动态表单可以是一维表单，即一个对象表单；也可以是多维表单，如一行为一个对象表单；本技术对此不做具体限定，本领域技术人员应当根据实际应用需求选择适当的动态表单，在此不再赘述。
120.如图4所示的步骤1，数据库利用后端应用服务器与数据库的jdbc接口将存储的动态表单对应的第二表单元数据传输至后端应用服务器。
121.s9.后端服务器将第一表单元数据返回前端服务器。
122.在本实施例中，后端服务器根据接收的第二表单元数据进行数据处理，例如将第二表单元数据进行结构化处理，形成前端服务器可以识别的第一表单元数据。即后端服务器将第二表单元数据转化为结构化的第一表单元数据并传输至所述前端服务器。
123.如图4所示的步骤2，后端应用服务器利用与前端web服务器的api接口传输第一表单元数据。具体的，所述第一表单元数据为图示中的动态表单的描述元数据md，例如，一个具体的键值对包括：
[0124][0125]
其中，fontfamily为该键值对的属性，值是value为“normal”，表征为一个下拉框“select”，该下拉框的标签为“字体系列”，默认值为“normal”，下拉框的选项为“_properties.fontfamily”。
[0126]
s10.前端服务器将第一表单元数据返回浏览器。
[0127]
在本实施例中，前端服务器进一步将第一表单元数据返回浏览器并缓存在所述浏览器中。
[0128]
第三，根据所述第一表单元数据设置事件监听函数并生成动态表单代码，运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数。
[0129]
具体的，如图3所示，
[0130]
s11.表单引擎的表单动态框架根据所述第一表单元数据设置事件监听函数并生成动态表单代码，浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数。
[0131]
在本实施例中，一方面通过表单引擎实现事件监听函数的设置、以及生成动态表单代码，另一方面利用浏览器运行动态表单代码呈现可视化动态表单、同时触发事件监听函数。
[0132]
在一个可选的实施例中，所述根据所述第一表单元数据设置事件监听函数并生成动态表单代码进一步包括：根据所述第一表单元数据的数据结构设置事件监听函数；根据所述第一表单元数据的数据结构生成动态表单代码。
[0133]
在本实施例中，利用表单引擎建立委派表单结构，如图5所示，该结构包括父节点、隶属于该父节点的多个子节点、设置在该父节点上的事件监听函数 (即事件函数)、以及设置在该父节点之上的触发事件。
[0134]
根据该设置，当用户端响应于用户的表单编辑操作在浏览器呈现的可视化动态表单上进行修改操作时，该修改操作生成触发事件
①
，设置在父节点上的事件监听函数捕获触发事件
②
，目标子节点执行事件
③
，从而完成触发事件—事件监听—子节点执行更新的具体过程。
[0135]
在本实施例中，根据所述第一表单元数据的数据层级关系按照预设元素结构进行划分，所述预设元素结构包括父元素和嵌套的子元素，所述第一表单元数据包括至少一个父元素；将所述事件监听函数设置在所述父元素上，所述事件监听函数响应于所述浏览器运行所述动态表单代码触发，并将监听到的由所述浏览器响应于所述用户端的表单编辑操作生成的编辑触发信号传输至所述前端服务器。
[0136]
其中，所述父元素即为图5中的父节点，所述子元素即为图5中的子节点，第一表单元数据包括至少一个节点，该节点包括至少一个对象的至少一个键值对，即该节点即为第一表单元数据的父元素。
[0137]
具体的，在本实施例中，表单引擎根据浏览器接收的表单编辑操作生成编辑触发信号(即图5中的触发事件)，设置在父元素(即图5中的父节点)上的事件监听函数(即图5中的事件函数)监听到编辑触发信号修改缓存的第一表单元数据(即图5中的目标子节点执行事件)，从而实现对第一表单元数据的修改，同时将编辑触发信号传输至前端服务器，利用前端服务器与后端服务器的http接口，以及后端服务器与数据库的jdbc接口实现对数据库中存储的第二表单元数据的更新。
[0138]
例如，利用表单引擎设置事件监听函数，其中，“《div id＝”main_content”/》”为父节点，“《div id＝”main_content”/》，$('#main_content').delegate('input,select', 'change',function(e)”为将事件监听函数设置在父节点。
[0139]
[0140]
值得说明的是，相对于现有技术中将事件监听函数设置在各个元素上导致交互逻辑复杂，易存在混淆、冲突和冗余等问题，本实施例中通过将事件监听函数设置在父元素上，统一由父节点进行事件管理，具有逻辑清晰的优点，同时提高软件可读性、可维护性并降低程序复杂度。
[0141]
在表单引擎设置事件监听函数的同时，表单引擎根据第一表单元数据的数据结构生成动态表单代码，进一步的，根据所述第一表单元数据的结构化数据遍历其包括的对象和该对象包括的键值对并生成对应的动态表单代码，所述动态表单代码被所述浏览器运行时呈现可视化动态表单并触发所述事件监听函数。
[0142]
在本实施例中，利用表单引擎的表单动态框架根据第一表单元数据生成 dom代码，具体的，根据第一表单元数据的数据结构生成dom代码，即所述动态表单代码。例如动态表单为一维表单，则直接遍历该表单的表单数据，具体为遍历该表单的对象，以及该对象包括的键值对，即属性和值从而生成对应的动态表单代码；如果是多维表单则先遍历维度，再遍历每个维度的对象，以及该对象包括的键值对，即属性和值从而实现对整个动态表单的遍历。
[0143]
具体的，对第一表单元数据进行遍历。
[0144][0145]
具体的，如图4所示，表单引擎的表单动态框架将第一元数据中的一个键值对转换为dom代码，即具有表单标签和表单域的dom代码，从而形成与第一元数据的各个键值对一一对应的代码文本，以便于浏览器识别并呈现可视化动态表单。
[0146]
例如，利用表单引擎的表单动态框架将以下键值对转换为下述dom文本。
value＝”值”》《/option》《/select》
[0167]
上述表单样式仅用于说明本技术包括的具体样式，并不局限于此。
[0168]
值得说明的是，本技术仅通过表单引擎的表单动态框架生成dom代码说明本技术的具体实施方式，本技术对此不做具体限定，可以使用表单引擎技术，也可以通过浏览器访问远程设备、云设备等生成动态表单代码，例如利用分布式服务器saas生成动态表单代码，本领域技术人员应当根据实际应用需求选择适当的表单引擎或设备生成动态表单代码，在此不再赘述。
[0169]
进一步的，浏览器运行动态表单代码，呈现可视化动态表单并触发事件监听函数。
[0170]
在本实施例中，如图4所示，浏览器呈现可视化的动态表单，例如标签为字体系列的下拉框，以及标签为字体大小的文本框；同时触发事件监听函数，事件监听函数实时监听浏览器生成的编辑触发信号并传输至前端服务器。
[0171]
第四、浏览器响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器，并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据，所述编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0172]
具体的，如图3所示，
[0173]
s12.用户端响应于用户输入的表单编辑操作更新动态表单。
[0174]
s13.浏览器根据所述表单编辑操作修改所述第一表单元数据，并生成编辑触发信号。
[0175]
s14.浏览器中运行的事件监听函数将监听的编辑触发信号发送至所述前端服务器。
[0176]
在本实施例中，用户端根据输入的表单编辑操作触发浏览器。具体的，如图4所示的步骤5，根据在浏览器界面上的编辑操作修改缓存在浏览器中的第一表单元数据，即动态表单的属性值变更后自动映射到浏览器缓存的表单元数据；同时生成编辑触发信号，编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。即通过在浏览器界面上修改动态表单的表单编辑操作更新动态表单。
[0177]
在一个可选的实施例中，在所述响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器之后，所述方法还包括：利用预设置的回调函数进行数据统计并输出统计数据。
[0178]
在本实施例中，通过预设置的回调函数还能够实现数据统计操作，并根据数据统计操作输出统计数据，从而提高动态表单的实用性能，具有实际应用价值。
[0179]
具体的，浏览器根据所述表单编辑操作修改所述第一表单元数据，并根据生成的编辑触发信号调用回调函数，以实现动态表单的统计功能。
[0180][0181]
在一个可选的实施例中，所述结构化数据编辑包包括：第一结构化数据，包括第一编辑键值对，用于表征第一表单编辑操作，所述第一表单编辑操作为所述用户端在所述浏览器呈现的可视化动态表单上修改所述第一表单元数据的一个已有对象的一个已有键值对的值，所述第一编辑键值对包括修改的所述属性和/或所述值的第一内容键值对、以及表征该第一内容键值对的坐标位置的第一坐标键值对。
[0182]
在本实施例中，包括第一结构表单数据的结构化数据为修改已有对象的一个已有键值对的值，即更新动态表单的一种更新方式。
[0183]
在一个可选的实施例中，所述结构化数据编辑包包括：第二结构化数据，包括第二编辑键值对，用于表征第二表单编辑操作，所述第二表单编辑操作为所述用户端在所述浏览器呈现的可视化动态表单上新增所述第一表单元数据的一个已有对象的一个键值对以及该键值对的属性和值，所述第二编辑键值对包括新增的第二内容键值对、以及表征该第二内容键值对的坐标位置的第二坐标键值对。
[0184]
在本实施例中，包括第二结构数据的结构化数据为新增已有对象的一个键值对的值，例如增加一个键值对和该键值对对应的坐标值，从而实现对动态表单的更新。即更新动态表单的一种更新方式。
[0185]
在另一个可选的实施例中，所述结构化数据编辑包包括：第三结构化数据，包括第三编辑键值对，用于表征第三表单编辑操作，所述第三表单编辑操作为所述用户端在所述
浏览器呈现的可视化动态表单上新增所述第一表单元数据的一个对象以及该对象的至少一个键值对以及该键值对的属性和值，所述第三编辑键值对包括新增的第三内容键值对、以及表征该第三内容键值对的坐标位置的第三坐标键值对，所述第三内容键值对包括嵌套的各子内容键值对，所述第三坐标键值对包括与各子内容键值对对应的嵌套的子坐标键值对。
[0186]
在本实施例中，包括第三结构数据的结构化数据为新增一个对象以及该对象包括的各键值对的值，例如增加一个对象，该对象包括的各键值对和各键值对对应的坐标值，从而实现对动态表单的更新。即更新动态表单的一种更新方式。
[0187]
在一个具体的示例中，如图6所示，新增两个对象，第一个对象包括四个键值对，第一个键值对的属性为“name”并且值为“张三”，第二个键值对的属性为“age”并且值为“12”，第三个键值对的属性为“gender”并且值为“0”，第四个键值对为隐藏键值对，属性为“坐标”并且值为“0”；第二个对象与第一个对象类似也包括四个键值对，第一个键值对的属性为“name”并且值为“李四”，第二个键值对的属性为“age”并且值为“15”，第三个键值对的属性为“gender”并且值为“1”，第四个键值对为隐藏键值对，属性为“坐标”并且值为“1”。
[0188]
考虑到动态表单的防篡改和数据安全性问题，在一个可选的实施例中，还包括利用预设置的加密函数对所述结构化数据编辑包进行数字签名和非对称加密。
[0189]
在本实施例中，通过设置在表单引擎的表单动态框架中的加密函数对结构化数据编辑包进行数字签名以防止第一表单元数据被篡改；同时，通过设置在表单引擎的表单动态框架中的加密函数对结构化数据编辑包进行非对称加密以防止明文泄露；从而有效提高动态表单的防篡改性能和数据安全性性能。
[0190]
s15.前端服务器使用第一调用接口调用后端服务器。
[0191]
在本实施例中，与前述前端服务器和后端服务器通信相类似，如图4所示的步骤7，前端服务器使用与后端服务器对应的http接口调用后端服务器，并将包括结构化数据编辑包的编辑触发信号传输至后端服务器。
[0192]
s16.后端服务器使用第二调用接口调用数据库。
[0193]
在本实施例中，与前述后端服务器和数据库通信相类似，如图4所示的步骤8，后端服务器和数据库通信使用后端服务器的jdbc接口将包括结构化数据编辑包的编辑触发信号传输至数据库。
[0194]
s17.数据库修改存储的第二表单元数据。
[0195]
在本实施例中，数据库根据包括结构化数据编辑包的编辑触发信号修改第二表单数据，从而完成动态表单的自动映射更新。
[0196]
至此，通过上述动态表单自动更新方法已经自动更新了存储在数据库中第二表单元数据，即实现了更新数据库中存储的第二表单元数据。
[0197]
考虑到动态表单的更新效率，在一个可选的实施例中，所述事件监听函数监听所述编辑触发信号并将该编辑触发信号的结构化数据编辑包缓存在所述浏览器，按预定间隔时间将该预定间隔时间内的全部结构化数据编辑包发送至所述前端服务器，并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据。
[0198]
在本实施例中，基于设置在父元素上的事件监听函数，还可以进一步进行优化整合，例如将多次触发事件统一处理。具体的，预设置事件统一处理的间隔时间，以该预设间
隔时间为处理周期，将一个处理周期内的多次触发事件统一进行处理，从而在父元素上进行网络数据交互策略优化。
[0199]
具体的，事件监听函数监听所述编辑触发信号并将该编辑触发信号的结构化数据编辑包缓存在所述浏览器，一个预设间隔时间后，将该间隔时间内缓存的所有结构化数据编辑包统一发送到前端服务器，从而将多次表单编辑操作合并为一次进行处理，即通过将多次触发事件在浏览器进行本地缓存，有效提高浏览器—前端服务器—后端服务器—数据库的更新效率，能够减小带宽占用、以及浏览器的计算资源负载压力，从而有效提高传输效率。
[0200]
具体的，将预设间隔时间设置为10秒，每10秒调用save()函数以统一通过前端服务器—后端服务器—数据库的通信接口将更新的内容修改到数据库中的第二表单元数据。
[0201][0202]
考虑到动态表单的版本控制，在一个可选的实施例中，所述浏览器还包括存储历史数据的存储单元，所述存储单元包括历史更新使用的全部结构化数据编辑包以回滚数据。
[0203]
在本实施例中，通过存储在浏览器中各次更新的结构化数据编辑包，能够实现动态表单数据的表单元数据的回滚性能。即通过浏览器中存储在本地的历史修改记录以提供动态表单的历史版本的可追溯行和可恢复性。
[0204]
在一个实际的示例中，以教育领域的学生情况的学生动态表单为例进行详细说明，该动态表单包括基础表单和成绩表单，其中，基础表单包括学生姓名、学号、id号、性别、年龄等基本信息，成绩表单包括学生姓名、学号、id号、语文成绩、数学成绩和英语成绩。在该动态表单的基础上针对学校的更新需求进行自动更新。
[0205]
更新需求一：将成绩表单中的语文成绩、数学成绩和英语成绩从百分制改为a-e等
级评定。
[0206]
具体自动更新方法包括：
[0207]
第一步：响应于用户使用计算机启动浏览器，输入学生动态表单对应的 url地址；
[0208]
第二步：浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
[0209]
第三步：浏览器解析并执行所述资源、触发表单引擎请求前端服务器，并通过前端服务器与后端服务器的http接口调用后端服务器，再通过后端服务器与数据库的jdbc接口从数据库中读取存储的学生动态表单的第二表单元数据，经后端服务器进行结构化处理生成第一表单元数据并传输至前端服务器，经前端服务器传输至浏览器，并缓存在浏览器中；
[0210]
第四步：表单引擎根据第一表单元数据的数据结构设置事件监听函数并生成动态表单代码，具体的，表单引擎根据第一表单元数据的数据层级关系划分父元素和嵌套的子元素，并将所述事件监听函数设置在所述父元素上，该表单引擎再根据第一表单元数据的结构化数据遍历其包括的对象和该对象包括的键值对并生成对应的动态表单代码，并将该动态表单代码传输至浏览器以呈现可视化动态表单；
[0211]
第五步：浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
[0212]
第六步：响应于用户在浏览器页面修改语文成绩、数学成绩和英语成绩对应的键值对的值，修改所述第一表单元数据并生成编辑触发信号，使得设置在父节点的事件监听函数监听到该编辑触发信号并传输至前端服务器；
[0213]
第七步：前端服务器通过http接口调用后端服务器，并经后端服务器修改存储在数据库中的第二表单元数据，从此实现对学生动态表单的修改。
[0214]
关闭浏览器，重新启动并输入学生动态表单对应的url地址，浏览器呈现更新的学生动态表单，其中成绩表单中的语文成绩、数学成绩和英语成绩为 a-e等级。
[0215]
更新需求二：在成绩单中增加体育成绩。
[0216]
具体自动更新方法包括：
[0217]
第一步：响应于用户使用计算机启动浏览器，输入学生动态表单对应的 url地址；
[0218]
第二步：浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
[0219]
第三步：浏览器解析并执行所述资源、触发表单引擎请求前端服务器，并通过前端服务器与后端服务器的http接口调用后端服务器，再通过后端服务器与数据库的jdbc接口从数据库中读取存储的学生动态表单的第二表单元数据，经后端服务器进行结构化处理生成第一表单元数据并传输至前端服务器，经前端服务器传输至浏览器，并缓存在浏览器中；
[0220]
第四步：表单引擎根据第一表单元数据的数据结构设置事件监听函数并生成动态表单代码，具体的，表单引擎根据第一表单元数据的数据层级关系划分父元素和嵌套的子元素，并将所述事件监听函数设置在所述父元素上，该表单引擎再根据第一表单元数据的结构化数据遍历其包括的对象和该对象包括的键值对并生成对应的动态表单代码，并将该动态表单代码传输至浏览器以呈现可视化动态表单；
[0221]
第五步：浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
[0222]
第六步：响应于用户在浏览器页面增加体育成绩键值对，以及该体育成绩键值对对应的位置，修改所述第一表单元数据并生成编辑触发信号，使得设置在父节点的事件监
听函数监听到该编辑触发信号并传输至前端服务器；
[0223]
第七步：前端服务器通过http接口调用后端服务器，并经后端服务器修改存储在数据库中的第二表单元数据，从此实现对学生动态表单的修改。
[0224]
关闭浏览器，重新启动并输入学生动态表单对应的url地址，浏览器呈现更新的学生动态表单，其中成绩表单包括语文成绩、数学成绩、英语成绩和体育成绩。
[0225]
更新需求三：在学生动态表单中新建一个体温监测表单，该体温监测表单包括学生姓名、学号、id号、日期和体温。
[0226]
具体自动更新方法包括：
[0227]
第一步：响应于用户使用计算机启动浏览器，输入学生动态表单对应的 url地址；
[0228]
第二步：浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
[0229]
第三步：浏览器解析并执行所述资源、触发表单引擎请求前端服务器，并通过前端服务器与后端服务器的http接口调用后端服务器，再通过后端服务器与数据库的jdbc接口从数据库中读取存储的学生动态表单的第二表单元数据，经后端服务器进行结构化处理生成第一表单元数据并传输至前端服务器，经前端服务器传输至浏览器，并缓存在浏览器中；
[0230]
第四步：表单引擎根据第一表单元数据的数据结构设置事件监听函数并生成动态表单代码，具体的，表单引擎根据第一表单元数据的数据层级关系划分父元素和嵌套的子元素，并将所述事件监听函数设置在所述父元素上，该表单引擎再根据第一表单元数据的结构化数据遍历其包括的对象和该对象包括的键值对并生成对应的动态表单代码，并将该动态表单代码传输至浏览器以呈现可视化动态表单；
[0231]
第五步：浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
[0232]
第六步：响应于用户在浏览器页面增加体温监测表单、以及该体温监测表单中的多个键值对(学生姓名、学号、id号、日期和体温)和各键值对对应的位置，修改所述第一表单元数据并生成编辑触发信号，使得设置在父节点的事件监听函数监听到该编辑触发信号并传输至前端服务器；
[0233]
第七步：前端服务器通过http接口调用后端服务器，并经后端服务器修改存储在数据库中的第二表单元数据，从此实现对学生动态表单的修改。
[0234]
关闭浏览器，重新启动并输入学生动态表单对应的url地址，浏览器呈现更新的学生动态表单，其中学生动态表单包括基础表单、成绩表单和体温监测表单，体温监测表单包括学生姓名、学号、id号、日期和体温。
[0235]
在本实施例中，通过更新需求一、更新需求二和更新需求三分别举例说明三种更新方式，仅用于说明本技术的具体实施方式，对具体更新内容不作具体限定，本领域技术人员应当根据实际应用需求进行表单更新，以实现动态表单的自动更新为设计准则，在此不再赘述。
[0236]
在另一个实际的示例中，以具有折线图的动态表单的自动更新为例进行说明，该动态表单包括基础表单和图表样式表单，如图7b所示，基础表单包括折线图名字、宽度、高度、相对页面左边定位，相对页面顶部定位等基本信息；图表样式表单包括标题、图例、提示框、工具栏、调色盘颜色列表、坐标系、 x坐标轴、y坐标轴、图表系列等，其中标题有包括子元素是否显示、主标题、主标题样式、副标题、图标题样式、水平对齐、垂直对齐、主副标题间
距、离左侧距离等几百项样式属性。
[0237]
图表样式表单通过可视化编辑器中折线图样式进行配置和更新，其中，可视化编辑器中的图表系列包含多条折线系列表单，折线系列表单又包含类型、系列名称、编辑的图形、标记的大小、文本标签、折线端点标签等百余项样式属性。在该动态表单的基础上针对折线图可视化需求进行自动更新。
[0238]
更新需求一：将基础表单中的宽度、高度和相对页面左边定位从像素值(宽度：600px、高度：400px、相对页面左边定位：70px)改为百分比(宽度：30％、高度：30％、相对页面左边定位：0％)。
[0239]
具体自动更新方法包括：
[0240]
第一步：响应于用户使用计算机启动浏览器，输入折线图动态表单对应的 url地址；
[0241]
第二步：浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
[0242]
第三步：浏览器解析并执行所述资源、触发表单引擎请求前端服务器，并通过前端服务器与后端服务器的http接口调用后端服务器，再通过后端服务器与数据库的jdbc接口从数据库中读取存储的折线图动态表单的第二表单元数据，经后端服务器进行结构化处理生成第一表单元数据并传输至前端服务器，经前端服务器传输至浏览器，并缓存在浏览器中；
[0243]
第四步：表单引擎根据第一表单元数据的数据结构设置事件监听函数并生成动态表单代码，具体的，表单引擎根据第一表单元数据的数据层级关系划分父元素和嵌套的子元素，并将所述事件监听函数设置在所述父元素上，该表单引擎再根据第一表单元数据的结构化数据遍历其包括的对象和该对象包括的键值对并生成对应的动态表单代码，并将该动态表单代码传输至浏览器以呈现可视化动态表单；
[0244]
第五步：浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
[0245]
第六步：响应于用户在浏览器页面修改高度、宽度和相对页面左边定位对应的键值对的值，修改所述第一表单元数据并生成编辑触发信号，使得设置在父节点的事件监听函数监听到该编辑触发信号并传输至前端服务器；
[0246]
第七步：前端服务器通过http接口调用后端服务器，并经后端服务器修改存储在数据库中的第二表单元数据，从此实现对折线图动态表单的修改。
[0247]
第八步：由于监听函数设置了折线图刷新的回调函数，折线图在可视化编辑器中也同步进行了宽度：30％、高度：30％、相对页面左边定位：0％的呈现。
[0248]
关闭浏览器，重新启动并输入折线图动态表单对应的url地址，浏览器呈现更新的折线图动态表单，其中基础表单中的宽度、高度和相对页面左边定位为宽度：30％、高度：30％、相对页面左边定位：0％。
[0249]
更新需求二：在调色盘颜色列表中增加颜色，例如增加紫色。
[0250]
具体自动更新方法包括：
[0251]
第一步：响应于用户使用计算机启动浏览器，输入折线图动态表单对应的 url地址；
[0252]
第二步：浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
[0253]
第三步：浏览器解析并执行所述资源、触发表单引擎请求前端服务器，并通过前端服务器与后端服务器的http接口调用后端服务器，再通过后端服务器与数据库的jdbc接口从数据库中读取存储的学生动态表单的第二表单元数据，经后端服务器进行结构化处理生成第一表单元数据并传输至前端服务器，经前端服务器传输至浏览器，并缓存在浏览器中；
[0254]
第四步：表单引擎根据第一表单元数据的数据结构设置事件监听函数并生成动态表单代码，具体的，表单引擎根据第一表单元数据的数据层级关系划分父元素和嵌套的子元素，并将所述事件监听函数设置在所述父元素上，该表单引擎再根据第一表单元数据的结构化数据遍历其包括的对象和该对象包括的键值对并生成对应的动态表单代码，并将该动态表单代码传输至浏览器以呈现可视化动态表单；
[0255]
第五步：浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
[0256]
第六步：响应于用户在浏览器页面增加调色盘颜色列表键值对，以及该调色盘颜色列表键值对对应的位置，修改所述第一表单元数据并生成编辑触发信号，使得设置在父节点的事件监听函数监听到该编辑触发信号并传输至前端服务器；
[0257]
第七步：前端服务器通过http接口调用后端服务器，并经后端服务器修改存储在数据库中的第二表单元数据，从此实现对折线图动态表单的修改。
[0258]
第八步：由于监听函数设置了折线图刷新的回调函数，折线图在可视化编辑器中第一条折线由默认的蓝色变为了紫色。
[0259]
关闭浏览器，重新启动并输入折线图动态表单对应的url地址，浏览器呈现更新的折线图动态表单，其中调色盘颜色列表中列出了紫色。
[0260]
更新需求三：在折线图动态表单图表系列中新建一条折线图系列表单，该系列表单包括类型、系列名称、标记的图形、标记的大小、标记的旋转角度、文本标签、折线断点标签等百余项。
[0261]
具体自动更新方法包括：
[0262]
第一步：响应于用户使用计算机启动浏览器，输入折线图动态表单对应的 url地址；
[0263]
第二步：浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
[0264]
第三步：浏览器解析并执行所述资源、触发表单引擎请求前端服务器，并通过前端服务器与后端服务器的http接口调用后端服务器，再通过后端服务器与数据库的jdbc接口从数据库中读取存储的学生动态表单的第二表单元数据，经后端服务器进行结构化处理生成第一表单元数据并传输至前端服务器，经前端服务器传输至浏览器，并缓存在浏览器中；
[0265]
第四步：表单引擎根据第一表单元数据的数据结构设置事件监听函数并生成动态表单代码，具体的，表单引擎根据第一表单元数据的数据层级关系划分父元素和嵌套的子元素，并将所述事件监听函数设置在所述父元素上，该表单引擎再根据第一表单元数据的结构化数据遍历其包括的对象和该对象包括的键值对并生成对应的动态表单代码，并将该动态表单代码传输至浏览器以呈现可视化动态表单；
[0266]
第五步：浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
[0267]
第六步：响应于用户在浏览器页面增加图表系列表单、以及该图表系列表单中的
多个键值对(类型、系列名称、标记的图形、标记的大小、标记的旋转角度、文本标签、折线断点标签等百余项)和各键值对对应的位置，修改所述第一表单元数据并生成编辑触发信号，使得设置在父节点的事件监听函数监听到该编辑触发信号并传输至前端服务器。
[0268]
第七步：前端服务器通过http接口调用后端服务器，并经后端服务器修改存储在数据库中的第二表单元数据，从此实现对折线图动态表单的修改。
[0269]
关闭浏览器，重新启动并输入折线图动态表单对应的url地址，浏览器呈现更新的折线图动态表单，其中折线图动态表单包括基础表单和图表样式表单，其中，基础表单包括折线图名字、宽度、高度、相对页面左边定位，相对页面顶部定位等基本信息，图表样式表单包括标题、图例、提示框、工具栏、调色盘颜色列表、坐标系、x坐标轴、y坐标轴、图表系列等，其中标题有包括子元素是否显示、主标题、主标题样式、副标题、图标题样式、水平对齐、垂直对齐、主副标题间距、离左侧距离等几百项样式属性。图表系列包含多条折线系列表单，折线系列表单又包含类型、系列名称、编辑的图形、标记的大小、文本标签、折线端点标签等百余项。
[0270]
在本实施例中，通过更新需求一、更新需求二和更新需求三分别举例说明三种更新方式，仅用于说明本技术的具体实施方式，对具体更新内容不作具体限定，本领域技术人员应当根据实际应用需求进行表单更新，以实现动态表单的自动更新为设计准则，在此不再赘述。
[0271]
为了进一步说明本技术提供的动态表单自动表单更新方法，在该示例中通过开发者模式进行跟踪，如图7a-7i所示，例如使用的开发设备为计算机，通过f12按键可以跟踪浏览器的执行步骤。
[0272]
在折线图动态表单图表系列中新建一条折线图系列表单，根据浏览器呈现的可视化动态表单，进入开发者模式：
[0273]
第一步：如图7a所示，例如进入仪表盘页面，点击某个仪表盘【配置按钮】。
[0274]
如图可知，在该界面中，呈现出多个已建立的动态表单，例如动态表单“4”、“银行_银行经营数据解析”和“test”等，可以通过点击对应的动态表单直接进行可视化编辑；也可以通过动态表单的名称进行搜索；或者点击“创建可视化项目”新建一个动态表单。
[0275]
在本示例中，选择一个动态表单新建一条折线图系列表单。
[0276]
第二步：如图7b所示，进入图表编辑器，点击折线图组件，右侧呈现图表组件对应的样式编辑器，通过样式编辑器新建需要的折线图。
[0277]
第三步：如图7c所示，通过样式编辑器编辑后，点击elements标签，然后点击“显示”按钮，即启动鼠标选择dom模式，点击该按钮后，移动鼠标至图表组件并确定选中该图表组件后，点击鼠标左键，在页面下方代码区显示该图表组件的dom源代码。具体的：定位如图所示的图表组件，页面下方代码区显示该组件的dom源代码，提取组件id＝“assembly-1be27a23-cd2f-5c42
ꢀ‑
3948-1ec1686df2f2”，其中以“assembly
‑”
开头的为图表组件id。
[0278]
第四步：如图7d所示，根据上一步骤中获取的图表组件id，点击“控制台console”标签，并在指令行输入执行命令“$.dynamicobjects ['assembly-1be27a23-cd2f-5c42-3948-1ec1686df2f2']”，获取该图表组件在浏览器内存中的对象。
[0279]
第五步：如图7e所示，根据输入的执行指令，在页面下方的代码区显示对象内容，点击该对象右侧的下箭头以展开对象内容，其中，md为该图表组件的表单元数据描述md；其
中title为该图表组件的一个属性键值对对象，即对应页面右侧样式表单中的标题表单，根据上述操作，可以清楚直观地定位一个对象的各键值对，以及各键值对的属性和值，具体的，title为该键值对对象。
[0280]
第六步：如图7f所示，点击title以展开该键值对对象的子结构化数据，具体的，定位title的具体结构化数据，找到该结构化数据与表单的映射关系。例如：title对象的显示“show”键值对中，属性“是否显示”的值为“否”，对应于页面右侧样式表单中的标题表单中的“是否显示”的单选框；title对象的显示“text”键值对中，属性“主标题”的值为空，对应于页面右侧样式表单中的标题表单中的“主标题”的文本框。
[0281]
第七步：如图7g所示，通过指令行输入指令以修改结构化数据，并重新加载表单引擎，会重新生成dom。
[0282]
如图7h所示，具体修改如下：
[0283]
1.修改【标题-是否显示】改为
‘
是’，指令行输入命令：
[0284]
$.dynamicobjects['assembly-1be27a23-cd2f-5c42-3948-1ec1686df2f2'].md.att ribute_deploy.title.value.show.value＝true
[0285]
2.修改【标题-主标题】改为
‘
专利’，指令行输入命令：
[0286]
$.dynamicobjects['assembly-1be27a23-cd2f-5c42-3948-1ec1686df2f2'].md.att ribute_deploy.title.value.text.value＝'专利'。
[0287]
对应的，根据本次修改生成结构化数据编辑包，该结构化数据编辑包包括一个对象—标题，涉及标题中的“是否显示”的单选框和“主标题”的文本框，其中，“是否显示”的单选框包括三个键值对，如图7i所示，第一键值对的属性为“name”并且值为“是否显示”，第二个键值对的属性为“value”并且值为“false”，第三个键值对为隐藏键值对，属性为“坐标”并且值为“011”。相类似的，“主标题”的文本框也包括三个键值对，包括主标题、值和坐标，在此不再赘述。
[0288]
值得说明的是，其中标题为父节点，“是否显示”的单选框和“主标题”的文本框分别为子节点，当子节点进行编辑修改后生成编辑触发信号，如图7j 所示，设置在父节点(即图中父元素)上的事件监听函数监听到编辑触发信号修改缓存在浏览器的第一表单元数据，从而实现对第一表单元数据的修改，同时将编辑触发信号传输至前端服务器，利用前端服务器与后端服务器的http 接口，以及后端服务器与数据库的jdbc接口实现对数据库中存储的第二表单元数据的更新。
[0289]
第八步：如图7k所示，再点击页面顶部的【保存】按钮，通过表单引擎将结构化数据保存到数据库；再点击【重做】按钮，重新获取结构化数据，调用表单引擎生成dom；再点击图表组件，显示更新的结构化数据，以及对应的图表表单。
[0290]
第九步：如图7l所示，重新加载，呈现更新的动态表单。
[0291]
至此，完成新建一条折线图系列表单，以及该折线图的各键值对的设置和更新。
[0292]
值得说明的是，上述实施例通过教育领域的学生动态表单、以及具有图表的动态表单的自动更新方法详细说明本技术的具体实施方式，但不限应用于其他领域，例如企业中的oa办公系统的办公动态表单，该办公动态表单包括考勤动态表单，包括请假表单、公出表单等；例如园区物业和安保领域中的监控动态表单，包括监控摄像头表单、自动门表单等；本技术的动态表单的自动更新具有广泛的应用前景和实际应用价值。
[0293]
基于上述动态表单自动更新的方法，如图8所示，本技术的一个实施例还提供一种应用于前端服务器的动态表单自动更新的方法，包括：
[0294]
响应于浏览器发送的资源请求指令将存储的资源发送至浏览器，以使得所述浏览器解析并执行所述资源，触发表单引擎；
[0295]
响应于所述表单引擎的请求调用后端服务器的数据接口读取存储在数据库中的第二表单元数据并发送至所述浏览器，以使得所述表单引擎获取第一表单元数据并存储在所述浏览器中、根据所述第一表单元数据设置事件监听函数并生成动态表单代码，以使得浏览器运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
[0296]
响应于接收的编辑触发信号调用后端服务器的数据接口修改存储在数据库中的第二表单元数据，所述编辑触发信号为所述浏览器响应于用户端的表单编辑操作生成的、由所述事件监听函数监听并传输的，所述编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0297]
在本实施例中，通过设置的事件监听函数监听浏览器响应于用户端的表单编辑操作生成的编辑触发信号，并根据该编辑触发信号通过前端服务器和后端服务器更新存储在数据库的表单元数据，以实现动态表单的自动映射更新，从而弥补了现有技术中存在的问题，有效提高动态表单的应用灵活性，提高开发效率，降低开发成本，具有广泛的应用前景。
[0298]
本实施例的具体实施方式参见前述实施例，在此不再赘述。
[0299]
基于上述动态表单自动更新的方法，如图9所示，本技术的一个实施例还提供一种应用于后端服务器的动态表单自动更新的方法，包括：
[0300]
响应于前端服务器的调用，使用其与数据库连接的数据接口读取存储在所述数据库中的第二表单元数据并传输至所述前端服务器，经所述前端服务器传输至浏览器并缓存为第一表单元数据，以使得所述浏览器触发的表单引擎根据所述第一表单元数据设置事件监听函数并生成动态表单代码，以使得所述浏览器运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
[0301]
响应于所述前端服务器的调用，使用其与数据库连接的数据接口根据所述浏览器输出的修改后的第一表单元数据修改存储在所述数据库中的第二表单元数据，所述修改后的第一表单元数据为所述浏览器响应于用户端的表单编辑操作修改的、并生成编辑触发信号、由所述事件监听函数监听并将所述编辑触发信号传输至前端服务器，所述编辑触发信号包括结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0302]
本实施例的具体实施方式参见前述实施例，在此不再赘述。
[0303]
基于上述动态表单自动更新的方法，如图10所示，本技术的一个实施例还提供一种应用于数据库的动态表单自动更新的方法，包括：
[0304]
响应于后端服务器的数据接口的数据请求输出存储的第二表单元数据，以使得所述后端服务器将所述第二表单元数据传输至前端服务器并经所述前端服务器传输至浏览器并缓存为第一表单元数据，以使得所述浏览器获取并缓存第一表单元数据，以使得所述
浏览器触发的表单引擎根据所述第一表单元数据设置事件监听函数并生成动态表单代码，以使得所述浏览器运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
[0305]
响应于后端服务器的数据接口的更新请求，并根据所述后端服务器发送的修改后的第一表单元数据更新存储的第二表单元数据，所述修改后的第一表单元数据为所述浏览器响应于用户端的表单编辑操作修改的、并生成编辑触发信号、由所述事件监听函数监听并将所述编辑触发信号传输至前端服务器、经所述前端服务器传输至所述后端服务器所述编辑触发信号包括结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0306]
本实施例的具体实施方式参见前述实施例，在此不再赘述。
[0307]
基于上述动态表单自动更新的方法，如图11所示，本技术的一个实施例还提供一种应用于用户端的动态表单自动更新的方法，包括：
[0308]
根据输入的表单启动操作触发浏览器，以使得所述浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源、解析并执行所述资源、触发表单引擎以获取第一表单元数据，以使得所述表单引擎根据所述第一表单元数据设置事件监听函数并生成动态表单代码，以使得所述浏览器运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
[0309]
根据输入的表单编辑操作触发浏览器，以使得所述浏览器修改所述第一表单元数据并生成编辑触发信号，由所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器、并经所述前端服务器调用后端服务器的数据接口并根据修改后的第一表单元数据更新存储在所述数据库中的第二表单元数据，所述编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0310]
本实施例的具体实施方式参见前述实施例，在此不再赘述。
[0311]
基于上述动态表单自动更新的方法，相对应的，本技术的一个实施例还提供一种实现上述动态表单自动更新方法的动态表单自动更新系统，由于本技术实施例提供的动态表单自动更新系统与上述几种实施例提供的动态表单自动更新方法相对应，因此在前实施方式也适用于本实施例提供的动态表单自动更新系统，在本实施例中不再详细描述。
[0312]
如图2所示，本技术的一个实施例还提供一种动态表单自动更新系统，包括用户端、浏览器、前端服务器、后端服务器和数据库，所述浏览器被配置为：
[0313]
响应于用户端的表单启动操作向前端服务器发送资源请求指令，并从所述前端服务器获取资源；
[0314]
解析并执行所述资源，触发表单引擎以获取第一表单元数据，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少
一个键值对，每个键值对包括属性和值；
[0315]
根据所述第一表单元数据设置事件监听函数并生成动态表单代码；
[0316]
运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；
[0317]
响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器，并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据，所述编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0318]
在本实施例中，通过设置的事件监听函数监听浏览器响应于用户端的表单编辑操作生成的编辑触发信号，并根据该编辑触发信号通过前端服务器和后端服务器更新存储在数据库的表单元数据，以实现动态表单的自动映射更新，从而弥补了现有技术中存在的问题，有效提高动态表单的应用灵活性，提高开发效率，降低开发成本，具有广泛的应用前景。
[0319]
如图12所示，本实施例还提供一种动态表单自动更新系统，包括用户端 (图中未示出)、浏览器(图中web浏览器)、浏览器从前端服务器加载资源后的组件(图中可视化编辑器和联机分析处理编辑器)、前端服务器(存储的资源包括:js、html、css、img等的web服务器)、后端服务器(图中后端应用服务器和分布式sql引擎服务器)、以及数据库(图中数据库服务器)。
[0320]
其中：
[0321]
浏览器包括多个浏览器界面，即图中所示html页面1、html页面2和 html页面3，用于分别显示不同的动态表单。
[0322]
浏览器从前端服务器加载资源(js、html、css、img)的可视化编辑器和联机分析处理编辑器，可视化编辑器包括动态表单表单引擎，设置委派表单模式，即设置事件监听函数，并根据结构化数据的表单元数据自动映射为动态表单和结构化数据，同时根据表单元数据生成dom动态表单代码，对应于浏览器可识别的可视化组件；联机分析处理编辑器，用于对可视化组件业务数据，如图表的数据注入填充。
[0323]
前端服务器为nginx的高性能http和反向代理web服务器，处理静态文件，提供web服务。
[0324]
后端服务器包括后端应用服务器和分布式sql引擎服务器。其中，后端应用服务器包括动态表单api、平台基础api、client和业务数据api，其中，动态表单api为前端服务器和后端服务器的数据接口，用于前端服务器和后端服务器的数据通信；平台基础api用于平台用户权限功能模块等管理；client用于与分布式sql引擎服务器通信；业务数据api用于可视化图表的业务数据显示；分布式sql引擎服务器用于提供可视化图表的业务数据。
[0325]
数据库包括平台数据库和业务数据库，其中平台数据库为关系型数据库 (例如postgres)，用于存储表单元数据；业务数据库包括关系型数据库(例如 postgres和mysql)，用于泛指存储业务或统计数据，如用户支付订单明细，某件商品的日交易量或交易额等。
[0326]
本发明的另一个实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现：浏览器响应于用户端的表单启动操作向前端服务器发送资源请求指令，并从所述前端服务器获取资源；解析并执行所述资源、触发表单引擎以获取
第一表单元数据，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；根据所述第一表单元数据设置事件监听函数并生成动态表单代码；运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数；响应于用户端的表单编辑操作修改所述第一表单元数据并生成编辑触发信号，所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器，并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据，所述编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0327]
本发明的另一个实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现：前端服务器响应于浏览器发送的资源请求指令将存储的资源发送至浏览器，以使得所述浏览器解析并执行所述资源，触发表单引擎；响应于所述表单引擎的请求调用后端服务器的数据接口读取存储在数据库中的第二表单元数据并发送至所述浏览器，以使得所述表单引擎获取第一表单元数据并存储在所述浏览器中、根据所述第一表单元数据设置事件监听函数并生成动态表单代码、运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；响应于接收的编辑触发信号调用后端服务器的数据接口修改存储在数据库中的第二表单元数据，所述编辑触发信号为所述浏览器响应于用户端的表单编辑操作生成的、由所述事件监听函数监听并传输的，所述编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0328]
本发明的另一个实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现：后端服务器响应于前端服务器的调用，使用其与数据库连接的数据接口读取存储在所述数据库中的第二表单元数据并传输至所述前端服务器，经所述前端服务器传输至浏览器并缓存为第一表单元数据，以使得所述浏览器根据所述第一表单元数据设置事件监听函数并生成动态表单代码、运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；
[0329]
响应于所述前端服务器的调用，使用其与数据库连接的数据接口将所述浏览器输出的修改后的第一表单元数据修改存储在所述数据库中的第二表单元数据，所述修改后的第一表单元数据为所述浏览器响应于用户端的表单编辑操作修改的、并生成编辑触发信号、由所述事件监听函数监听并将所述编辑触发信号传输至前端服务器，所述编辑触发信号包括结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0330]
本发明的另一个实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现：数据库响应于后端服务器的数据接口的数据请求输出存储的第二表单元数据，以使得所述后端服务器将所述第二表单元数据传输至前端服务器并经所述前端服务器传输至浏览器并缓存为第一表单元数据，以使得所述浏览器获取并缓存
第一表单元数据、根据所述第一表单元数据设置事件监听函数并生成动态表单代码、运行动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；响应于后端服务器的数据接口的更新请求，并根据后端服务器发送的修改后的第一表单元数据更新存储的第二表单元数据，所述修改后的第一表单元数据为所述浏览器响应于用户端的表单编辑操作修改的、并生成编辑触发信号、由所述事件监听函数监听并将所述编辑触发信号传输至前端服务器，所述编辑触发信号包括结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0331]
本发明的另一个实施例提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现：用户端根据输入的表单启动操作触发浏览器，以使得所述浏览器向前端服务器发送资源请求指令，并从所述前端服务器获取资源、解析并执行所述资源、触发表单引擎以获取第一表单元数据、根据所述第一表单元数据设置事件监听函数并生成动态表单代码、运行所述动态表单代码呈现可视化动态表单并触发所述事件监听函数，所述第一表单元数据为所述浏览器执行所述资源触发表单引擎、由所述表单引擎请求前端服务器并经所述前端服务器调用后端服务器的数据接口读取的存储在数据库中的第二表单元数据、并缓存在所述浏览器中，所述第二表单元数据为结构化数据，包括至少一个对象，每个对象包括至少一个键值对，每个键值对包括属性和值；根据输入的表单编辑操作触发浏览器，以使得所述浏览器修改所述第一表单元数据并生成编辑触发信号，以使得所述事件监听函数监听并传输所述编辑触发信号至所述前端服务器、并经所述前端服务器调用后端服务器的数据接口修改存储在所述数据库中的第二表单元数据，所述编辑触发信号包括预设置的结构化数据编辑包，所述结构化数据编辑包用于表征所述表单编辑操作引起的数据变化。
[0332]
在实际应用中，所述计算机可读存储介质可以采用一个或多个计算机可读的介质的任意组合。计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质。计算机可读存储介质例如可以是但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机存取存储器(ram)、只读存储器(rom)、可擦式可编程只读存储器(eprom或闪存)、光纤、便携式紧凑磁盘只读存储器 (cd-rom)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本实施例中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。
[0333]
计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。
[0334]
计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于无线、电线、光缆、rf等等，或者上述的任意合适的组合。
[0335]
可以以一种或多种程序设计语言或其组合来编写用于执行本发明操作的计算机
程序代码，所述程序设计语言包括面向对象的程序设计语言—诸如java、 smalltalk、c ，还包括常规的过程式程序设计语言—诸如“c”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络——包括局域网(lan)或广域网(wan)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
[0336]
如图13所示，本发明的另一个实施例提供的一种计算机设备的结构示意图。图13显示的计算机设备12仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。
[0337]
如图13所示，计算机设备12以通用计算设备的形式表现。计算机设备12 的组件可以包括但不限于：一个或者多个处理器或者处理单元16，系统存储器 28，连接不同系统组件(包括系统存储器28和处理单元16)的总线18。
[0338]
总线18表示几类总线结构中的一种或多种，包括存储器总线或者存储器控制器，外围总线，图形加速端口，处理器或者使用多种总线结构中的任意总线结构的局域总线。举例来说，这些体系结构包括但不限于工业标准体系结构 (isa)总线，微通道体系结构(mac)总线，增强型isa总线、视频电子标准协会 (vesa)局域总线以及外围组件互连(pci)总线。
[0339]
计算机设备12典型地包括多种计算机系统可读介质。这些介质可以是任何能够被计算机设备12访问的可用介质，包括易失性和非易失性介质，可移动的和不可移动的介质。
[0340]
系统存储器28可以包括易失性存储器形式的计算机系统可读介质，例如随机存取存储器(ram)30和/或高速缓存存储器32。计算机设备12可以进一步包括其它可移动/不可移动的、易失性/非易失性计算机系统存储介质。仅作为举例，存储系统34可以用于读写不可移动的、非易失性磁介质(图13未显示，通常称为“硬盘驱动器”)。尽管图13中未示出，可以提供用于对可移动非易失性磁盘(例如“软盘”)读写的磁盘驱动器，以及对可移动非易失性光盘(例如 cd-rom，dvd-rom或者其它光介质)读写的光盘驱动器。在这些情况下，每个驱动器可以通过一个或者多个数据介质接口与总线18相连。存储器28可以包括至少一个程序产品，该程序产品具有一组(例如至少一个)程序模块，这些程序模块被配置以执行本发明各实施例的功能。
[0341]
具有一组(至少一个)程序模块42的程序/实用工具40，可以存储在例如存储器28中，这样的程序模块42包括但不限于操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。程序模块42通常执行本发明所描述的实施例中的功能和/或方法。
[0342]
计算机设备12也可以与一个或多个外部设备14(例如键盘、指向设备、显示器24等)通信，还可与一个或者多个使得用户能与该计算机设备12交互的设备通信，和/或与使得该计算机设备12能与一个或多个其它计算设备进行通信的任何设备(例如网卡，调制解调器等等)通信。这种通信可以通过输入/输出(i/o) 接口22进行。并且，计算机设备12还可以通过网络适配器20与一个或者多个网络(例如局域网(lan)，广域网(wan)和/或公共网络，例如因特网)通信。如图13所示，网络适配器20通过总线18与计算机设备12的其它模块通信。应当明白，尽管图13中未示出，可以结合计算机设备12使用其它硬件和/或软件模块，
包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、raid系统、磁带驱动器以及数据备份存储系统等。
[0343]
处理器单元16通过运行存储在系统存储器28中的程序，从而执行各种功能应用以及数据处理，例如实现本发明实施例所提供的一种动态表单自动更新的方法。
[0344]
本发明针对目前现有的问题，制定一种动态表单自动更新的方法、系统、计算机设备和介质，通过设置的事件监听函数监听浏览器响应于用户端的表单编辑操作生成的编辑触发信号，并将该编辑触发信号传输至前端服务器和后端服务器更新存储在数据库的表单元数据，以实现动态表单的自动映射更新，从而弥补了现有技术中存在的问题，有效提高动态表单的应用灵活性，提高开发效率，降低开发成本，具有广泛的应用前景。
[0345]
显然，本发明的上述实施例仅仅是为清楚地说明本发明所作的举例，而并非是对本发明的实施方式的限定，对于所属领域的普通技术人员来说，在上述说明的基础上还可以做出其它不同形式的变化或变动，这里无法对所有的实施方式予以穷举，凡是属于本发明的技术方案所引伸出的显而易见的变化或变动仍处于本发明的保护范围之列。