CN115455013A

CN115455013A - Method, system, computer equipment and medium for automatically updating dynamic form

Info

Publication number: CN115455013A
Application number: CN202110644247.7A
Authority: CN
Inventors: 李卫华
Original assignee: BOE Technology Group Co Ltd
Current assignee: BOE Technology Group Co Ltd
Priority date: 2021-06-09
Filing date: 2021-06-09
Publication date: 2022-12-09

Abstract

The invention discloses a method, a system, computer equipment and a medium for automatically updating a dynamic form, wherein the method applied to a browser of one embodiment comprises the following steps: responding to the form starting operation of the user side, sending a resource request instruction to the front-end server, and acquiring resources from the front-end server; analyzing and executing resources, and triggering a form engine to acquire form unit data; setting an event monitoring function according to the table unit data and generating a dynamic table code; running a dynamic form code to present a visual dynamic form and triggering an event monitoring function; and modifying the table unit data in response to the form editing operation of the user side and generating an editing trigger signal, monitoring and transmitting the editing trigger signal to the front-end server by the event monitoring function, and calling a data interface of the rear-end server by the front-end server to modify the table unit data stored in the database. The embodiment can dynamically update the table unit data stored in the database through the event monitoring function, and has practical application value.

Description

Method, system, computer equipment and medium for automatically updating dynamic form

Technical Field

The present invention relates to the field of internet technologies, and in particular, to a method for automatically updating a dynamic form, an automatic dynamic form updating system, a computer storage medium, and a computer device.

Background

In the prior art, the application of the dynamic form is more and more popular, however, the problems of unclear demand, easy change of demand and the like exist in the development process of the traditional dynamic form, so that the form code developed in the previous period has the problem of large-scale modification, and the problems of workload increase and development period extension occur.

Therefore, how to realize automatic update of the dynamic form becomes a problem to be solved urgently at present.

Disclosure of Invention

In order to solve at least one of the above problems, a first embodiment of the present invention provides a method for automatically updating a dynamic form, which is applied to a browser, and includes:

responding to a form starting operation of a user side, sending a resource request instruction to a front-end server, and acquiring resources from the front-end server;

analyzing and executing the resource, triggering a form engine to obtain first table unit data, wherein the first table unit data is second table unit data which is read by a data interface of a front-end server and called by the front-end server and stored in a database and is executed by the browser, the form engine requests the front-end server, and the second table unit data is cached in the browser, is structured data and comprises at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value;

setting an event monitoring function according to the first table unit data and generating a dynamic form code;

running the dynamic form code to present a visual dynamic form and triggering the event monitoring function;

and modifying the first table unit data in response to the form editing operation of the user side and generating an editing trigger signal, monitoring and transmitting the editing trigger signal to the front-end server by the event monitoring function, and calling a data interface of a back-end server by the front-end server to modify the second table unit data stored in the database.

In a specific embodiment, the setting an event monitoring function according to the first table unit data and generating a dynamic form code further includes:

setting an event monitoring function according to the data structure of the first table unit data;

and generating a dynamic form code according to the data structure of the first table unit data.

In a specific embodiment, the setting an event snoop function according to the data structure of the first table unit data further includes:

dividing the first table unit data according to a preset element structure according to the data hierarchy of the first table unit data, wherein the preset element structure comprises a father element and nested child elements, and the first table unit data comprises at least one father element;

and setting the event monitoring function on the parent element, wherein the event monitoring function responds to the trigger of the browser for running the dynamic form code, and transmits the monitored editing trigger signal generated by the browser responding to the form editing operation of the user side to the front-end server.

In a specific embodiment, the generating the dynamic form code according to the data structure of the first form unit data further includes:

and traversing the objects included in the first table unit data and the key value pairs included in the objects according to the structured data of the first table unit data and generating corresponding dynamic form codes.

In a specific embodiment, the editing trigger signal includes a preset structured data editing packet, the structured data editing packet is used for characterizing data changes caused by the form editing operation, the modifying the first table unit data in response to the form editing operation at the user end and generating an editing trigger signal, and the monitoring and transmitting the editing trigger signal by the event monitoring function to the front-end server further includes:

and the event monitoring function monitors the editing trigger signal and caches a structured data editing packet of the editing trigger signal in the browser, sends all the structured data editing packets in the preset interval time to the front-end server according to the preset interval time, and calls a data interface of the back-end server through the front-end server to modify the second table unit data stored in the database.

In a specific embodiment, the structured data editing package comprises:

first structured data including a first editing key-value pair, configured to represent a first form editing operation, where the first form editing operation is a modification of a value of an existing key-value pair of an existing object of the first form unit data on a visual dynamic form presented by the browser at the user side, and the first editing key-value pair includes a first content key-value pair of the modified attribute and/or the modified value and a first coordinate key-value pair representing a coordinate position of the first content key-value pair;

or

The second structured data comprises a second editing key value pair and is used for representing a second form editing operation, the second form editing operation is that the user side adds a key value pair of an existing object of the first form unit data and the attribute and value of the key value pair to a visual dynamic form presented by the browser, and the second editing key value pair comprises a newly added second content key value pair and a second coordinate key value pair representing the coordinate position of the second content key value pair;

or

And third structured data, including a third editing key-value pair, configured to represent a third form editing operation, where the third form editing operation is an object, at least one key-value pair of the object, and an attribute and a value of the key-value pair, where the first form editing operation is newly added to a visual dynamic form presented by the browser by the user side, the third editing key-value pair includes a newly added third content key-value pair and a third coordinate key-value pair representing a coordinate position of the third content key-value pair, the third content key-value pair includes nested sub-content key-value pairs, and the third coordinate key-value pair includes nested sub-coordinate key-value pairs corresponding to the sub-content key-value pairs.

In a specific embodiment, the structured data editing package is digitally signed and asymmetrically encrypted by using a preset encryption function.

In a specific embodiment, after the modifying the first table unit data in response to the form editing operation at the user end and generating an editing trigger signal, and the event listening function listens to and transmits the editing trigger signal to the front-end server, the method further includes:

and performing data statistics by using a preset callback function and outputting statistical data.

In a particular embodiment, the dynamic form includes one or more of a text box, a multi-line text box, a password box, a hidden field, a check box, a radio box, a file upload box, and a drop-down selection box.

A second embodiment of the present invention provides a method for automatically updating a dynamic form, which is applied to a front-end server, and includes:

sending the stored resources to a browser in response to a resource request instruction sent by the browser, so that the browser analyzes and executes the resources and triggers a form engine;

calling a data interface of a back-end server in response to a request of the form engine to read second form unit data stored in a database and send the second form unit data to the browser, so that the form engine acquires first form unit data and stores the first form unit data in the browser, an event monitoring function is set according to the first form unit data, a dynamic form code is generated, the browser runs the dynamic form code to present a visual dynamic form and trigger the event monitoring function, the second form unit data are structured data and comprise at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value;

and calling a data interface of a back-end server to modify second table unit data stored in a database in response to a received editing trigger signal, wherein the editing trigger signal is generated by the browser in response to a form editing operation of a user side and is monitored and transmitted by the event monitoring function.

A third embodiment of the present invention provides a method for automatically updating a dynamic form, which is applied to a backend server and includes:

in response to the calling of a front-end server, reading second table unit data stored in a database by using a data interface connected with the database, transmitting the second table unit data to the front-end server, transmitting the second table unit data to a browser through the front-end server and caching the second table unit data as first table unit data, so that a form engine triggered by the browser sets an event monitoring function according to the first table unit data and generates dynamic form codes, and the browser runs the dynamic form codes to present visual dynamic forms and trigger the event monitoring function, wherein the second table unit data is structured data and comprises at least one object, each object comprises at least one key-value pair, and each key-value pair comprises an attribute and a value;

and in response to the call of the front-end server, modifying second table unit data stored in the database according to modified first table unit data output by the browser by using a data interface connected with the database, wherein the modified first table unit data is modified by the browser in response to form editing operation of a user side, generates an editing trigger signal, is monitored by the event monitoring function, and transmits the editing trigger signal to the front-end server.

A fourth embodiment of the present invention provides a method for automatically updating a dynamic form, which is applied to a database, and includes:

responding to a data request of a data interface of a back-end server, outputting stored second table unit data, so that the back-end server transmits the second table unit data to a front-end server, transmits the second table unit data to a browser through the front-end server, and caches the second table unit data as first table unit data, so that the browser acquires and caches the first table unit data, so that a form engine triggered by the browser sets an event monitoring function according to the first table unit data and generates dynamic form codes, so that the browser runs the dynamic form codes to present visual dynamic forms and trigger the event monitoring function, wherein the second table unit data are structured data and comprise at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value;

responding to an update request of a data interface of a back-end server, and updating stored second table unit data according to modified first table unit data sent by the back-end server, wherein the modified first table unit data is modified by the browser in response to form editing operation of a user side, generates an editing trigger signal, is monitored by the event monitoring function, transmits the editing trigger signal to a front-end server, and transmits the editing trigger signal to the back-end server through the front-end server.

A fifth embodiment of the present invention provides a method for automatically updating a dynamic form, which is applied to a user side, and includes:

triggering a browser according to an input form starting operation, so that the browser sends a resource request instruction to a front-end server, acquires a resource from the front-end server, analyzes and executes the resource, and triggers a form engine to acquire first form unit data, so that the form engine sets an event monitoring function according to the first form unit data and generates a dynamic form code, so that the browser runs the dynamic form code to present a visual dynamic form and trigger the event monitoring function, the first form unit data is second form unit data which is stored in a database and is read by the form engine to request the front-end server and call a data interface of a rear-end server through the front-end server, and is cached in the browser, the first form unit data is structured data and comprises at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value;

and triggering a browser according to the input form editing operation so that the browser modifies the first table unit data and generates an editing trigger signal, monitoring and transmitting the editing trigger signal to the front-end server by the event monitoring function, calling a data interface of a rear-end server by the front-end server, and updating second table unit data stored in the database according to the modified first table unit data.

A sixth embodiment of the present invention provides a system for automatically updating a dynamic form, including a user side, a browser, a front-end server, a back-end server, and a database, where the browser is configured to:

responding to form starting operation of a user side, sending a resource request instruction to a front-end server, and acquiring resources from the front-end server;

A seventh embodiment of the present invention provides a computer-readable storage medium, having a computer program stored thereon,

which program, when executed by a processor, carries out the method according to the first embodiment;

or alternatively

Which when executed by a processor performs the method according to the second embodiment;

or

Which when executed by a processor performs the method according to the third embodiment;

or

Which when executed by a processor performs the method according to the fourth embodiment;

or alternatively

Which when executed by a processor implements a method as described in the fifth embodiment.

An eighth embodiment of the present invention provides a computer apparatus comprising a memory, a processor, and a computer program stored on the memory and executable on the processor,

the processor, when executing the program, implements the method according to the first embodiment;

or

The processor, when executing the program, implements the method according to the second embodiment;

or

The processor, when executing the program, implements the method of the third embodiment;

or

The processor, when executing the program, implements the method of the fourth embodiment;

or alternatively

The processor, when executing the program, implements the method as described in the fifth embodiment.

The invention has the following beneficial effects:

aiming at the existing problems, the invention sets a method, a system, computer equipment and a medium for automatically updating the dynamic form, monitors an editing trigger signal generated by a browser in response to the form editing operation of a user side through a set event monitoring function, and updates table unit data stored in a database through a front-end server and a back-end server according to the editing trigger signal so as to realize the automatic mapping updating of the dynamic form, thereby solving the problems in the prior art, effectively improving the application flexibility of the dynamic form, improving the development efficiency, reducing the development cost and having wide application prospect.

Drawings

In order to more clearly illustrate the technical solutions in the embodiments of the present invention, the drawings required to be used in the description of the embodiments are briefly introduced below, and it is obvious that the drawings in the description below are only some embodiments of the present invention, and it is obvious for those skilled in the art that other drawings can be obtained according to the drawings without creative efforts.

FIG. 1 is a flow diagram illustrating a method for automatic update of a dynamic form according to an embodiment of the invention;

FIG. 2 is a block diagram illustrating the structure of the system for automatically updating dynamic forms according to an embodiment of the present invention;

FIG. 3 is an interaction swim lane diagram illustrating a method for automatic update of a dynamic form, according to an embodiment of the invention;

FIG. 4 is a flow chart illustrating a method for automatically updating a dynamic form according to an embodiment of the invention;

FIG. 5 is a diagram illustrating the structure of an event snoop function and table cell data according to an embodiment of the present invention;

FIG. 6 is a schematic diagram of a structured data compilation package according to an embodiment of the present invention;

FIGS. 7a-7l are diagrams illustrating a developer schema for a dynamic form according to another embodiment of the invention;

FIG. 8 is a flow diagram illustrating a method for automatic update of a dynamic form in accordance with another embodiment of the present invention;

FIG. 9 is a flow diagram illustrating a method for automatic update of dynamic forms in accordance with another embodiment of the invention;

FIG. 10 is a flow diagram illustrating a method for automatic update of dynamic forms in accordance with another embodiment of the invention;

FIG. 11 is a flow diagram illustrating a method for automatic update of dynamic forms in accordance with another embodiment of the invention;

FIG. 12 is a block diagram illustrating the structure of the dynamic form automatic update system according to another embodiment of the present invention;

fig. 13 shows a schematic structural diagram of a computer device according to another embodiment of the present invention.

Detailed Description

In order to more clearly illustrate the present invention, the present invention is further described below with reference to preferred embodiments and the accompanying drawings. Similar parts in the figures are denoted by the same reference numerals. It is to be understood by persons skilled in the art that the following detailed description is illustrative and not restrictive, and is not to be taken as limiting the scope of the invention.

As shown in fig. 1, an embodiment of the present invention provides a method for automatically updating a dynamic form, which is applied to a browser, and includes:

analyzing and executing the resource, triggering a form engine to acquire first table unit data, wherein the first table unit data is second table unit data which is read by a data interface of a front-end server and called by the front-end server and stored in a database and is executed by the browser, the form engine requests the front-end server, the second table unit data is cached in the browser, the second table unit data is structured data and comprises at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value;

and modifying the first table unit data in response to the form editing operation of a user side and generating an editing trigger signal, monitoring and transmitting the editing trigger signal to the front-end server by the event monitoring function, and calling a data interface of a back-end server through the front-end server to modify the second table unit data stored in the database.

In the embodiment, as shown in fig. 12, the form engine is a core technology for implementing automatic update of a dynamic form, and includes a visualization editor and a form dynamic framework, where the visualization editor presents a visualized data structure according to a data hierarchy relationship of structured data to implement a visualization operation on the structured data, and the form dynamic framework includes a plurality of functions and can call the executable functions to implement automatic update of the dynamic form.

It should be noted that the form engine may further include other components, such as a visualization component, and the like, which is not specifically limited in this application, and those skilled in the art should select an appropriate component according to the actual application situation, and details are not described herein.

In this embodiment, a browser acquires resources from a front-end server in response to a form start operation input by a user, parses and executes the resources, triggers a form engine to acquire first form unit data, sets an event monitoring function according to the first form unit data and generates a dynamic form code, the browser runs the dynamic form code to present a visual dynamic form and trigger the event monitoring function, modifies the first form unit data in response to a form editing operation of the user and generates an editing trigger signal, the set event monitoring function monitors and forwards the editing trigger signal to the front-end server, and the form unit data stored in a database is updated by the front-end server and a back-end server, so as to implement automatic mapping update of the dynamic form, thereby solving the problems existing in the prior art, effectively improving application flexibility of the dynamic form, improving development efficiency, reducing development cost, and having a wide application prospect.

In one embodiment, as shown in fig. 2, the system for automatically updating a dynamic form includes a client, a browser, a front-end server, a back-end server, and a database. The user can start the browser through the user side, and accesses the dynamic form by inputting a form starting operation, wherein the form starting operation is to input an internet standard resource address (URL) corresponding to the dynamic form in the browser, and modify the dynamic form in the browser by a form editing operation, and the form editing operation comprises operations of modifying and adding the dynamic form; the browser is a browser supporting the HTML5 technology, and can identify a mapping program of the dynamic form and visually display the mapping program; the front-end server is a high-performance HTTP and a reverse proxy Web server Nginx, and calls the back-end server and performs data transmission with the back-end server by calling an interface hypertext transfer protocol HTTP; the back-end server is java back-end service of SpringBoot deployed by a Linux system, calls the database through a calling interface JDBC and performs data transmission with the database; the database is a relational database and is used for storing table unit data of the dynamic table.

It should be noted that, in the present application, the hardware structures of the front-end server, the back-end server, and the database are not specifically limited, and may be independent hardware, or may be different parts based on the same hardware, and a person skilled in the art should select an appropriate hardware structure according to the actual application situation, and details are not described here.

As shown in fig. 1-4, the workflow of the dynamic form automatic update system is described in detail:

first, the browser sends a resource request instruction to a front-end server in response to a form starting operation of a user side, and acquires a resource from the front-end server.

In particular, as shown in figure 3,

s1, a user side responds to a form starting operation input by a user to trigger a browser.

In this embodiment, the user starts the browser through the user side, and accesses the dynamic form by inputting the internet standard resource address URL corresponding to the dynamic form. Specifically, the browser is triggered according to the URL address. That is, the user end starts the operation to trigger the browser according to the input form.

And S2, the browser sends a resource request instruction to the front-end server.

In this embodiment, the browser sends a resource request instruction to the front-end server according to the received URL address, and requests a resource stored in the front-end server, where the resource includes a static resource HTML text and a dynamic resource JS file.

It should be noted that, before the browser sends a resource request instruction to the front-end server in response to the form start operation of the user side and obtains a resource from the front-end server, the browser accesses the dynamic form through the front-end server, the back-end server and the database according to the URL of the dynamic form, and stores the static resource HTML text and the dynamic resource JS file of the dynamic form in the front-end server.

And S3, the front-end server returns resources to the browser.

In this embodiment, the front-end server sends the stored resource including the static resource HTML text and the dynamic resource JS file to the browser.

Secondly, the browser analyzes and executes the resource, triggers a form engine to obtain first form unit data, requests a front-end server by the form engine, calls a data interface of a rear-end server by the front-end server to read second form unit data stored in a database, and caches the second form unit data in the browser, wherein the first form unit data are stored in the database.

In particular, as shown in figure 3,

and S4, the browser analyzes and executes the resources and triggers a form engine.

In this embodiment, the browser parses and executes the dynamic resource JS file in the resource, while triggering the form engine to perform automatic mapping of the dynamic form by the form engine.

And S5, the form dynamic framework of the form engine sends a request to a front-end server to acquire first form unit data.

In this embodiment, a triggered form engine sends a request to a front-end server by using a form dynamic framework of the form engine, and the front-end server calls a back-end server to obtain table unit data stored in a database from the database through the back-end server.

And S6, the front-end server calls the rear-end server by using the first calling interface.

In this embodiment, as shown in fig. 4, the front-end server is a front-end Web server, and the front-end server and the back-end server communicate with each other through a first call interface of the front-end server, where the first call interface is a hypertext transfer protocol HTTP and is used for communicating with the back-end server. Specifically, the front-end server sends a hypertext transfer protocol HTTP to the back-end server through the first call interface, where the hypertext transfer protocol HTTP includes a hypertext transfer protocol HTTP corresponding to the URL address of the dynamic form. That is, the front-end server calls the data interface of the back-end server to read the second table unit data stored in the database in response to the request of the form dynamic framework of the form engine.

And S7, the back-end server acquires second table unit data from the database by using a second calling interface.

In this embodiment, the backend server is a backend application server, and communicates with the Database through a second invocation interface of the backend server, where the second invocation interface is JDBC (Java Database Connectivity), that is, a Java Database connection interface, and is used to communicate with the Database, where the second invocation interface requests the Database for second table unit data corresponding to the dynamic form stored in the Database, that is, a data address stored in the Database corresponding to a URL address of the dynamic form. The second table element data is structured data comprising at least one object, each object comprising at least one key-value pair, each key-value pair comprising an attribute and a value. That is, the back-end server reads the second table unit data stored in the database using its data interface connected to the database in response to the call of the front-end server.

And S8, the database returns the second table unit data to the back-end server.

In this embodiment, the database is a relational database, and stores metadata of the dynamic form, the metadata being structured data including at least one object, each object including at least one key-value pair, each key-value pair including an attribute and a value. Metadata characterizes a dynamic form by the inclusion of multiple key value pairs, that is, objects are described by the attributes and values of structured data. In other words, structured data, also called row data, is data logically represented and implemented by a two-dimensional table structure, strictly following the data format and length specifications, mainly stored and managed by a relational database. That is, the database outputs the stored second table unit data in response to a data request of the data interface of the back-end server.

It is worth pointing out that the structured data is used to describe the attribute and value of the dynamic form, and the dynamic form can be a one-dimensional form, i.e. an object form; or a multi-dimensional form, such as a form that is an object; this is not specifically limited in the present application, and those skilled in the art should select a suitable dynamic form according to the actual application requirement, which is not described herein again.

As shown in step 1 of fig. 4, the database transmits the second table unit data corresponding to the stored dynamic table to the back-end application server by using the JDBC interface between the back-end application server and the database.

And S9, the back-end server returns the first table unit data to the front-end server.

In this embodiment, the back-end server performs data processing according to the received second table unit data, for example, performs structural processing on the second table unit data to form the first table unit data that can be recognized by the front-end server. The back-end server converts the second table unit data into the structured first table unit data and transmits the first table unit data to the front-end server.

The back-end application server transmits the first table element data using the API interface with the front-end Web server, step 2 shown in fig. 4. Specifically, the first table unit data is description metadata MD of the dynamic form in the diagram, for example, a specific key-value pair includes:

wherein, fontFamily is the attribute of the key-Value pair, value is "normal", and is characterized as a drop-down box "select", the label of the drop-down box is "font series", the default Value is "normal", and the option of the drop-down box is "_ properties.

And S10, the front-end server returns the first table unit data to the browser.

In this embodiment, the front-end server further returns the first table unit data to the browser and caches the first table unit data in the browser.

Thirdly, setting an event monitoring function according to the first table unit data, generating a dynamic form code, operating the dynamic form code to present a visual dynamic form and triggering the event monitoring function.

In particular, as shown in figure 3,

s11, a form dynamic framework of the form engine sets an event monitoring function according to the first table unit data and generates a dynamic form code, and the browser runs the dynamic form code to present a visual dynamic form and trigger the event monitoring function.

In this embodiment, on one hand, the setting of the event monitoring function and the generation of the dynamic form code are realized through the form engine, and on the other hand, the browser is used to run the dynamic form code to present the visual dynamic form and trigger the event monitoring function at the same time.

In an optional embodiment, the setting an event listening function according to the first table unit data and generating a dynamic form code further includes: setting an event monitoring function according to the data structure of the first table unit data; and generating dynamic form codes according to the data structure of the first form unit data.

In this embodiment, a delegation form structure is established by using a form engine, as shown in fig. 5, the structure includes a parent node, a plurality of child nodes subordinate to the parent node, an event listening function (i.e., event function) provided on the parent node, and a trigger event provided on the parent node.

According to the setting, when a user side carries out modification operation on a visual dynamic form presented by a browser in response to the form editing operation of a user, the modification operation generates a trigger event (1), an event monitoring function arranged on a father node captures the trigger event (2), and a target child node executes an event (3), so that the specific process of triggering event monitoring and updating child node is completed.

In this embodiment, the first table unit data is divided according to a preset element structure according to a data hierarchy of the first table unit data, where the preset element structure includes a parent element and nested child elements, and the first table unit data includes at least one parent element; and setting the event monitoring function on the parent element, wherein the event monitoring function responds to the trigger of the browser for running the dynamic form code and transmits the monitored editing trigger signal generated by the browser responding to the form editing operation of the user side to the front-end server.

The parent element is a parent node in fig. 5, the child element is a child node in fig. 5, the first table unit data includes at least one node, and the node includes at least one key value pair of at least one object, that is, the node is a parent element of the first table unit data.

Specifically, in this embodiment, the form engine generates an editing trigger signal (i.e., a trigger event in fig. 5) according to a form editing operation received by the browser, and an event monitoring function (i.e., an event function in fig. 5) disposed on a parent element (i.e., a parent node in fig. 5) monitors that the editing trigger signal modifies the cached first table unit data (i.e., a target child node execution event in fig. 5), so as to modify the first table unit data, and simultaneously transmit the editing trigger signal to the front-end server, and update the second table unit data stored in the database by using an HTTP interface between the front-end server and the back-end server, and a JDBC interface between the back-end server and the database.

For example, the event monitoring function is set by using a form engine, wherein, "< div id =" main _ content "/>" is a parent node, and "< div id =" main _ content "/>, $ (' # main _ content '). Delete (' input, select ', ' change ', function (e) ' is to set the event monitoring function at the parent node.

It should be noted that, compared with the prior art that the event monitoring functions are arranged on each element, which results in complex interaction logic and is prone to confusion, conflict, redundancy and the like, in the embodiment, the event monitoring functions are arranged on the parent elements, and the parent nodes are used for event management in a unified manner, so that the method has the advantage of clear logic, and simultaneously improves the readability and maintainability of software and reduces the complexity of the program.

The method comprises the steps that when a form engine sets an event monitoring function, the form engine generates a dynamic form code according to a data structure of first table unit data, furthermore, objects included in the form engine and key value pairs included in the objects are traversed according to structural data of the first table unit data, and corresponding dynamic form codes are generated, and when the dynamic form codes are operated by a browser, a visual dynamic form is presented, and the event monitoring function is triggered.

In this embodiment, a form dynamic framework of the form engine is used to generate a Dom code according to the first form unit data, and specifically, the Dom code, that is, the dynamic form code, is generated according to a data structure of the first form unit data. For example, if the dynamic form is a one-dimensional form, the form data of the form is directly traversed, specifically, the object of the form is traversed, and the key value pairs, namely, the attributes and the values, included in the object are traversed, so as to generate corresponding dynamic form codes; if the form is a multi-dimensional form, the dimensions are traversed firstly, then the object of each dimension and the key value pair, namely the attribute and the value, included by the object are traversed, so that the traversal of the whole dynamic form is realized.

Specifically, the first table unit data is traversed.

Specifically, as shown in fig. 4, the form dynamic framework of the form engine converts one key-value pair in the first metadata into a Dom code, i.e., a Dom code having a form tag and a form field, so as to form a code text corresponding to each key-value pair of the first metadata one by one, so that the browser can recognize and present a visual dynamic form.

For example, the following key-value pairs are converted to the following Dom text using the form dynamic framework of the form engine.

In an alternative embodiment, the dynamic form includes one or more of a text box, a multi-line text box, a password box, a hidden field, a check box, a radio box, a file upload box, and a drop down selection box.

Specifically, the structured data form style of the dynamic form at least comprises the following styles:

1) Text box: a textbox is a form object that lets a visitor enter content himself, usually by filling in a single word or a short answer, such as name, address, etc.

Code format < input name = "attribute" value "/>)

2) Multi-line text box: form objects that let visitors enter content themselves are often used to fill in longer content.

Code format < textarea name = "attribute" > value </textarea >

3) A password frame: is a special text field for entering a password. When a visitor enters text, the text is replaced with an asterisk or other symbol and the entered text is hidden.

Code format < input type = "password" name = "attribute" value = "value"/>)

4) Hiding the domain: a hidden field is an invisible element used to collect or send information that is invisible to a visitor of a web page. When the form is submitted, the hidden field will send the information to the server with the name and values defined at the time of the setup.

Code format < input type = "hidden" name = "attribute" value = "value"/>)

5) Check boxes: the check box allows more than one option to be selected among the options to be selected. Each check box is a separate element that must have a unique name.

Code format < input type = "checkbox" name = "attribute" value = "value"/>)

6) A radio frame: the radio box is needed when the visitor is required to select a unique answer in the single choice.

Code format < input type = "radio" name = "attribute" value = "value"/>)

7) File uploading frame: the user is required to upload his own file, the file upload box looks like other text fields, but it also contains a browse button. The visitor can select the file to be uploaded by inputting the path of the file to be uploaded or clicking a browse button.

Code format < input type = "file" name = "attribute" value = "value"/>)

It should be noted that the file upload frame itself is structured data, the attribute of the key value pair is the file upload frame, the value is the path of the file, the uploaded file, such as a picture, a video or an audio, is not structured data, and the file is stored in the file system/tmp/upload/file/. The png (mp 4), and the uploaded file does not need to be updated in the process of automatically updating the dynamic form.

8) A drop-down selection box: the drop-down selection box allows the user to set a variety of options in a limited space.

Code format < select name = "attribute" > < option value = "value" > < option > </select > < value =

The above form styles are merely used to illustrate specific styles included in the present application and are not limited thereto.

It should be noted that, the application only generates the Dom code through the form dynamic framework of the form engine to describe a specific embodiment of the application, which is not specifically limited in this application, and may use the form engine technology, or may access a remote device, a cloud device, and the like through a browser to generate the dynamic form code, for example, a distributed server SAAS is used to generate the dynamic form code, and a person skilled in the art should select an appropriate form engine or device to generate the dynamic form code according to actual application requirements, which is not described herein again.

Further, the browser runs the dynamic form code, presents the visual dynamic form and triggers the event monitoring function.

In this embodiment, as shown in fig. 4, the browser renders a visualized dynamic form, such as a drop-down box labeled font series, and a text box labeled font size; and simultaneously triggering an event monitoring function, and monitoring an editing triggering signal generated by the browser in real time by the event monitoring function and transmitting the editing triggering signal to the front-end server.

And fourthly, the browser modifies the first table unit data in response to the table editing operation of the user side and generates an editing trigger signal, the event monitoring function monitors and transmits the editing trigger signal to the front-end server, and the front-end server calls a data interface of the back-end server to modify second table unit data stored in the database, wherein the editing trigger signal comprises a preset structured data editing packet, and the structured data editing packet is used for representing data change caused by the table editing operation.

In particular, as shown in figure 3,

and S12, the user side responds to the form editing operation input by the user to update the dynamic form.

And S13, the browser modifies the first table unit data according to the form editing operation and generates an editing trigger signal.

And S14, the event monitoring function running in the browser sends the monitored editing trigger signal to the front-end server.

In this embodiment, the user triggers the browser according to the input form editing operation. Specifically, as shown in step 5 in fig. 4, the first form unit data cached in the browser is modified according to the editing operation on the browser interface, that is, the attribute value of the dynamic form is automatically mapped to the form unit data cached in the browser after being changed; and simultaneously generating an editing trigger signal, wherein the editing trigger signal comprises a preset structured data editing package, and the structured data editing package is used for representing data change caused by the form editing operation. I.e., the dynamic form is updated by a form editing operation that modifies the dynamic form on the browser interface.

In an optional embodiment, after the modifying the first table element data in response to the form editing operation at the user end and generating an editing trigger signal, and the event listening function listens for and transmits the editing trigger signal to the front-end server, the method further includes: and performing data statistics by using a preset callback function and outputting statistical data.

In this embodiment, the data statistics operation can be further implemented through the preset callback function, and the statistical data is output according to the data statistics operation, so that the practical performance of the dynamic form is improved, and the dynamic form has practical application value.

Specifically, the browser modifies the first form unit data according to the form editing operation, and calls a callback function according to the generated editing trigger signal, so as to realize the statistical function of the dynamic form.

In an alternative embodiment, the structured data compilation package comprises: the first structured data comprises a first editing key-value pair and is used for representing a first form editing operation, the first form editing operation is that the user side modifies a value of an existing key-value pair of an existing object of the first form unit data on a visual dynamic form presented by the browser, and the first editing key-value pair comprises a modified first content key-value pair of the attribute and/or the value and a first coordinate key-value pair representing a coordinate position of the first content key-value pair.

In this embodiment, the structured data including the first structure form data is a value for modifying an existing key-value pair of an existing object, i.e. an update mode for updating a dynamic form.

In an alternative embodiment, the structured data compilation package comprises: and the second structured data comprises a second editing key value pair and is used for representing a second form editing operation, the second form editing operation is that the user side adds a key value pair of an existing object of the first form unit data and the attribute and value of the key value pair to a visual dynamic form presented by the browser, and the second editing key value pair comprises a newly added second content key value pair and a second coordinate key value pair representing the coordinate position of the second content key value pair.

In this embodiment, the structured data including the second structured data is a value of a key-value pair of the newly added existing object, for example, a key-value pair and a coordinate value corresponding to the key-value pair are added, so as to update the dynamic form. I.e., an update mode for updating the dynamic form.

In another alternative embodiment, the structured data compilation package includes: and third structured data, including a third editing key-value pair, configured to represent a third form editing operation, where the third form editing operation is an object, at least one key-value pair of the object, and an attribute and a value of the key-value pair, where the first form editing operation is newly added to a visual dynamic form presented by the browser by the user side, the third editing key-value pair includes a newly added third content key-value pair and a third coordinate key-value pair representing a coordinate position of the third content key-value pair, the third content key-value pair includes nested sub-content key-value pairs, and the third coordinate key-value pair includes nested sub-coordinate key-value pairs corresponding to the sub-content key-value pairs.

In this embodiment, the structured data including the third structural data is obtained by adding an object and values of key value pairs included in the object, for example, adding an object, and the values of key value pairs included in the object and coordinate values corresponding to the key value pairs, thereby implementing updating of the dynamic form. I.e., an update mode for updating the dynamic form.

In a specific example, as shown in fig. 6, two objects are added, the first object includes four key-value pairs, the attribute of the first key-value pair is "name" and the value is "Zhang three", the attribute of the second key-value pair is "age" and the value is "12", the attribute of the third key-value pair is "sender" and the value is "0", the fourth key-value pair is a hidden key-value pair, the attribute is "coordinate" and the value is "0"; the second object, like the first object, also includes four key-value pairs, the first key-value pair having an attribute of "name" and a value of "lie four", the second key-value pair having an attribute of "age" and a value of "15", the third key-value pair having an attribute of "generator" and a value of "1", the fourth key-value pair having a hidden key-value pair, an attribute of "coordinate" and a value of "1".

In view of the tamper resistance and data security issues of the dynamic form, in an optional embodiment, the method further includes performing digital signature and asymmetric encryption on the structured data editing package by using a preset encryption function.

In the embodiment, the structured data editing package is digitally signed by an encryption function arranged in a form dynamic framework of a form engine so as to prevent the first form unit data from being tampered; meanwhile, the structured data editing packet is asymmetrically encrypted through an encryption function arranged in a form dynamic frame of a form engine so as to prevent plaintext leakage; therefore, the anti-tampering performance and the data security performance of the dynamic form are effectively improved.

And S15, the front-end server calls the rear-end server by using the first calling interface.

In this embodiment, similar to the aforementioned communication between the front-end server and the back-end server, as shown in step 7 in fig. 4, the front-end server calls the back-end server using the HTTP interface corresponding to the back-end server, and transmits the editing trigger signal including the structured data editing packet to the back-end server.

And S16, the back-end server calls the database by using a second calling interface.

In this embodiment, similar to the aforementioned backend server and database communication, the backend server and database communication transmits the editing trigger signal including the structured data editing package to the database using the JDBC interface of the backend server, as shown in step 8 in fig. 4.

And S17, modifying the stored second table unit data by the database.

In the embodiment, the database modifies the second form data according to the editing trigger signal comprising the structured data editing package, thereby completing the automatic mapping update of the dynamic form.

Up to this point, the second table unit data stored in the database has been automatically updated by the above automatic dynamic form updating method, that is, the second table unit data stored in the database is updated.

In view of the update efficiency of the dynamic form, in an optional embodiment, the event listening function listens to the edit trigger signal and caches the structured data edit packet of the edit trigger signal in the browser, sends all the structured data edit packets within a predetermined interval to the front-end server according to the predetermined interval, and invokes a data interface of the back-end server through the front-end server to modify the second table unit data stored in the database.

In this embodiment, based on the event listening function set on the parent element, optimization and integration may be further performed, for example, multiple trigger events are processed uniformly. Specifically, the interval time of event unified processing is preset, the preset interval time is taken as a processing period, and multiple trigger events in one processing period are processed uniformly, so that network data interaction strategy optimization is performed on a parent element.

Specifically, the event monitoring function monitors the editing trigger signal and caches a structured data editing packet of the editing trigger signal in the browser, and after a preset interval, all the structured data editing packets cached in the interval are uniformly sent to the front-end server, so that multiple form editing operations are combined into one time for processing, namely, the multiple trigger events are locally cached in the browser, the updating efficiency of the browser, the front-end server, the rear-end server and the database is effectively improved, the bandwidth occupation and the load pressure of computing resources of the browser can be reduced, and the transmission efficiency is effectively improved.

Specifically, the preset interval time is set to 10 seconds, and the save () function is called every 10 seconds to uniformly modify the updated content to the second table unit data in the database through the communication interface of the front-end server-back-end server-database.

In view of the version control of dynamic forms, in an alternative embodiment, the browser further includes a storage unit that stores historical data, including all structured data compilation packages used by historical updates to roll back data.

In the present embodiment, the rollback performance of the table unit data of the dynamic form data can be realized by storing the structured data edit package updated in the browser each time. I.e., by storing a history of modifications locally in the browser to provide traceability and recoverability of the historical version of the dynamic form.

In a practical example, a student dynamic form of the student situation in the education field is taken as an example for detailed description, and the dynamic form comprises a basic form and a result form, wherein the basic form comprises basic information such as the name, the school number, the ID number, the sex, the age and the like of the student, and the result form comprises the name, the school number, the ID number, the Chinese score, the math score and the English score of the student. And automatically updating aiming at the updating requirement of the school on the basis of the dynamic form.

Updating requirement one: and changing the Chinese achievement, the mathematic achievement and the English achievement in the achievement list from the percent system to the A-E grade evaluation.

The specific automatic updating method comprises the following steps:

the first step is as follows: responding to a user to start a browser by using a computer, and inputting a URL (uniform resource locator) address corresponding to a student dynamic form;

the second step is that: the method comprises the steps that a browser sends a resource request instruction to a front-end server and obtains resources from the front-end server;

the third step: the browser analyzes and executes the resources, triggers the form engine to request the front-end server, calls the back-end server through HTTP interfaces of the front-end server and the back-end server, reads second table unit data of the stored student dynamic forms from the database through JDBC interfaces of the back-end server and the database, performs structural processing through the back-end server to generate first table unit data, transmits the first table unit data to the front-end server, transmits the first table unit data to the browser through the front-end server, and caches the first table unit data in the browser;

the fourth step: the form engine sets an event monitoring function according to a data structure of first form unit data and generates a dynamic form code, specifically, the form engine divides a parent element and nested child elements according to a data hierarchy relation of the first form unit data and sets the event monitoring function on the parent element, the form engine traverses an object included in the form engine and a key value pair included in the object according to structured data of the first form unit data and generates a corresponding dynamic form code, and the dynamic form code is transmitted to a browser to present a visual dynamic form;

the fifth step: the browser runs the dynamic form code to present a visual dynamic form and triggers the event monitoring function;

and a sixth step: responding to the key value pair values corresponding to the Chinese score, the mathematic score and the English score modified by the user on the browser page, modifying the first table unit data and generating an editing trigger signal, so that an event monitoring function arranged on a father node monitors the editing trigger signal and transmits the editing trigger signal to a front-end server;

the seventh step: the front-end server calls the back-end server through the HTTP interface, and the second table unit data stored in the database is modified through the back-end server, so that the dynamic form of the student is modified.

And closing the browser, restarting and inputting the URL address corresponding to the student dynamic form, and presenting the updated student dynamic form by the browser, wherein the Chinese score, the math score and the English score in the score form are in A-E grades.

Updating requirement two: sports scores are added to the score sheet.

The specific automatic updating method comprises the following steps:

the first step is as follows: responding to a user to start a browser by using a computer, and inputting a URL address corresponding to the student dynamic form;

the third step: the browser analyzes and executes the resources, triggers the form engine to request the front-end server, calls the rear-end server through an HTTP interface of the front-end server and the rear-end server, reads second table unit data of the stored student dynamic forms from the database through a JDBC interface of the rear-end server and the database, conducts structural processing through the rear-end server to generate first table unit data, transmits the first table unit data to the front-end server, transmits the first table unit data to the browser through the front-end server, and caches the first table unit data in the browser;

and a sixth step: responding to the fact that a user adds a sports score key value pair on a browser page and a position corresponding to the sports score key value pair, modifying the first table unit data and generating an editing trigger signal, so that an event monitoring function arranged on a father node monitors the editing trigger signal and transmits the editing trigger signal to a front-end server;

the seventh step: the front-end server calls the back-end server through the HTTP interface, and the second table unit data stored in the database are modified through the back-end server, so that the dynamic form of the student is modified.

And closing the browser, restarting and inputting the URL address corresponding to the student dynamic form, and presenting the updated student dynamic form by the browser, wherein the achievement form comprises Chinese achievements, mathematic achievements, english achievements and sports achievements.

Updating requirement three: a body temperature monitoring form is newly established in a student dynamic form, and the body temperature monitoring form comprises a student name, a student number, an ID number, a date and a body temperature.

The specific automatic updating method comprises the following steps:

and a sixth step: responding to a situation that a user adds a body temperature monitoring form on a browser page, and a plurality of key value pairs (student name, student number, ID number, date and body temperature) and positions corresponding to the key value pairs in the body temperature monitoring form, modifying the first table unit data and generating an editing trigger signal, so that an event monitoring function arranged at a father node monitors the editing trigger signal and transmits the editing trigger signal to a front-end server;

And closing the browser, restarting and inputting a URL (uniform resource locator) address corresponding to the student dynamic form, wherein the browser presents the updated student dynamic form, the student dynamic form comprises a basic form, a score form and a body temperature monitoring form, and the body temperature monitoring form comprises a student name, a student number, an ID (identity) number, a date and a body temperature.

In this embodiment, three updating manners are illustrated by the first updating requirement, the second updating requirement and the third updating requirement, which are only used to illustrate specific embodiments of the present application, and specific updating contents are not specifically limited.

In another practical example, the automatic update of a dynamic form with a polyline graph is taken as an example, the dynamic form includes a basic form and a chart style form, as shown in fig. 7b, the basic form includes basic information such as the name, width, height, position to the left of the page, position to the top of the page, and the like of the polyline graph; chart style sheets include a title, legend, prompt box, toolbar, palette color list, coordinate system, x-coordinate axis, y-coordinate axis, chart series, etc., where a title has several hundred style attributes including whether a sub-element is displayed, main title style, subtitle, chart title style, horizontal alignment, vertical alignment, main and subtitle spacing, distance to the left, etc.

The chart style forms are configured and updated through the line chart styles in the visual editor, wherein the chart series in the visual editor comprises a plurality of line chart series forms, and the line chart series forms comprise hundreds of style attributes such as types, series names, edited graphs, sizes of marks, text labels, line chart endpoint labels and the like. And automatically updating aiming at the line graph visualization requirement on the basis of the dynamic form.

Updating requirement one: the width, height, and relative page left positioning in the base form are changed from pixel values (width: 600px, height: 400px, relative page left positioning: 70 px) to percentages (width: 30%, height: 30%, relative page left positioning: 0%).

The specific automatic updating method comprises the following steps:

the first step is as follows: responding to a user to start a browser by using a computer, and inputting a URL address corresponding to the dynamic form of the line graph;

the third step: the browser analyzes and executes the resources, triggers the form engine to request the front-end server, calls the back-end server through HTTP interfaces of the front-end server and the back-end server, reads second table unit data of the stored dynamic form of the line drawing from the database through JDBC interfaces of the back-end server and the database, performs structural processing through the back-end server to generate first table unit data, transmits the first table unit data to the front-end server, transmits the first table unit data to the browser through the front-end server, and caches the first table unit data in the browser;

and a sixth step: responding to the values of key value pairs positioned on the left side of the modification height, width and relative page of a browser page by a user, modifying the first table unit data and generating an editing trigger signal, so that an event monitoring function arranged on a father node monitors the editing trigger signal and transmits the editing trigger signal to a front-end server;

the seventh step: the front-end server calls the back-end server through the HTTP interface, and modifies the second table unit data stored in the database through the back-end server, so that the dynamic form of the polyline graph is modified.

Eighth step: because the monitor function sets a callback function refreshed by the line graph, the line graph is also synchronously subjected to width in the visual editor: 30%, height: 30% and positioned to the left of the page: presentation of 0%.

Closing the browser, restarting and inputting the URL address corresponding to the dynamic form of the line graph, and presenting the updated dynamic form of the line graph by the browser, wherein the width, the height and the left side of the relative page in the basic form are positioned as the width: 30%, height: 30% and positioned to the left of the page: 0 percent.

Updating requirement two: add color, e.g., increase purple, in the palette color list.

The specific automatic updating method comprises the following steps:

the fourth step: the form engine sets an event monitoring function according to a data structure of the first table unit data and generates a dynamic form code, specifically, the form engine divides a parent element and nested child elements according to a data hierarchy relation of the first table unit data, sets the event monitoring function on the parent element, traverses an object included in the form engine and a key value pair included in the object according to structured data of the first table unit data, generates a corresponding dynamic form code, and transmits the dynamic form code to a browser to present a visual dynamic form;

and a sixth step: responding to the fact that a user adds a palette color list key value pair on a browser page and the position corresponding to the palette color list key value pair, modifying the first table unit data and generating an editing trigger signal, and enabling an event monitoring function arranged on a father node to monitor the editing trigger signal and transmit the editing trigger signal to a front-end server;

the seventh step: the front-end server calls the back-end server through the HTTP interface, and modifies the second table unit data stored in the database through the back-end server, so that the modification of the dynamic form of the polyline graph is realized.

The eighth step: since the monitor function sets the callback function of the line graph refresh, the first line graph in the visual editor changes from default blue to purple.

And closing the browser, restarting and inputting the URL address corresponding to the line drawing dynamic form, and presenting the updated line drawing dynamic form by the browser, wherein purple is listed in the palette color list.

Updating requirement three: a line chart series form is newly established in the line chart dynamic form chart series, and the series form comprises hundreds of items such as type, series name, marked graph, marked size, marked rotation angle, text label, line break point label and the like.

The specific automatic updating method comprises the following steps:

the first step is as follows: responding to a user to start a browser by using a computer, and inputting a URL address corresponding to the line graph dynamic form;

and a sixth step: and in response to the fact that a user adds a chart series form on a browser page, and a plurality of key value pairs (hundreds of items such as types, series names, marked graphs, marked sizes, marked rotation angles, text labels, broken line breakpoint labels and the like) and positions corresponding to the key value pairs in the chart series form, modifying the first table unit data and generating an editing trigger signal, so that an event monitoring function arranged at a father node monitors the editing trigger signal and transmits the editing trigger signal to a front-end server.

Closing the browser, restarting and inputting a URL address corresponding to the dynamic form of the line graph, wherein the browser presents an updated dynamic form of the line graph, the dynamic form of the line graph comprises a basic form and a chart style form, the basic form comprises basic information such as a line graph name, a width, a height, positioning relative to the left side of a page, positioning relative to the top of the page and the like, the chart style form comprises a title, a legend, a prompt box, a toolbar, a palette color list, a coordinate system, an x coordinate axis, a y coordinate axis, a chart series and the like, and the title comprises hundreds of style attributes such as whether sub-elements are displayed, a main title style, a sub-title, a chart title style, horizontal alignment, vertical alignment, a main and sub-title interval, distance from the left side and the like. The chart series comprises a plurality of broken line series forms, and the broken line series forms comprise hundreds of items such as types, series names, edited graphs, marked sizes, text labels, broken line endpoint labels and the like.

In this embodiment, three updating manners are illustrated by the first updating requirement, the second updating requirement, and the third updating requirement, which are only used to illustrate specific embodiments of the present application, and specific updating contents are not specifically limited.

To further illustrate the dynamic form automatic form update method provided by the present application, in this example, the tracking is performed by a developer mode, as shown in fig. 7a-7i, for example, the development device used is a computer, and the execution steps of the browser can be tracked by F12 pressing keys.

A new line chart series form is created in the line chart dynamic form chart series, and a developer mode is entered according to the visualized dynamic form presented by the browser:

the first step is as follows: as shown in fig. 7a, for example, enter dashboard page, click certain dashboard [ configure button ].

As can be seen from the figure, in the interface, a plurality of established dynamic forms, such as the dynamic form "4", "bankjbank management data analysis", and "test", are presented, and visual editing can be directly performed by clicking the corresponding dynamic form; searching can also be carried out through the name of the dynamic form; or click on "create visualization project" to create a new dynamic form.

In this example, a dynamic form is selected to create a line drawing series form.

The second step is that: and as shown in fig. 7b, entering a chart editor, clicking a line graph component, presenting a style editor corresponding to the chart component on the right side, and creating a required line graph through the style editor.

The third step: as shown in fig. 7c, after editing by the style editor, clicking the Elements tag, then clicking the "display" button, namely starting the mouse to select the dom mode, after clicking the button, moving the mouse to the diagram component and determining to select the diagram component, clicking the left button of the mouse, and displaying the dom source code of the diagram component in the code area below the page. Specifically, the method comprises the following steps: the diagram component as shown in the figure is located, the dom source code of the component is displayed in the code area below the page, and the component id = 'assembly-1be27 a-cd 2f-5c42-3948-1ec1686df2f2' is extracted, wherein the diagram component id begins with 'assembly-'.

The fourth step: as shown in FIG. 7d, according to the chart component id obtained in the previous step, click on the "console" tag, and input an execution command "$. Dynamic objects [ 'assembly-1be27a23-cd2f-5c42-3948-1ec1686df2f2' ]" in the command line, and obtain the object of the chart component in the browser memory.

The fifth step: as shown in fig. 7e, according to the input execution instruction, displaying the object content in the code region below the page, and clicking the down arrow on the right side of the object to expand the object content, where md is the table cell data description md of the chart component; the title is an attribute key value pair object of the chart component, namely a title form in a style form on the right side of the corresponding page.

And a sixth step: as shown in fig. 7f, clicking the title to expand the sub-structured data of the key-value pair object, specifically, locating the specific structured data of the title, and finding the mapping relationship between the structured data and the form. For example: in the display 'show' key value pair of the title object, the value of the attribute 'whether to display' is 'no', and the radio box corresponding to 'whether to display' in the title form on the right side of the page is displayed; in the display "text" key value pair of the title object, the value of the attribute "main heading" is null, corresponding to the text box of "main heading" in the heading form in the style form on the right side of the page.

The seventh step: as shown in FIG. 7g, entering the instruction through the instruction line to modify the structured data and reloading the form engine regenerates the DOM.

As shown in fig. 7h, the specific modifications are as follows:

1. modification [ title-whether shown ] instead 'yes', the command line enters the command:

$.dynamicObjects['assembly-1be27a23-cd2f-5c42-3948-1ec1686df2f2'].md.att ribute_deploy.title.value.show.value＝true

2. modification [ title-main title ] to 'patent', the instruction line enters the command:

dynamic objects [ 'assembly-1be27a23-cd2f-5c42-3948-1ec1686df2f2' ]. Md. Att attribute _ deployment. Title. Value. Text. Value = 'patent'.

Correspondingly, a structured data editing package is generated according to the modification, the structured data editing package comprises an object, namely a title, a radio box related to "display or not" in the title and a text box related to "main title", wherein the radio box of "display or not" comprises three key-value pairs, as shown in fig. 7i, the attribute of the first key-value pair is "name" and the value is "display or not", the attribute of the second key-value pair is "value" and the value is "false", the third key-value pair is a hidden key-value pair, the attribute is "coordinate" and the value is "011". Similarly, the text box of the "main title" also includes three key-value pairs, including a main title, a value, and coordinates, which are not described in detail herein.

It should be noted that, where the title is a parent node, and a radio box of "whether to display" and a text box of a "main title" are child nodes respectively, and an editing trigger signal is generated after the child nodes perform editing and modification, as shown in fig. 7j, an event monitoring function disposed on the parent node (i.e., a parent element in the drawing) monitors that the editing trigger signal modifies first table unit data cached in a browser, so as to modify the first table unit data, and transmits the editing trigger signal to a front-end server, and update second table unit data stored in a database by using an HTTP interface between the front-end server and a back-end server and a JDBC interface between the back-end server and the database.

The eighth step: as shown in fig. 7k, click the [ save ] button at the top of the page, and save the structured data to the database through the form engine; clicking a [ redo ] button, re-acquiring structured data, and calling a form engine to generate dom; and clicking the chart component to display the updated structured data and the corresponding chart form.

The ninth step: the reloads, as shown in FIG. 7l, and the updated dynamic form is presented.

And at this point, completing the newly-created line graph series form, and the setting and updating of each key value pair of the line graph.

It should be noted that the above embodiments describe the specific implementation of the present application in detail through the student dynamic forms in the education field and the automatic updating method of the dynamic forms with charts, but are not limited to be applied to other fields, such as the office dynamic forms of the OA office system in an enterprise, where the office dynamic forms include attendance dynamic forms, including leave-on forms, publishing forms, and the like; for example, monitoring dynamic forms in the field of property and security of parks include monitoring camera forms, automatic door forms, and the like; the automatic updating of the dynamic form has wide application prospect and practical application value.

Based on the above method for automatically updating a dynamic form, as shown in fig. 8, an embodiment of the present application further provides a method for automatically updating a dynamic form applied to a front-end server, including:

responding to a resource request instruction sent by a browser, sending a stored resource to the browser, so that the browser analyzes and executes the resource, and triggering a form engine;

and calling a data interface of a back-end server to modify second table unit data stored in a database in response to a received editing trigger signal, wherein the editing trigger signal is generated by the browser in response to a form editing operation of a user end and is monitored and transmitted by the event monitoring function, the editing trigger signal comprises a preset structured data editing packet, and the structured data editing packet is used for representing data change caused by the form editing operation.

In the embodiment, the set event monitoring function is used for monitoring the editing trigger signal generated by the browser in response to the form editing operation of the user side, and the table unit data stored in the database is updated through the front-end server and the back-end server according to the editing trigger signal, so that the automatic mapping update of the dynamic form is realized, the problems in the prior art are solved, the application flexibility of the dynamic form is effectively improved, the development efficiency is improved, the development cost is reduced, and the method has a wide application prospect.

For the specific implementation of this embodiment, reference is made to the foregoing embodiments, which are not described herein again.

Based on the above method for automatically updating a dynamic form, as shown in fig. 9, an embodiment of the present application further provides a method for automatically updating a dynamic form applied to a backend server, including:

in response to the calling of a front-end server, reading second table unit data stored in a database by using a data interface connected with the database, transmitting the second table unit data to the front-end server, transmitting the second table unit data to a browser through the front-end server, caching the second table unit data into first table unit data, enabling a form engine triggered by the browser to set an event monitoring function according to the first table unit data and generate dynamic form codes, enabling the browser to run the dynamic form codes to present visual dynamic forms and trigger the event monitoring function, wherein the second table unit data are structured data and comprise at least one object, each object comprises at least one key-value pair, and each key-value pair comprises an attribute and a value;

and in response to the calling of the front-end server, modifying second table unit data stored in the database according to modified first table unit data output by the browser by using a data interface connected with the database, wherein the modified first table unit data is modified by the browser in response to a form editing operation of a user end, generates an editing trigger signal, is monitored by the event monitoring function, and transmits the editing trigger signal to the front-end server, and the editing trigger signal comprises a structured data editing packet used for representing data change caused by the form editing operation.

Based on the above method for automatically updating a dynamic form, as shown in fig. 10, an embodiment of the present application further provides a method for automatically updating a dynamic form applied to a database, including:

responding to an update request of a data interface of a back-end server, and updating stored second table unit data according to modified first table unit data sent by the back-end server, wherein the modified first table unit data is modified by the browser in response to a form editing operation of a user side and generates an editing trigger signal, the editing trigger signal is monitored by the event monitoring function and transmitted to a front-end server, the editing trigger signal is transmitted to the back-end server by the front-end server and comprises a structured data editing packet, and the structured data editing packet is used for representing data change caused by the form editing operation.

Based on the above method for automatically updating a dynamic form, as shown in fig. 11, an embodiment of the present application further provides a method for automatically updating a dynamic form applied to a user side, including:

triggering a browser according to an input form editing operation so that the browser modifies the first form unit data and generates an editing trigger signal, monitoring and transmitting the editing trigger signal to the front-end server by the event monitoring function, calling a data interface of a back-end server by the front-end server, and updating second form unit data stored in the database according to the modified first form unit data, wherein the editing trigger signal comprises a preset structured data editing packet, and the structured data editing packet is used for representing data change caused by the form editing operation.

Based on the above method for automatically updating a dynamic form, correspondingly, an embodiment of the present application further provides an automatic dynamic form updating system for implementing the method for automatically updating a dynamic form, where the system for automatically updating a dynamic form provided in the embodiment of the present application corresponds to the methods for automatically updating a dynamic form provided in the foregoing embodiments, so that the foregoing embodiment is also applicable to the system for automatically updating a dynamic form provided in the embodiment, and is not described in detail in this embodiment.

As shown in fig. 2, an embodiment of the present application further provides a dynamic form automatic updating system, which includes a user side, a browser, a front-end server, a back-end server, and a database, where the browser is configured to:

and modifying the first table unit data in response to a form editing operation of a user side and generating an editing trigger signal, wherein the event monitoring function monitors and transmits the editing trigger signal to the front-end server, and calls a data interface of a back-end server to modify second table unit data stored in the database through the front-end server, the editing trigger signal comprises a preset structured data editing packet, and the structured data editing packet is used for representing data change caused by the form editing operation.

In the embodiment, the set event monitoring function is used for monitoring an editing trigger signal generated by the browser in response to the form editing operation of the user side, and the table unit data stored in the database is updated through the front-end server and the back-end server according to the editing trigger signal, so that the automatic mapping update of the dynamic form is realized, the problems in the prior art are solved, the application flexibility of the dynamic form is effectively improved, the development efficiency is improved, the development cost is reduced, and the method has a wide application prospect.

As shown in fig. 12, this embodiment further provides a dynamic form automatic updating system, which includes a user end (not shown in the figure), a browser (Web browser in the figure), a component of the browser after loading resources from a front-end server (visual editor and online analysis processing editor in the figure), a front-end server (Web server storing resources including js, html, css, img, etc.), a back-end server (back-end application server and distributed SQL engine server in the figure), and a database (database server in the figure).

Wherein:

the browser includes a plurality of browser interfaces, shown as HTML page 1, HTML page 2, and HTML page 3, for displaying different dynamic forms, respectively.

The browser loads a visual editor and an online analysis processing editor of resources (js, html, css and img) from a front-end server, wherein the visual editor comprises a dynamic form engine, sets a delegation form mode, namely an event monitoring function, automatically maps the delegation form mode into a dynamic form and structural data according to table unit data of the structural data, and generates a DOM dynamic form code according to the table unit data, and corresponds to a visual component which can be identified by the browser; and the online analysis processing editor is used for filling the visual component business data such as chart data.

The front-end server is a high-performance HTTP of Nginx and a reverse proxy web server, processes static files and provides web services.

The back-end server comprises a back-end application server and a distributed SQL engine server. The back-end application server comprises a dynamic form API, a platform basic API, a Client and a service data API, wherein the dynamic form API is a data interface of the front-end server and the back-end server and is used for data communication between the front-end server and the back-end server; the platform basic API is used for managing a platform user authority function module and the like; the Client is used for communicating with the distributed SQL engine server; the business data API is used for displaying business data of the visual chart; the distributed SQL engine server is used for providing business data of visual charts.

The database comprises a platform database and a service database, wherein the platform database is a relational database (such as postgres) and is used for storing table unit data; the business database includes relational databases (e.g., postgres and MySQL) for storing business or statistical data such as user payment order details, daily transaction amount or transaction amount for a particular good, etc.

Another embodiment of the present invention provides a computer-readable storage medium having stored thereon a computer program which, when executed by a processor, implements: the browser responds to form starting operation of a user side to send a resource request instruction to a front-end server and obtains resources from the front-end server; analyzing and executing the resource, triggering a form engine to obtain first table unit data, wherein the first table unit data is second table unit data which is read by a data interface of a front-end server and called by the form engine through the front-end server and stored in a database and is executed by the browser, the second table unit data is structured data and comprises at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value; setting an event monitoring function according to the first table unit data and generating a dynamic form code; running the dynamic form code to present a visual dynamic form and triggering the event monitoring function; and modifying the first table unit data in response to a form editing operation of a user side and generating an editing trigger signal, monitoring and transmitting the editing trigger signal to the front-end server by the event monitoring function, and calling a data interface of a back-end server through the front-end server to modify second table unit data stored in the database, wherein the editing trigger signal comprises a preset structured data editing packet, and the structured data editing packet is used for representing data change caused by the form editing operation.

Another embodiment of the present invention provides a computer-readable storage medium having stored thereon a computer program which, when executed by a processor, implements: the method comprises the steps that a front-end server responds to a resource request instruction sent by a browser to send a stored resource to the browser, so that the browser analyzes and executes the resource, and a form engine is triggered; calling a data interface of a back-end server in response to a request of the form engine to read second form unit data stored in a database and send the second form unit data to the browser, so that the form engine acquires first form unit data and stores the first form unit data in the browser, sets an event monitoring function according to the first form unit data, generates a dynamic form code, runs the dynamic form code to present a visual dynamic form and triggers the event monitoring function, the second form unit data are structured data and comprise at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value; and calling a data interface of a back-end server to modify second table unit data stored in a database in response to a received editing trigger signal, wherein the editing trigger signal is generated by the browser in response to a form editing operation of a user side and is monitored and transmitted by the event monitoring function, the editing trigger signal comprises a preset structured data editing package, and the structured data editing package is used for representing data change caused by the form editing operation.

Another embodiment of the present invention provides a computer-readable storage medium having stored thereon a computer program which, when executed by a processor, implements: the method comprises the steps that a back-end server responds to the calling of a front-end server, a data interface connected with a database is used for reading second table unit data stored in the database and transmitting the second table unit data to the front-end server, the second table unit data are transmitted to a browser through the front-end server and cached as first table unit data, so that the browser sets an event monitoring function according to the first table unit data and generates dynamic form codes, runs the dynamic form codes to present visual dynamic forms and trigger the event monitoring function, the second table unit data are structured data and comprise at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value;

and in response to the calling of the front-end server, modifying the modified first table unit data output by the browser by using a data interface connected with a database to store the second table unit data in the database, wherein the modified first table unit data is modified by the browser in response to a form editing operation of a user end, generates an editing trigger signal, is monitored by the event monitoring function, and transmits the editing trigger signal to the front-end server, and the editing trigger signal comprises a structured data editing packet which is used for representing data change caused by the form editing operation.

Another embodiment of the present invention provides a computer-readable storage medium having stored thereon a computer program which, when executed by a processor, implements: the database responds to a data request of a data interface of a back-end server to output stored second table unit data, so that the back-end server transmits the second table unit data to a front-end server, transmits the second table unit data to a browser through the front-end server and caches the second table unit data as first table unit data, so that the browser acquires and caches the first table unit data, sets an event monitoring function according to the first table unit data and generates a dynamic form code, runs the dynamic form code to present a visual dynamic form and trigger the event monitoring function, the second table unit data are structured data and comprise at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value; responding to an update request of a data interface of a back-end server, and updating stored second table unit data according to modified first table unit data sent by the back-end server, wherein the modified first table unit data is modified by the browser in response to a form editing operation of a user side, generates an editing trigger signal, is monitored by the event monitoring function, and transmits the editing trigger signal to a front-end server, the editing trigger signal comprises a structured data editing packet, and the structured data editing packet is used for representing data change caused by the form editing operation.

Another embodiment of the present invention provides a computer-readable storage medium having stored thereon a computer program which, when executed by a processor, implements: a user side triggers a browser according to an input form starting operation, so that the browser sends a resource request instruction to a front-end server, acquires resources from the front-end server, analyzes and executes the resources, triggers a form engine to acquire first form unit data, sets an event monitoring function according to the first form unit data, generates a dynamic form code, runs the dynamic form code to present a visual dynamic form and triggers the event monitoring function, the first form unit data is used for the browser to execute the resource trigger form engine, requests the front-end server by the form engine, calls a second form unit data which is read by a data interface of a rear-end server through the front-end server and is stored in a database, and caches the second form unit data in the browser, the second form unit data is structured data and comprises at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value; triggering a browser according to an input form editing operation, so that the browser modifies the first form unit data and generates an editing trigger signal, so that the event monitoring function monitors and transmits the editing trigger signal to the front-end server, and calls a data interface of a back-end server through the front-end server to modify second form unit data stored in the database, wherein the editing trigger signal comprises a preset structured data editing package, and the structured data editing package is used for representing data changes caused by the form editing operation.

In practice, the computer-readable storage medium may take any combination of one or more computer-readable media. The computer readable medium may be a computer readable signal medium or a computer readable storage medium. A computer readable storage medium may be, for example, but not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, apparatus, or device, or any combination of the foregoing. More specific examples (a non-exhaustive list) of the computer readable storage medium would include the following: an electrical connection having one or more wires, a portable computer diskette, a hard disk, a Random Access Memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing. In the present embodiment, a computer readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device.

A computer readable signal medium may include a propagated data signal with computer readable program code embodied therein, for example, in baseband or as part of a carrier wave. Such a propagated data signal may take any of a variety of forms, including, but not limited to, electro-magnetic, optical, or any suitable combination thereof. A computer readable signal medium may be any computer readable medium that is not a computer readable storage medium and that can communicate, propagate, or transport a program for use by or in connection with an instruction execution system, apparatus, or device.

Program code embodied on a computer readable medium may be transmitted using any appropriate medium, including but not limited to wireless, wireline, optical fiber cable, RF, etc., or any suitable combination of the foregoing.

Computer program code for carrying out operations for aspects of the present invention may be written in any combination of one or more programming languages, including an object oriented programming language such as Java, smalltalk, C + + or the like and conventional procedural programming languages, such as the "C" programming language or similar programming languages. The program code may execute entirely on the user's computer, partly on the user's computer, as a stand-alone software package, partly on the user's computer and partly on a remote computer or entirely on the remote computer or server. In the latter scenario, the remote computer may be connected to the user's computer through any type of network, including a Local Area Network (LAN) or a Wide Area Network (WAN), or the connection may be made to an external computer (for example, through the Internet using an Internet service provider).

As shown in fig. 13, another embodiment of the present invention provides a schematic structural diagram of a computer device. The computer device 12 shown in fig. 13 is only an example and should not bring any limitation to the function and the scope of use of the embodiments of the present invention.

As shown in FIG. 13, computer device 12 is in the form of a general purpose computing device. The components of computer device 12 may include, but are not limited to: one or more processors or processing units 16, a system memory 28, and a bus 18 that couples various system components including the system memory 28 and the processing unit 16.

Bus 18 represents one or more of any of several types of bus structures, including a memory bus or memory controller, a peripheral bus, an accelerated graphics port, and a processor or local bus using any of a variety of bus architectures. By way of example, such architectures include, but are not limited to, industry Standard Architecture (ISA) bus, micro-channel architecture (MAC) bus, enhanced ISA bus, video Electronics Standards Association (VESA) local bus, and Peripheral Component Interconnect (PCI) bus.

Computer device 12 typically includes a variety of computer system readable media. Such media may be any available media that is accessible by computer device 12 and includes both volatile and nonvolatile media, removable and non-removable media.

The system memory 28 may include computer system readable media in the form of volatile memory, such as Random Access Memory (RAM) 30 and/or cache memory 32. The computer device 12 may further include other removable/non-removable, volatile/nonvolatile computer system storage media. By way of example only, storage system 34 may be used to read from and write to non-removable, nonvolatile magnetic media (not shown in FIG. 13, commonly referred to as a "hard drive"). Although not shown in FIG. 13, a magnetic disk drive for reading from and writing to a removable, nonvolatile magnetic disk (e.g., a "floppy disk") and an optical disk drive for reading from or writing to a removable, nonvolatile optical disk (e.g., a CD-ROM, DVD-ROM, or other optical media) may be provided. In these cases, each drive may be connected to bus 18 by one or more data media interfaces. Memory 28 may include at least one program product having a set (e.g., at least one) of program modules that are configured to carry out the functions of embodiments of the invention.

A program/utility 40 having a set (at least one) of program modules 42 may be stored, for example, in memory 28, such program modules 42 including but not limited to an operating system, one or more application programs, other program modules, and program data, each of which or some combination of which may comprise an implementation of a network environment. Program modules 42 generally carry out the functions and/or methodologies of the described embodiments of the invention.

Computer device 12 may also communicate with one or more external devices 14 (e.g., keyboard, pointing device, display 24, etc.), with one or more devices that enable a user to interact with computer device 12, and/or with any devices (e.g., network card, modem, etc.) that enable computer device 12 to communicate with one or more other computing devices. Such communication may be through an input/output (I/O) interface 22. Also, computer device 12 may communicate with one or more networks (e.g., a Local Area Network (LAN), a Wide Area Network (WAN), and/or a public network such as the Internet) via network adapter 20. As shown in FIG. 13, the network adapter 20 communicates with the other modules of the computer device 12 via the bus 18. It should be appreciated that although not shown in FIG. 13, other hardware and/or software modules may be used in conjunction with computer device 12, including but not limited to: microcode, device drivers, redundant processing units, external disk drive arrays, RAID systems, tape drives, and data backup storage systems, to name a few.

The processor unit 16 executes various functional applications and data processing by running programs stored in the system memory 28, for example, implementing a method for automatic update of dynamic forms provided by the embodiments of the present invention.

Aiming at the existing problems, the invention sets a method, a system, computer equipment and a medium for automatically updating the dynamic form, monitors an editing trigger signal generated by a browser in response to the form editing operation of a user side through a set event monitoring function, transmits the editing trigger signal to a front-end server and a back-end server to update table unit data stored in a database, and realizes the automatic mapping update of the dynamic form, thereby solving the problems in the prior art, effectively improving the application flexibility of the dynamic form, improving the development efficiency, reducing the development cost and having wide application prospect.

It should be understood that the above-mentioned embodiments of the present invention are only examples for clearly illustrating the present invention, and are not intended to limit the embodiments of the present invention, and it will be obvious to those skilled in the art that other variations or modifications may be made on the basis of the above description, and all embodiments may not be exhaustive, and all obvious variations or modifications may be included within the scope of the present invention.

Claims

1. A method for automatically updating a dynamic form is applied to a browser, and is characterized by comprising the following steps:

analyzing and executing the resource, triggering a form engine to obtain first table unit data, wherein the first table unit data is second table unit data which is read by a data interface of a front-end server and called by the form engine through the front-end server and stored in a database and is executed by the browser, the second table unit data is structured data and comprises at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value;

2. The method of claim 1, wherein setting an event listening function according to the first table cell data and generating dynamic form code further comprises:

and generating dynamic form codes according to the data structure of the first form unit data.

3. The method of claim 2, wherein setting an event snoop function according to the data structure of the first table cell data further comprises:

and setting the event monitoring function on the parent element, wherein the event monitoring function responds to the trigger of the browser for running the dynamic form code and transmits the monitored editing trigger signal generated by the browser responding to the form editing operation of the user side to the front-end server.

4. The method of claim 2, wherein generating dynamic form code based on the data structure of the first table element data further comprises:

5. The method of claim 1, wherein the edit trigger signal comprises a preset structured data edit package, the structured data edit package is used for representing data changes caused by the form editing operation, the modifying the first table cell data in response to the form editing operation at the user end and generating an edit trigger signal, and the listening and transmitting the edit trigger signal to the front-end server by the event listening function further comprises:

and the event monitoring function monitors the editing trigger signal and caches a structured data editing packet of the editing trigger signal in the browser, all structured data editing packets in the preset interval time are sent to the front-end server according to the preset interval time, and a data interface of the back-end server is called by the front-end server to modify second table unit data stored in the database.

6. The method of claim 5, wherein the structured data compilation package comprises:

first structured data, including a first editing key-value pair, configured to characterize a first form editing operation, where the first form editing operation is a modification, by the user side, of a value of an existing key-value pair of an existing object of the first table unit data on a visual dynamic form presented by the browser, and the first editing key-value pair includes a first content key-value pair of the modified attribute and/or the modified value and a first coordinate key-value pair characterizing a coordinate position of the first content key-value pair;

or

7. The method of claim 6, wherein the structured data compilation package is digitally signed and asymmetrically encrypted using a preset encryption function.

8. The method of claim 1, wherein after the modifying the first form element data in response to a form editing operation at a user end and generating an editing trigger signal, the event listener function listens for and transmits the editing trigger signal to the front-end server, the method further comprises:

9. The method of any of claims 1-8, wherein the dynamic form comprises one or more of a text box, a multi-line text box, a password box, a hidden field, a check box, a radio box, a file upload box, and a drop-down selection box.

10. A method for automatically updating a dynamic form is applied to a front-end server, and is characterized by comprising the following steps:

11. A method for automatically updating a dynamic form is applied to a back-end server, and is characterized by comprising the following steps:

12. A method for automatically updating a dynamic form is applied to a database, and is characterized by comprising the following steps:

13. A method for automatically updating a dynamic form is applied to a user side and is characterized by comprising the following steps:

triggering a browser according to an input form starting operation, so that the browser sends a resource request instruction to a front-end server, acquires a resource from the front-end server, analyzes and executes the resource, and triggers a form engine to acquire first table unit data, so that the form engine sets an event monitoring function according to the first table unit data and generates a dynamic form code, so that the browser runs the dynamic form code to present a visual dynamic form and trigger the event monitoring function, wherein the first table unit data is used for executing the resource trigger form engine by the browser, requesting the front-end server by the form engine and calling a data interface of a back-end server through the front-end server to read second table unit data stored in a database and cached in the browser, the second table unit data is structured data and comprises at least one object, each object comprises at least one key value pair, and each key value pair comprises an attribute and a value;

14. A dynamic form automatic updating system is characterized by comprising a user side, a browser, a front-end server, a back-end server and a database, wherein the browser is configured to:

15. A computer-readable storage medium having stored thereon a computer program, characterized in that,

the program when executed by a processor implementing the method of any one of claims 1-9;

or alternatively

The program when executed by a processor implementing the method of claim 10;

or alternatively

The program when executed by a processor implementing the method of claim 11;

or

The program when executed by a processor implementing the method of claim 12;

or alternatively

Which program, when executed by a processor, carries out the method of claim 13.

16. A computer device comprising a memory, a processor, and a computer program stored on the memory and executable on the processor,

the processor, when executing the program, implementing the method of any one of claims 1-9;

or

The processor, when executing the program, implementing the method of claim 10;

or alternatively

The processor implementing the method of claim 11 when executing the program;

or alternatively

The processor, when executing the program, implementing the method of claim 12;

or alternatively

The processor, when executing the program, implements the method of claim 13.