WO2017028611A1 - 一种表单实现方法及装置 - Google Patents

一种表单实现方法及装置 Download PDF

Info

Publication number
WO2017028611A1
WO2017028611A1 PCT/CN2016/085356 CN2016085356W WO2017028611A1 WO 2017028611 A1 WO2017028611 A1 WO 2017028611A1 CN 2016085356 W CN2016085356 W CN 2016085356W WO 2017028611 A1 WO2017028611 A1 WO 2017028611A1
Authority
WO
WIPO (PCT)
Prior art keywords
module
label
server
data
implementation method
Prior art date
Application number
PCT/CN2016/085356
Other languages
English (en)
French (fr)
Inventor
占康
Original Assignee
中兴通讯股份有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 中兴通讯股份有限公司 filed Critical 中兴通讯股份有限公司
Publication of WO2017028611A1 publication Critical patent/WO2017028611A1/zh

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor

Definitions

  • the application relates to, but is not limited to, the field of web internet development, and in particular to a form implementation method and apparatus.
  • This article provides a form implementation method and device to improve the user experience of the form implementation method.
  • the embodiment of the invention provides a form implementation method, which comprises: designing a form by using a browser and a server BS architecture; and displaying a form based on a browser and a server BS architecture.
  • the design form includes: creating a form, editing a form, and saving the form.
  • the design form further includes: a preset or a custom configuration label template.
  • the creating a form includes:
  • the form information entered in the browser interface is received and saved, and the form information includes a form name.
  • saving the form includes: saving the form to the server's database in html (HyperText Markup Language) format.
  • html HyperText Markup Language
  • editing the form includes: laying out the form, generating a tag instance, and configuring the tag instance.
  • the laying out the form includes: forming a regular cell on the browser interface according to the input number of rows and the number of columns according to the layout label template.
  • the method further includes:
  • the cell is merged according to the received merge instruction, and/or the cell is split according to the received split instruction.
  • generating a tag instance includes:
  • the edit form further includes:
  • Configure validation rules and/or plug in tag instances, and/or configure style sheets.
  • the configuration verification rule includes:
  • the tag instance is bound to one or more validation rules based on the input validation rules.
  • the presentation form includes: setting a placeholder label at a position where the form needs to be displayed, obtaining form data corresponding to the attribute of the placeholder label, and parsing the form data to display the form.
  • the obtaining form data corresponding to the attribute of the placeholder label includes:
  • the parsing the form data to display the form comprises:
  • the corresponding style sheet file is dynamically loaded; and/or the script file associated with the corresponding plug-in is dynamically loaded when the form data is parsed and the plug-in information is obtained; And/or dynamically parsing the corresponding verification script file when parsing the form data and determining that there is a label to be verified;
  • An embodiment of the present invention provides a form implementation apparatus, including: a design module, configured to: The browser and the server BS architecture are used to design the form; the display module is set to: display the form based on the browser and the server BS architecture.
  • the design module includes: a creating submodule, an editing submodule, and a saving submodule; the creating submodule is configured to: create a form; the editing submodule is set to: edit a form; and the saving submodule is set to: Save the form.
  • the design module further includes: a label template sub-module, and the label template sub-module is configured as: a preset or a custom label template.
  • the creating submodule is set to:
  • the form information entered in the browser interface is received and saved, and the form information includes a form name.
  • the saving submodule is configured to: store the form in a database of the server in an html format.
  • the editing submodule includes: a layout unit, a generating unit, and a configuration unit; wherein:
  • the layout unit is configured to: arrange the form; the generating unit is configured to: generate a tag instance; and the configuration unit is configured to: configure the tag instance.
  • the layout unit is configured to form a regular cell on the browser interface according to the input number of rows and the number of columns according to the layout label template.
  • the layout unit is further configured to: perform a merge operation on the cell according to the received merge instruction, and/or perform a split operation on the cell according to the received split instruction.
  • the generating unit is configured to: receive an instruction to drag the label template to the specified cell, and generate a label instance corresponding to the label template.
  • the configuration unit is configured to: configure an attribute of the label instance.
  • the editing submodule further includes a verification rule unit, and the verification rule unit is configured to: configure a verification rule.
  • the editing sub-module further includes a plug-in unit, the plug-in unit configured to: plug-in the tag instance.
  • the editing submodule further includes a style sheet unit, and the style sheet unit is set to: Configure the style sheet.
  • the verification rule unit is configured to bind the tag instance to one or more verification rules according to the input verification rule.
  • the presentation module includes: an acquisition submodule and a parsing presentation submodule;
  • the obtaining submodule is configured to: set a placeholder label at a position where the form needs to be displayed, and obtain form data corresponding to the attribute of the placeholder label;
  • the parsing presentation sub-module is configured to parse the form data to display the form.
  • the obtaining submodule is configured to: acquire a script corresponding to the attribute of the placeholder label, extract a form name in the script, and obtain html data associated with the form name from a database of the server.
  • the parsing presentation sub-module is configured to dynamically load the corresponding style sheet file when parsing the form data, obtain the style sheet information, and/or parse the form data to obtain a plug-in
  • the script file associated with the corresponding plug-in is dynamically loaded; and/or when the form data is parsed and it is determined that the tag needs to be verified, the corresponding verification script file is dynamically loaded; the form data is inserted into the corresponding position for display.
  • the embodiment of the invention provides a form implementation method, which adopts a browser and a server BS architecture, and the method includes:
  • the form is stored in the server's database in html format.
  • the creating a form in the browser interface includes:
  • the form information entered in the browser interface is received and saved, and the form information includes a form name.
  • the form information further includes a classification of the form.
  • the method further includes: preset or customizing a label template.
  • the laying out the form includes: forming a regular cell on the browser interface according to the input number of rows and the number of columns according to the layout label template.
  • the method further includes:
  • the cell is merged according to the received merge instruction, and/or the cell is split according to the received split instruction.
  • the generating a label instance includes:
  • the configuring the tag instance includes: configuring an attribute of the tag instance.
  • the method further includes: configuring a verification rule.
  • the configuration verification rule includes:
  • the tag instance is bound to one or more validation rules based on the input validation rules.
  • the method further includes:
  • the tag instance is plugged in.
  • the method further includes: configuring a style sheet.
  • the method further comprises: presenting the form.
  • the displaying the form comprises:
  • a placeholder label is set, form data corresponding to the attribute of the placeholder label is obtained, and the form data is parsed to display the form.
  • the obtaining form data corresponding to the attribute of the placeholder label includes:
  • parsing the form data to display the form comprises:
  • the corresponding style sheet file is dynamically loaded; and/or the script file associated with the corresponding plug-in is dynamically loaded when the form data is parsed and the plug-in information is obtained; And/or dynamically parsing the corresponding verification script file when parsing the form data and determining that there is a label to be verified;
  • the embodiment of the present invention provides a form implementation apparatus, where the form implementation apparatus adopts a browser and a server BS architecture, and the form implementation apparatus includes a creation module, an editing module, and a saving module.
  • the creating module is configured to: create a form in a browser interface
  • the editing module includes: a layout sub-module, configured to: arrange the form; generate a sub-module, set to: generate a tag instance; and configure a sub-module, and set to: configure the tag instance;
  • the saving module is configured to: store the form in a database of the server in an html format.
  • the creating module is set to:
  • the form information entered in the browser interface is received and saved, and the form information includes a form name.
  • the form information further includes a classification of the form.
  • the device further includes: a template module, configured to: preset or customize a label template.
  • a template module configured to: preset or customize a label template.
  • the layout sub-module is configured to form a regular cell on the browser interface according to the input number of rows and the number of columns according to the layout label template.
  • the layout submodule is further configured to:
  • the cell is merged according to the received merge instruction, and/or the cell is split according to the received split instruction.
  • the generating submodule is set to:
  • the configuration submodule is configured to: configure an attribute of the tag instance.
  • the editing module further includes: a rule sub-module, configured to: configure a verification rule.
  • rule submodule is set to:
  • the tag instance is bound to one or more validation rules based on the input validation rules.
  • the editing module further includes: a plug-in sub-module, configured to: perform plug-in processing on the tag instance.
  • a plug-in sub-module configured to: perform plug-in processing on the tag instance.
  • the editing module further includes: a style sheet submodule, and the style sheet submodule is configured to: configure a style sheet.
  • the device further includes: a presentation form module, configured to: display the form.
  • a presentation form module configured to: display the form.
  • the presentation form module includes:
  • Obtaining a form sub-module configured to: set a placeholder label at a position where the form needs to be displayed, and obtain form data corresponding to the attribute of the placeholder label;
  • Parse the presentation form sub-module set to: parse the form data to display the form.
  • the obtaining a form submodule is set to:
  • parsing display form submodule is set to:
  • the corresponding style sheet file is dynamically loaded; and/or the script file associated with the corresponding plug-in is dynamically loaded when the form data is parsed and the plug-in information is obtained; And/or dynamically parsing the corresponding verification script file when parsing the form data and determining that there is a label to be verified;
  • Embodiments of the present invention also provide a computer readable storage medium storing computer executable instructions that are implemented by a processor to implement the above method.
  • Embodiments of the present invention provide a form implementation method, which is based on a BS architecture (Browser/Server, ie, a browser and a server structure, which unifies the client, simplifies system development, maintenance, and use, and is related to the Internet.
  • BS architecture Backser/Server
  • ie a browser and a server structure
  • the rise of technology a change or improved structure of the C/S structure.
  • the user interface is implemented by the WWW browser, and very few transaction logic is implemented in the front-end Browser, but the main transaction logic is Server-side Server implementation, forming a so-called three-layer 3-tier structure), completes the online design and application display of the form, and supports the use of all major browsers. On this basis, the user can conveniently navigate to the browser interface without installing the client.
  • the form design and preview are completed by visual means such as drag and drop; the completed design form can be used internally by the system, and an API interface can also be provided for third-party system calls.
  • FIG. 1 is a schematic structural diagram of a form implementation apparatus according to a first embodiment of the present invention
  • FIG. 2 is a schematic view showing the composition of a design module in the first embodiment of the present invention.
  • FIG. 3 is a schematic diagram showing the composition of an editing sub-module in the first embodiment of the present invention.
  • FIG. 4 is a schematic diagram showing the composition of a display module in a first embodiment of the present invention.
  • FIG. 5 is a flowchart of a method for implementing a form according to a second embodiment of the present invention.
  • FIG. 6 is a flowchart of a method for implementing a form according to a third embodiment of the present invention.
  • FIG. 7 is a schematic structural diagram of a form implementation apparatus according to a fourth embodiment of the present invention.
  • FIG. 8 is a schematic diagram showing the composition of an editing module in a fourth embodiment of the present invention.
  • FIG. 9 is a schematic diagram showing the composition of a presentation form module in a fourth embodiment of the present invention.
  • FIG. 10 is a flowchart of a method for implementing a form according to a fifth embodiment of the present invention.
  • FIG. 1 is a schematic structural diagram of a form implementation apparatus according to a first embodiment of the present invention.
  • the form implementation apparatus 1 provided by the embodiment of the present invention includes:
  • the design module 11 is configured to: design a form using a browser and a server BS architecture;
  • the presentation module 12 is configured to: display the form based on the browser and the server BS architecture.
  • the design module 11 in the above embodiment includes: a creating submodule 111, an editing submodule 112, and a saving submodule 113;
  • the creating submodule 111 is configured to: create a form;
  • the editing sub-module 112 is set to: edit the form;
  • the saving sub-module 113 is set to: save the form.
  • the design module 11 in the above embodiment further includes: a label template sub-module 114, and the label template sub-module 114 is configured to: preset or customize a label template.
  • the creating sub-module 111 in the above embodiment is configured to: receive and save the form information entered in the browser interface, where the form information includes a form name.
  • the form information in the above embodiments further includes a classification of the form.
  • the save sub-module 113 in the above embodiment is configured to store the form in a database of the server in an html format.
  • the editing submodule 112 in the above embodiment includes: a layout unit 1121, a generating unit 1122, and a configuration unit 1123; wherein:
  • the layout unit 1121 is configured to: arrange the form; the generating unit 1122 is configured to: generate a tag instance; the configuration unit 1123 is configured to: configure the tag instance.
  • the layout unit 1121 in the above embodiment is configured to form a regular cell on the browser interface according to the input number of rows and the number of columns according to the layout label template.
  • the layout unit 1121 in the above embodiment is further configured to: perform a merge operation on the cell according to the received merge instruction, and/or split the cell according to the received split instruction. .
  • the generating unit 1122 in the above embodiment is configured to: receive an instruction to drag a label template to a specified cell, and generate a label instance corresponding to the label template.
  • the configuration unit 1123 in the above embodiment is configured to configure an attribute of a tag instance.
  • the editing sub-module 112 in the above embodiment further includes a verification rule unit 1124, and the verification rule unit 1124 is configured to: configure a verification rule.
  • the verification rules unit 1124 in the above embodiment is configured to bind the tag instance to one or more validation rules in accordance with the input validation rules.
  • the editing sub-module 112 in the above embodiment further includes a plug-in unit 1125, which is configured to: plug-in a tag instance.
  • the editing sub-module 112 in the above embodiment further includes a style sheet unit 1126, and the style sheet unit 1126 is configured to: configure a style sheet to control the label to be displayed on the interface. Style.
  • the display module 12 in the above embodiment includes: an acquisition sub-module 121 and a parsing display sub-module 122;
  • the obtaining sub-module 121 is configured to: set a placeholder label at a position where the form needs to be displayed, and obtain form data corresponding to the attribute of the placeholder label;
  • the parsing presentation sub-module 122 is configured to parse the form data to display the form.
  • the obtaining sub-module 121 in the above embodiment is configured to: acquire a script corresponding to the attribute of the placeholder label, extract a form name in the script, and obtain the file from a database of the server.
  • the html data associated with the form name is configured to: acquire a script corresponding to the attribute of the placeholder label, extract a form name in the script, and obtain the file from a database of the server. The html data associated with the form name.
  • the parsing presentation sub-module 122 in the above embodiment is configured to dynamically load the corresponding style sheet file when parsing the form data, obtain the style sheet information, and/or parse the Form data, when the plug-in information is obtained, dynamically loading the script file associated with the corresponding plug-in; and/or dynamically parsing the corresponding verification script file when parsing the form data and determining that the label needs to be verified; Insert it into the appropriate location for display.
  • the user can conveniently complete the form design and display by means of drag and drop and the like on the browser interface without installing the client.
  • the embodiment of the invention enhances the extensibility and portability of the form system. Sex, and the ability to be compatible with standards.
  • FIG. 5 is a flowchart of a method for implementing a form according to a second embodiment of the present invention. As shown in FIG. 5, in the embodiment, the method for implementing a form provided by the embodiment of the present invention includes the following steps:
  • S201 designing a form by using a browser and a server BS architecture
  • S202 Display a form based on a browser and a server BS architecture.
  • the user can conveniently design and display the form through the browser without installing the client, which is convenient for the user to use.
  • the design form in the above embodiment includes: creating a form, editing a form, and saving a form.
  • the design form in the above embodiment further includes: a preset or custom configuration label template.
  • the creation form in the above embodiment includes:
  • the form information entered in the browser interface is received and saved, and the form information includes a form name.
  • the form information in the above embodiments further includes a classification of the form.
  • the save form in the above embodiment includes: storing the form in a database in a html format.
  • the editing form in the above embodiment includes: laying out the form, generating a tag instance, and configuring the tag instance.
  • the laying out of the form in the above embodiment comprises: forming a regular cell on the browser interface according to the input number of rows and the number of columns according to the layout label template.
  • the method further includes:
  • the cell is merged according to the received merge instruction, and/or the cell is split according to the received split instruction.
  • the generated tag instance in the foregoing embodiment includes:
  • configuring the label instance in the foregoing embodiment includes:
  • the edit form in the above embodiment further includes:
  • Configure validation rules and/or plug in tag instances, and/or configure style sheets.
  • the configuration verification rules in the foregoing embodiments include:
  • the presentation form in the above embodiment includes: setting a placeholder label at a position where the form needs to be displayed, acquiring form data corresponding to the attribute of the placeholder label, and parsing the form data to display the form.
  • the obtaining form data corresponding to the attribute of the placeholder label in the foregoing embodiment includes:
  • parsing the form data to display the form in the above embodiment includes:
  • the corresponding style sheet file is dynamically loaded; and/or the script file associated with the corresponding plug-in is dynamically loaded when the form data is parsed and the plug-in information is obtained; And/or dynamically parsing the corresponding verification script file when parsing the form data and determining that there is a label to be verified;
  • the user can conveniently complete the form design and display by means of drag and drop and the like on the browser interface without installing the client.
  • the embodiment of the invention enhances the extensibility and portability of the form system. Sex, and the ability to be compatible with standards.
  • FIG. 6 is a flowchart of a method for implementing a form according to a third embodiment of the present invention.
  • the form implementation method provided by the embodiment of the present invention adopts a browser and a server BS architecture, and the method includes :
  • the user can conveniently complete the form design and save in the visual manner on the browser interface without installing the client.
  • step S301 includes:
  • the form information entered in the browser interface is received and saved, and the form information includes a form name.
  • the form information in the above embodiments further includes a classification of the form.
  • the method further comprises: presetting or customizing a label template.
  • the laying out of the form in step 302 includes: forming a regular cell on the browser interface according to the input number of rows and the number of columns according to the layout label template.
  • the method further includes:
  • the cell is merged according to the received merge instruction, and/or the cell is split according to the received split instruction.
  • the generating tag instance in step 302 includes:
  • configuring the tag instance in step 302 includes configuring an attribute of the tag instance.
  • the method further includes: configuring the verification rule.
  • the configuration verification rule includes:
  • the tag instance is bound to one or more validation rules based on the input validation rules.
  • the method further includes:
  • the tag instance is plugged in.
  • the method further includes:
  • step 302 further includes: previewing the form
  • the method further comprises: presenting the form.
  • the displaying the form comprises:
  • a placeholder label is set, form data corresponding to the attribute of the placeholder label is obtained, and the form data is parsed to display the form.
  • the obtaining form data corresponding to the attribute of the placeholder label in the foregoing embodiment includes:
  • parsing the form data to display the form in the above embodiment includes:
  • the corresponding style sheet file is dynamically loaded; and/or the script file associated with the corresponding plug-in is dynamically loaded when the form data is parsed and the plug-in information is obtained; And/or dynamically parsing the corresponding verification script file when parsing the form data and determining that there is a label to be verified;
  • the user can conveniently complete the form design and display by means of drag and drop and the like on the browser interface without installing the client.
  • the embodiment of the invention enhances the extensibility and portability of the form system. Sex, and the ability to be compatible with standards.
  • FIG. 7 is a schematic structural diagram of a form implementation apparatus according to a fourth embodiment of the present invention.
  • the form implementation apparatus adopts a browser and a server BS architecture. As shown in FIG. 7, in the embodiment, the form implementation provided by the embodiment of the present invention is implemented.
  • Device 4 includes:
  • the creating module 41 is configured to: create a form in a browser interface
  • the editing module 42 includes: a layout sub-module 421, configured to: layout the form; a generating sub-module 422, configured to: generate a tag instance; and configure a sub-module 423, set to: The label instance is configured;
  • the saving module 43 is configured to store the form in a database of the server in an html format.
  • the user can conveniently complete the form design and save in the visual manner on the browser interface without installing the client.
  • the creation module 41 in the above embodiment is configured to:
  • the form information entered in the browser interface is received and saved, and the form information includes a form name.
  • the form information in the above embodiments further includes a classification of the form.
  • the apparatus 4 in the above embodiment further includes: a template module 44 configured to: preset or customize a label template.
  • the layout sub-module 421 in the above embodiment is configured to form a regular cell on the browser interface according to the input number of rows and the number of columns according to the layout label template.
  • the layout sub-module 421 in the above embodiment is further configured to:
  • the cell is merged according to the received merge instruction, and/or the cell is split according to the received split instruction.
  • the generating submodule 422 in the above embodiment is configured to:
  • the configuration submodule 423 in the above embodiment is configured to: configure an attribute of a tag instance.
  • the editing module 42 in the above embodiment further includes: a rule sub-module 424, configured to: configure a verification rule.
  • the rule sub-module 424 in the above embodiment is configured to:
  • the tag instance is bound to one or more validation rules based on the input validation rules.
  • the editing module 42 in the above embodiment further includes: a plug-in sub-module 425, configured to: perform plug-in processing on the tag instance.
  • the editing module 42 in the above embodiment further includes: a style sheet sub-module 426, configured to: configure a style sheet to control a style displayed by the label on the interface.
  • the apparatus 4 in the above embodiment further includes: a display table A single module 45, set to: present the form.
  • the presentation form module 45 in the above embodiment includes:
  • the obtaining form sub-module 451 is configured to: set a placeholder label at a position where the form needs to be displayed, and obtain form data corresponding to the attribute of the placeholder label;
  • the parsing presentation form sub-module 452 is configured to parse the form data to display the form.
  • the obtaining form sub-module 451 in the above embodiment is set to:
  • the parsing presentation form sub-module 452 in the above embodiment is configured to:
  • the corresponding style sheet file is dynamically loaded; and/or the script file associated with the corresponding plug-in is dynamically loaded when the form data is parsed and the plug-in information is obtained; And/or dynamically parsing the corresponding verification script file when parsing the form data and determining that there is a label to be verified;
  • the user can conveniently complete the form design and display by means of drag and drop and the like on the browser interface without installing the client.
  • the embodiment of the invention enhances the extensibility and portability of the form system. Sex, and the ability to be compatible with standards.
  • FIG. 10 is a flowchart of a method for implementing a form according to a fifth embodiment of the present invention. As shown in FIG. 10, in the embodiment, the method for implementing a form provided by the embodiment of the present invention includes the following steps:
  • the html specification is constantly changing, always accompanied by the introduction of new tags, while the new tags are gradually supported by mainstream browsers and eventually reach widespread use; old tags may be no longer recommended or will eventually be deprecated by browsers.
  • the configuration tag template function is provided in the system.
  • the first part of the label template is the main part of the label.
  • the comma-separated characters are followed by the attribute name.
  • the form designer first design the layout, that is, drag the layout label, set the number of rows and columns, and then drag the required label template to the appropriate position on the interface. After the label template is dragged onto the interface, the corresponding label instance is generated. Then need to further configure the tag instance, need to configure the attribute value, validation rules, etc., such as setting id, class, name, data source, and so on.
  • Design layout Drag in the layout label template, edit the number of rows and columns according to the actual situation, so that the regular cells are formed on the interface, and the cells can be merged and split, and the layout is further refined.
  • Configuration tag instance The tag template is dragged into the corresponding cell, and the default tag instance is generated.
  • the attribute of the tag instance can be further configured, and the configurable attribute is dynamically parsed by the content of the tag template, such as Multi-line text input box template, in addition to the public attributes id, class, name, the custom attributes extracted from the label template have the number of rows and columns.
  • Configuration plug-in In order to make the form application system reach a wider range of browser compatibility, it can be plugged in when configuring related tag instances.
  • the application system provides multiple sets of designed style sheet files.
  • the style sheet can control the style of labels displayed on the interface.
  • the css style sheet is used. In the design interface, you can select the style sheet file.
  • the css style itself is not directly embedded in the form html interface. Instead, the data-css attribute name is found in the form form tag. If there is no attribute name, one is generated. Add the value css-filename to the value of the name.
  • the form is saved, and the content of the form is stored in the database in the form of html.
  • the form page loads a custom script, processes the placeholder tag, extracts the tag-related attributes, and obtains the data of the form associated with the attribute in the database through the background interface.
  • Parsing the form data if the parsing form takes the style sheet information, the corresponding style sheet file is dynamically loaded, and if the parsing form takes the information that needs to be plugged, the corresponding plugin association is dynamically loaded.
  • the script and style file if parsed into a tag, need to be verified, then dynamically load the corresponding verification script file; after the files are loaded, the corresponding form data is inserted into the document interface for display.
  • the parsing takes the data-css attribute, the css file corresponding to the location is dynamically loaded;
  • the javascript file corresponding to the plugin is dynamically loaded
  • the parsed to form element contains a data-validate attribute
  • the corresponding validation javascript file is dynamically loaded.
  • the embodiment of the invention further provides a computer readable storage medium storing computer executable instructions, which are implemented by the processor to implement the form implementation method.
  • the embodiment of the invention provides an online form designer and a form application display system based on the BS architecture, and supports the use of all major browsers. Users do not need to install the client, they can easily complete the form design and preview in the browser interface through drag and drop; the completed form can be used internally by the system, and can also provide API interface for third-party system call; The embodiments of the present invention enhance the extensibility and portability of the form system, as well as the ability to be compatible with standards.
  • all or part of the steps of the above embodiments may also be implemented by using an integrated circuit. These steps may be separately fabricated into individual integrated circuit modules, or multiple modules or steps may be fabricated into a single integrated circuit module. achieve.
  • the devices/function modules/functional units in the above embodiments may be implemented by a general-purpose computing device, which may be centralized on a single computing device or distributed over a network of multiple computing devices.
  • the device/function module/functional unit in the above embodiment When the device/function module/functional unit in the above embodiment is implemented in the form of a software function module and sold or used as a stand-alone product, it can be stored in a computer readable storage medium.
  • the above mentioned computer readable storage medium may be a read only memory, a magnetic disk or an optical disk or the like.
  • the online design and application display of the form can be completed, and the main browsers can be used.
  • the user can conveniently complete the visualization on the browser interface by dragging and dropping, etc. without installing the client.
  • Form design and preview; the completed design form can be used internally by the system, and an API interface can also be provided for third-party system calls; by means of the embodiment of the invention, the scalability and portability of the form system and the compatibility of the standard are enhanced.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Databases & Information Systems (AREA)
  • Document Processing Apparatus (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本文公布一种表单实现方法及装置，以提高表单实现方法的用户体验。该方法包括：采用浏览器及服务器BS架构，设计表单；基于浏览器及服务器BS架构，展示表单。

Description

一种表单实现方法及装置 技术领域
本申请涉及但不限于web互联网开发领域，尤其是一种表单实现方法及装置。
背景技术
随着信息技术的发展，企业办公、运维等各项业务的开展越来越依赖于各种表单的传递和使用；然而传统的表单开发方式效率相对低下，尤其在大型项目中，表单页面开发周期长、存在大量的重复开发工作；各种表单充斥在***中，各自独立，后期也难以维护和升级，同时，相关技术的表单***通常都不具备良好的扩展性和可移植性，更无法满足移动互联网等新兴领域的应用需求；即，相关技术的表单实现方法的用户使用体验较差。
发明内容
以下是对本文详细描述的主题的概述。本概述并非是为了限制权利要求的保护范围。
本文提供了一种表单实现方法及装置，以提高表单实现方法的用户体验。
本发明实施例提供了一种表单实现方法，其包括：采用浏览器及服务器BS架构，设计表单；基于浏览器及服务器BS架构，展示表单。
可选地，所述设计表单包括：创建表单、编辑表单、保存表单。可选地，所述设计表单还包括：预设或自定义配置标签模板。
可选地，所述创建表单包括：
接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
可选地，保存表单包括：以html(HyperText Markup Language，超级文本标记语言)格式，将表单存入服务器的数据库。
可选地，编辑表单包括：对所述表单进行布局，生成标签实例，配置所述标签实例。
可选地，所述对所述表单进行布局，包括：按照布局标签模板，根据输入的行数和列数，在浏览器界面上形成规则的单元格。
可选地，所述在浏览器界面上形成规则的单元格之后，所述方法还包括：
根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
可选地，生成标签实例包括：
接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
可选地，所述编辑表单还包括：
配置验证规则，和/或将标签实例插件化，和/或配置样式表。
可选地，所述配置验证规则包括：
根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑定。
可选地，展示表单包括：在需要展示表单的位置，设置占位标签，获取与占位标签的属性对应的表单数据，解析表单数据以展示表单。
可选地，所述获取与所述占位标签的属性对应的表单数据包括：
获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
可选地，所述解析所述表单数据以展示表单包括：
在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；
将表单数据***到相应的位置进行展示。
本发明实施例提供了一种表单实现装置，其包括：设计模块，设置为： 采用浏览器及服务器BS架构，设计表单；展示模块，设置为：基于浏览器及服务器BS架构，展示表单。
可选地，设计模块包括：创建子模块、编辑子模块和保存子模块；所述创建子模块设置为：创建表单；所述编辑子模块设置为：编辑表单；所述保存子模块设置为：保存表单。
可选地，设计模块还包括：标签模板子模块，所述标签模板子模块设置为：预设或自定义标签模板。
可选地，所述创建子模块设置为：
接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
可选地，所述保存子模块设置为：以html格式，将表单存入服务器的数据库。
可选地，所述编辑子模块包括：布局单元、生成单元和配置单元；其中：
所述布局单元设置为：对所述表单进行布局；所述生成单元设置为：生成标签实例；所述配置单元设置为：配置所述标签实例。
可选地，所述布局单元设置为：按照布局标签模板，根据输入的行数和列数，在浏览器界面上形成规则的单元格。
可选地，所述布局单元还设置为：根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
可选地，所述生成单元设置为：接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
可选地，所述配置单元设置为：对标签实例的属性进行配置。
可选地，所述编辑子模块还包括验证规则单元，所述验证规则单元设置为：配置验证规则。
可选地，所述编辑子模块还包括插件化单元，所述插件化单元设置为：将标签实例插件化。
可选地，所述编辑子模块还包括样式表单元，所述样式表单元设置为： 配置样式表。
可选地，所述验证规则单元设置为：根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑定。
可选地，展示模块包括：获取子模块和解析展示子模块；
所述获取子模块设置为：在需要展示表单的位置，设置占位标签，获取与占位标签的属性对应的表单数据；
所述解析展示子模块设置为：解析表单数据以展示表单。
可选地，所述获取子模块设置为：获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
可选地，所述解析展示子模块设置为：在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；将表单数据***到相应的位置进行展示。
本发明实施例提供了一种表单实现方法，采用浏览器及服务器BS架构，所述方法包括：
在浏览器界面创建表单；
对所述表单进行布局，生成标签实例，对所述标签实例进行配置；
以html格式，将所述表单存入服务器的数据库。
可选地，所述在浏览器界面创建表单包括：
接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
可选地，所述表单信息还包括所述表单的分类。
可选地，所述方法还包括：预设或自定义标签模版。
可选地，所述对所述表单进行布局，包括：按照布局标签模板，根据输入的行数和列数，在所述浏览器界面上形成规则的单元格。
可选地，在所述浏览器界面上形成规则的单元格之后，所述方法还包括：
根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
可选地，所述生成标签实例包括：
接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
可选地，所述对所述标签实例进行配置包括：对标签实例的属性进行配置。
可选地，所述生成标签实例之后，所述方法还包括：配置验证规则。
可选地，所述配置验证规则包括：
根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑定。
可选地，所述生成标签实例之后，所述方法还包括：
对所述标签实例进行插件化处理。
可选地，所述生成标签实例之后，所述方法还包括：配置样式表。
可选地，所述方法还包括：展示所述表单。
可选地，所述展示所述表单包括：
在需要展示表单的位置，设置占位标签，获取与所述占位标签的属性对应的表单数据，解析所述表单数据以展示表单。
可选地，所述获取与所述占位标签的属性对应的表单数据包括：
获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
可选地，解析所述表单数据以展示表单包括：
在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；
将表单数据***到相应的位置进行展示。
本发明实施例提供了一种表单实现装置，所述表单实现装置采用浏览器及服务器BS架构，所述表单实现装置包括创建模块、编辑模块和保存模块；
所述创建模块，设置为：在浏览器界面创建表单；
所述编辑模块包括：布局子模块，设置为：对所述表单进行布局；生成子模块，设置为：生成标签实例；配置子模块，设置为：对所述标签实例进行配置；
所述保存模块，设置为：以html格式，将所述表单存入服务器的数据库。
可选地，所述创建模块，设置为：
接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
可选地，所述表单信息还包括所述表单的分类。
可选地，所述装置还包括：模版模块，设置为：预设或自定义标签模版。
可选地，所述布局子模块，设置为：按照布局标签模板，根据输入的行数和列数，在所述浏览器界面上形成规则的单元格。
可选地，所述布局子模块，还设置为：
根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
可选地，所述生成子模块，设置为：
接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
可选地，所述配置子模块，设置为：对标签实例的属性进行配置。
可选地，所述编辑模块还包括：规则子模块，设置为：配置验证规则。
可选地，所述规则子模块，设置为：
根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑定。
可选地，所述编辑模块还包括：插件化子模块，设置为：对所述标签实例进行插件化处理。
可选地，所述编辑模块还包括：样式表子模块，所述样式表子模块设置为：配置样式表。
可选地，所述装置还包括：展示表单模块，设置为：展示所述表单。
可选地，所述展示表单模块包括：
获取表单子模块，设置为：在需要展示表单的位置，设置占位标签，获取与所述占位标签的属性对应的表单数据；
解析展示表单子模块，设置为：解析所述表单数据以展示表单。
可选地，所述获取表单子模块，设置为：
获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
可选地，所述解析展示表单子模块设置为：
在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；
将表单数据***到相应的位置进行展示。
本发明实施例还提供了一种计算机可读存储介质，存储有计算机可执行指令，所述计算机可执行指令被处理器执行时实现上述方法。
本发明实施例的有益效果：
本发明实施例提供了一种表单实现方法，其基于BS架构(Browser/Server，即浏览器和服务器结构，该模式统一了客户端，简化了***的开发、维护和使用，它是随着Internet技术的兴起，对C/S结构的一种变化或者改进的结构。在这种结构下，用户工作界面是通过WWW浏览器来实现，极少部分事务逻辑在前端Browser实现，但是主要事务逻辑在服务器端Server实现，形成所谓三层3-tier结构)，完成表单的在线设计和应用展示，支持各主流浏览器使用，在此基础上，用户无需安装客户端，就能够方便的在浏览器界面上通过拖拽等可视化的方式完成表单设计和预览；完成设计的表单可供***内部使用，也可提供API接口供第三方***调用。
在阅读并理解了附图和详细描述后，可以明白其他方面。
附图概述
图1为本发明第一实施例提供的表单实现装置的结构示意图；
图2为本发明第一实施例中设计模块组成示意图；
图3为本发明第一实施例中编辑子模块组成示意图；
图4为本发明第一实施例中展示模块组成示意图；
图5为本发明第二实施例提供的表单实现方法的流程图；
图6为本发明第三实施例提供的表单实现方法的流程图
图7为本发明第四实施例提供的表单实现装置的结构示意图；
图8为本发明第四实施例中编辑模块组成示意图；
图9为本发明第四实施例中展示表单模块组成示意图；
图10为本发明第五实施例提供的表单实现方法的流程图。
本发明的实施方式
现通过实施方式结合附图的方式对本发明实施例进行诠释说明。
第一实施例：
图1为本发明第一实施例提供的表单实现装置的结构示意图，由图1可知，在本实施例中，本发明实施例提供的表单实现装置1包括：
设计模块11，设置为：采用浏览器及服务器BS架构，设计表单；
展示模块12，设置为：基于浏览器及服务器BS架构，展示表单。
通过本发明实施例，用户无需安装客户端，就能够方便的通过浏览器设计和展示表单，方便了用户的使用。如图2所示，在一些实施例中，上述实施例中的设计模块11包括：创建子模块111、编辑子模块112和保存子模块113；所述创建子模块111设置为：创建表单；所述编辑子模块112设置为：编辑表单；所述保存子模块113设置为：保存表单。
如图2所示，在一些实施例中，上述实施例中的设计模块11还包括：标签模板子模块114，所述标签模板子模块114设置为：预设或自定义标签模板。
在一些实施例中，上述实施例中的所述创建子模块111设置为：接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
在一些实施例中，上述实施例中的表单信息还包括所述表单的分类。
在一些实施例中，上述实施例中的所述保存子模块113设置为：以html格式，将表单存入服务器的数据库。
如图3所示，在一些实施例中，上述实施例中的所述编辑子模块112包括：布局单元1121、生成单元1122和配置单元1123；其中：
所述布局单元1121设置为：对所述表单进行布局；所述生成单元1122设置为：生成标签实例；所述配置单元1123设置为：配置所述标签实例。
在一些实施例中，上述实施例中的所述布局单元1121设置为：按照布局标签模板，根据输入的行数和列数，在浏览器界面上形成规则的单元格。
在一些实施例中，上述实施例中的所述布局单元1121还设置为：根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
在一些实施例中，上述实施例中的所述生成单元1122设置为：接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
在一些实施例中，上述实施例中的所述配置单元1123设置为：对标签实例的属性进行配置。
如图3所示，在一些实施例中，上述实施例中的所述编辑子模块112还包括验证规则单元1124，所述验证规则单元1124设置为：配置验证规则。
在一些实施例中，上述实施例中的所述验证规则单元1124设置为：根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑定。
如图3所示，在一些实施例中，上述实施例中的所述编辑子模块112还包括插件化单元1125，所述插件化单元1125设置为：将标签实例插件化。
如图3所示，在一些实施例中，上述实施例中的所述编辑子模块112还包括样式表单元1126，所述样式表单元1126设置为：配置样式表，以控制标签在界面上显示的样式。
如图4所示，在一些实施例中，上述实施例中的展示模块12包括：获取子模块121和解析展示子模块122；
所述获取子模块121设置为：在需要展示表单的位置，设置占位标签，获取与占位标签的属性对应的表单数据；
所述解析展示子模块122设置为：解析表单数据以展示表单。
在一些实施例中，上述实施例中的所述获取子模块121设置为：获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
在一些实施例中，上述实施例中的所述解析展示子模块122设置为：在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；将表单数据***到相应的位置进行展示。
通过本发明实施例，用户无需安装客户端，就能够方便的在浏览器界面上通过拖拽等可视化的方式完成表单设计和展示；通过本发明实施例，增强了表单***的扩展性和可移植性、以及兼容标准的能力。
第二实施例：
图5为本发明第二实施例提供的表单实现方法的流程图，由图5可知，在本实施例中，本发明实施例提供的表单实现方法包括以下步骤：
S201：采用浏览器及服务器BS架构，设计表单；
S202：基于浏览器及服务器BS架构，展示表单。
通过本发明实施例，用户无需安装客户端，就能够方便的通过浏览器设计和展示表单，方便了用户的使用。
在一些实施例中，上述实施例中的设计表单包括：创建表单、编辑表单、保存表单。
在一些实施例中，上述实施例中的设计表单还包括：预设或自定义配置标签模板。
在一些实施例中，上述实施例中的创建表单包括：
接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
在一些实施例中，上述实施例中的表单信息还包括所述表单的分类。
在一些实施例中，上述实施例中的保存表单包括：以html格式，将表单存入服务器的数据库。
在一些实施例中，上述实施例中的编辑表单包括：对所述表单进行布局，生成标签实例，配置所述标签实例。
在一些实施例中，上述实施例中的对所述表单进行布局，包括：按照布局标签模板，根据输入的行数和列数，在浏览器界面上形成规则的单元格。
在一些实施例中，上述实施例中的在浏览器界面上形成规则的单元格之后，所述方法还包括：
根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
在一些实施例中，上述实施例中的生成标签实例包括：
接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
在一些实施例中，上述实施例中的配置所述标签实例包括：
对标签实例的属性进行配置。
在一些实施例中，上述实施例中的编辑表单还包括：
配置验证规则，和/或将标签实例插件化，和/或配置样式表。
在一些实施例中，上述实施例中的配置验证规则包括：
根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑 定。
在一些实施例中，上述实施例中的展示表单包括：在需要展示表单的位置，设置占位标签，获取与占位标签的属性对应的表单数据，解析表单数据以展示表单。
在一些实施例中，上述实施例中的获取与所述占位标签的属性对应的表单数据包括：
获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
在一些实施例中，上述实施例中的解析所述表单数据以展示表单包括：
在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；
将表单数据***到相应的位置进行展示。
通过本发明实施例，用户无需安装客户端，就能够方便的在浏览器界面上通过拖拽等可视化的方式完成表单设计和展示；通过本发明实施例，增强了表单***的扩展性和可移植性、以及兼容标准的能力。
第三实施例：
图6为本发明第三实施例提供的表单实现方法的流程图，由图6可知，在本实施例中，本发明实施例提供的表单实现方法采用浏览器及服务器BS架构，所述方法包括：
S301，在浏览器界面创建表单；
S302，对所述表单进行布局，生成标签实例，对所述标签实例进行配置；
S303，以html格式，将所述表单存入服务器的数据库。
通过本发明实施例，用户无需安装客户端，就能够方便的在浏览器界面上通过可视化的方式完成表单设计和保存。
在一些实施例中，步骤S301包括：
接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
在一些实施例中，上述实施例中的表单信息还包括所述表单的分类。
在一些实施例中，所述方法还包括：预设或自定义标签模版。
在一些实施例中，步骤302中的对所述表单进行布局，包括：按照布局标签模板，根据输入的行数和列数，在所述浏览器界面上形成规则的单元格。
在一些实施例中，步骤302中的浏览器界面上形成规则的单元格之后，所述方法还包括：
根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
在一些实施例中，步骤302中的生成标签实例包括：
接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
在一些实施例中，步骤302中的对所述标签实例进行配置包括：对标签实例的属性进行配置。
在一些实施例中，步骤302中的生成标签实例之后，所述方法还包括：配置验证规则。
可选地，所述配置验证规则包括：
根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑定。
在一些实施例中，步骤302中的生成标签实例之后，所述方法还包括：
对所述标签实例进行插件化处理。
在一些实施例中，步骤302中的生成标签实例之后，所述方法还包括：
配置样式表，以控制标签在界面上显示的样式。
在一些实施例中，步骤302还包括：对所述表单进行预览，
在一些实施例中，所述方法还包括：展示所述表单。
可选地，所述展示所述表单包括：
在需要展示表单的位置，设置占位标签，获取与所述占位标签的属性对应的表单数据，解析所述表单数据以展示表单。
在一些实施例中，上述实施例中的获取与所述占位标签的属性对应的表单数据包括：
获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
在一些实施例中，上述实施例中的解析所述表单数据以展示表单包括：
在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；
将表单数据***到相应的位置进行展示。
通过本发明实施例，用户无需安装客户端，就能够方便的在浏览器界面上通过拖拽等可视化的方式完成表单设计和展示；通过本发明实施例，增强了表单***的扩展性和可移植性、以及兼容标准的能力。
第四实施例：
图7为本发明第四实施例提供的表单实现装置的结构示意图，所述表单实现装置采用浏览器及服务器BS架构，由图7可知，在本实施例中，本发明实施例提供的表单实现装置4包括：
创建模块41、编辑模块42和保存模块43；
所述创建模块41，设置为：在浏览器界面创建表单；
如图8所示，所述编辑模块42包括：布局子模块421，设置为：对所述表单进行布局；生成子模块422，设置为：生成标签实例；配置子模块423，设置为：对所述标签实例进行配置；
所述保存模块43，设置为：以html格式，将所述表单存入服务器的数据库。
通过本发明实施例，用户无需安装客户端，就能够方便的在浏览器界面上通过可视化的方式完成表单设计和保存。
在一些实施例中，上述实施例中的创建模块41，设置为：
接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
在一些实施例中，上述实施例中的表单信息还包括所述表单的分类。
如图7所示，在一些实施例中，上述实施例中的装置4还包括：模版模块44，设置为：预设或自定义标签模版。
在一些实施例中，上述实施例中的布局子模块421，设置为：按照布局标签模板，根据输入的行数和列数，在所述浏览器界面上形成规则的单元格。
在一些实施例中，上述实施例中的布局子模块421，还设置为：
根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
在一些实施例中，上述实施例中的生成子模块422，设置为：
接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
在一些实施例中，上述实施例中的配置子模块423，设置为：对标签实例的属性进行配置。
如图8所示，在一些实施例中，上述实施例中的所述编辑模块42还包括：规则子模块424，设置为：配置验证规则。
在一些实施例中，上述实施例中的规则子模块424，设置为：
根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑定。
如图8所示，在一些实施例中，上述实施例中的编辑模块42还包括：插件化子模块425，设置为：对所述标签实例进行插件化处理。
如图8所示，在一些实施例中，上述实施例中的编辑模块42还包括：样式表子模块426，设置为：配置样式表，以控制标签在界面上显示的样式。
如图7所示，在一些实施例中，上述实施例中的装置4还包括：展示表 单模块45，设置为：展示所述表单。
如图9所示，在一些实施例中，上述实施例中的展示表单模块45包括：
获取表单子模块451，设置为：在需要展示表单的位置，设置占位标签，获取与所述占位标签的属性对应的表单数据；
解析展示表单子模块452，设置为：解析所述表单数据以展示表单。
在一些实施例中，上述实施例中的获取表单子模块451，设置为：
获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
在一些实施例中，上述实施例中的解析展示表单子模块452设置为：
在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；
将表单数据***到相应的位置进行展示。
通过本发明实施例，用户无需安装客户端，就能够方便的在浏览器界面上通过拖拽等可视化的方式完成表单设计和展示；通过本发明实施例，增强了表单***的扩展性和可移植性、以及兼容标准的能力。
现结合应用场景对本发明实施例做进一步的诠释说明。
第五实施例：
图10为本发明第五实施例提供的表单实现方法的流程图，由图10可知，在本实施例中，本发明实施例提供的表单实现方法包括以下步骤：
S501：配置标签模版。
html规范不断更迭的过程中，总伴随着新标签的引入，同时新标签也被主流浏览器逐渐支持并最终达到广泛使用；旧标签可能面临不再推荐使用或者最终会被浏览器弃用。为了适应这种变化，同时也考虑到自定义标签的需求，***中提供了配置标签模版功能。
在实际应用中，***已经内置了常用的标签模版，例如：
文本模版：<label>％s</label>,内容＝“默认文本”；
单行文本输入框模版：<input type＝“text”/>；
多行文本输入框模版：<textarea rows＝“％s”cols＝“％s”></textarea>,行数＝“5”,列数＝“10”；
标签模版的第一段是标签主体部分，后面逗号分隔的依次是属性名称，＝号后面接着属性的默认值，例如上面的多行文本输入框模版拖入到设计器界面后，将生成<textarea rows＝“5”cols＝“10”></textarea>的标签，应用***可自定义标签模版，如配置一个email标签模版：<input type＝“email”/>。
S502：创建表单。
录入表单名称、分类tag等基本信息后保存。
S503：编辑表单。
使用表单设计器，先设计布局，即拖入布局标签，设置行数列数，然后将需要的标签模版拖拽到界面合适的位置上，标签模版拖拽到界面上后，生成了对应的标签实例；然后需要对标签实例进一步配置，需要配置的属性值、验证规则等，如设置id，class，name，数据源等。
其中选择需要编辑的表单，进入表单设计界面，可进行如下操作：
设计布局：拖入布局标签模版，根据实际情况编辑行列数，这样界面上形成了规则的单元格，可以对单元格进行合并和拆分操作，对布局进一步细化。
配置标签实例：标签模版拖拽到对应的单元格内，则生成了默认的标签实例；此时可对标签实例的属性进一步配置，可配置的属性是由标签模版的内容动态解析出来的，如多行文本输入框模版，除了公共属性id，class，name外，从标签模版上提取到的自定义的属性有行数和列数。
配置验证规则：将标签实例和一个或者多个验证规则绑定起来，如可将单行输入框和必填、email关联，标签实例上将对应生成属性值data-validate＝“required email”
配置插件化：为使表单应用***达到更广泛的浏览器兼容程度，在配置相关标签实例时可以将其插件化，插件脚本采用Javascript语言编写，易于集成在浏览器环境中使用，比如将标签实例<input type＝“datetime”/>插件化后，将得到实例<input type＝“datetime”data-plugin＝“datetime”/>
为满足可定制化样式的需求，应用***内置提供了多套设计好的样式表文件，样式表可以控制标签在界面上显示的样式，这里采用css样式表。在设计界面中即可选择样式表文件，css样式本身并不直接嵌入到表单html界面中，而是在表单form标签中查找data-css属性名，如果没有该属性名则生成一个，在该属性名的值上添加值css-文件名。
S504：保存表单。
编辑设计完成后保存表单，表单内容采用html的形式存入数据库中。
在实际应用中，编辑设计表单的同时可以在右边栏中对表单效果进行实时预览。为满足表单***样式的定制化需求，***中预先配置多个样式表文件，可将创建的表单与样式表文件关联起来。***已经内置一些表单验证规则，比如必填，email，整数，小数等，用户可以根据需要在***中添加验证规则。对于那些浏览器兼容性不是很好或者表现差异很大的表单元素，***提供了插件化的机制，用户在配置标签实例时可以勾选是否插件化，插件化后的表单元素将得到更好的浏览器兼容性和表现一致性。
S505：展示表单。
在页面中需要展示表单的地方放置一个占位标签：
<div data-placeholder＝“form”name＝“表单名称”></div>。
表单页面会加载自定义好的脚本，对这种占位标签进行处理，提取标签相关属性，通过后台接口在数据库中取得该属性关联的表单的数据。其中，表单页面加载自定义好的Javascript脚本，对带有data-placeholder＝”form”属性/值的div标签进行遍历处理，提取name属性，通过后台接口在数据库中取得该name关联表单的html数据。
解析表单数据，如果解析表单取到样式表信息，则动态加载对应的样式表文件，如果解析表单取到需要插件化的信息，则动态加载对应的插件关联 脚本、样式文件，如果解析到有标签需要进行验证，则动态加载对应的验证脚本文件；等到这些文件加载完成后，再将对应表单数据***到文档界面中进行展示。
其中，解析表单的html数据，动态加载样式表、脚本文件：
如果解析取到data-css属性，则动态加载对应位置的css文件；
如果解析到表单元素含有data-plugin属性，则动态加载对应插件的javascript文件；
如果解析到表单元素含有data-validate属性，则动态加载对应的验证javascript文件。
等待脚本文件异步加载完成后，再将表单html***到文档界面中，同时将占位标签从界面隐藏。
对需要插件化的表单元素执行插件提供的方法。
本发明实施例还提供了一种计算机可读存储介质，存储有计算机可执行指令，所述计算机可执行指令被处理器执行时实现上述表单实现方法。
综上可知，通过本发明实施例的实施，至少存在以下有益效果：
本发明实施例提供了一种基于BS架构的在线表单设计器和表单应用展示***，支持各主流浏览器使用。用户无需安装客户端，就能够方便的在浏览器界面上通过拖拽等可视化的方式完成表单设计和预览；完成设计的表单可供***内部使用，也可提供API接口供第三方***调用；通过本发明实施例，增强了表单***的扩展性和可移植性、以及兼容标准的能力。
本领域普通技术人员可以理解上述实施例的全部或部分步骤可以使用计算机程序流程来实现，所述计算机程序可以存储于一计算机可读存储介质中，所述计算机程序在相应的硬件平台上(如***、设备、装置、器件等)执行，在执行时，包括方法实施例的步骤之一或其组合。
可选地，上述实施例的全部或部分步骤也可以使用集成电路来实现，这些步骤可以被分别制作成一个个集成电路模块，或者将它们中的多个模块或步骤制作成单个集成电路模块来实现。
上述实施例中的装置/功能模块/功能单元可以采用通用的计算装置来实现，它们可以集中在单个的计算装置上，也可以分布在多个计算装置所组成的网络上。
上述实施例中的装置/功能模块/功能单元以软件功能模块的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。上述提到的计算机可读取存储介质可以是只读存储器，磁盘或光盘等。
以上仅是本发明的实施方式而已，并非对本申请做任何形式上的限制，凡是依据本申请的技术实质对以上实施方式所做的任意简单修改、等同变化、结合或修饰，均仍属于本申请技术方案的保护范围。
工业实用性
通过本发明实施例可以完成表单的在线设计和应用展示，支持各主流浏览器使用，在此基础上，用户无需安装客户端，就能够方便的在浏览器界面上通过拖拽等可视化的方式完成表单设计和预览；完成设计的表单可供***内部使用，也可提供API接口供第三方***调用；通过本发明实施例，增强了表单***的扩展性和可移植性、以及兼容标准的能力。

Claims (21)

  1. 一种表单实现方法，包括：
    采用浏览器及服务器BS架构，设计表单；
    基于所述浏览器及服务器BS架构，展示所述表单。
  2. 如权利要求1所述的表单实现方法，其中，所述设计表单包括：
    创建表单；
    编辑表单；
    保存表单。
  3. 如权利要求2所述的表单实现方法，其中，所述设计表单还包括：预设或自定义标签模板。
  4. 如权利要求2所述的表单实现方法，其中，所述创建表单包括：
    接收在浏览器界面录入的表单信息并保存，所述表单信息包括表单名称。
  5. 如权利要求2所述的表单实现方法，其中，所述保存表单包括：以超级文本标记语言html格式，将所述表单存入服务器的数据库。
  6. 如权利要求2所述的表单实现方法，其中，所述编辑表单包括：
    对所述表单进行布局，生成标签实例，配置所述标签实例。
  7. 如权利要求6所述的表单实现方法，其中，所述对所述表单进行布局，包括：按照布局标签模板，根据输入的行数和列数，在浏览器界面上形成规则的单元格。
  8. 如权利要求7所述的表单实现方法，其中，所述在浏览器界面上形成规则的单元格之后，所述方法还包括：
    根据接收到的合并指令对单元格进行合并操作，和/或根据接收到的拆分指令对单元格进行拆分操作。
  9. 如权利要求6所述的表单实现方法，其中，生成标签实例包括：
    接收将标签模版拖拽到指定单元格的指令，生成所述标签模版对应的标签实例。
  10. 如权利要求6所述的表单实现方法，其中，所述编辑表单还包括：
    配置验证规则，和/或将标签实例插件化，和/或配置样式表。
  11. 如权利要求10所述的表单实现方法，其中，所述配置验证规则包括：
    根据输入的验证规则，将所述标签实例与一个或者多个验证规则进行绑定。
  12. 如权利要求1至11任一项所述的表单实现方法，其中，所述展示所述表单包括：在需要展示表单的位置，设置占位标签，获取与所述占位标签的属性对应的表单数据，解析所述表单数据以展示表单。
  13. 如权利要求12所述的表单实现方法，其中，所述获取与所述占位标签的属性对应的表单数据包括：
    获取与所述占位标签的属性对应的脚本，提取所述脚本中的表单名称，从服务器的数据库中获取所述表单名称关联的html数据。
  14. 如权利要求12所述的表单实现方法，其中，所述解析所述表单数据以展示表单包括：
    在解析所述表单数据，获取到样式表信息时，动态加载对应的样式表文件；和/或在解析所述表单数据，获取到插件化的信息时，动态加载对应的插件关联的脚本文件；和/或在解析所述表单数据，判断有标签需要进行验证时，动态加载对应的验证脚本文件；
    将表单数据***到相应的位置进行展示。
  15. 一种表单实现装置，包括：
    设计模块，设置为：采用浏览器及服务器BS架构，设计表单；
    展示模块，设置为：基于所述浏览器及服务器BS架构，展示所述表单。
  16. 一种表单实现方法，其特征在于，采用浏览器及服务器BS架构，所述方法包括：
    在浏览器界面创建表单；
    对所述表单进行布局，生成标签实例，对所述标签实例进行配置；
    以html格式，将所述表单存入服务器的数据库。
  17. 如权利要求16所述的表单实现方法，其中，所述方法还包括：展示所述表单。
  18. 如权利要求17所述的表单实现方法，其中，所述展示所述表单包括：
    在需要展示表单的位置，设置占位标签，从服务器的数据库中获取与所述占位标签的属性对应的表单数据，解析所述表单数据以展示表单。
  19. 一种表单实现装置，其特征在于，采用浏览器及服务器BS架构，所述表单实现装置包括创建模块、编辑模块和保存模块；
    所述创建模块，设置为：在浏览器界面创建表单；
    所述编辑模块包括：布局子模块、生成子模块和配置子模块，其中，所述布局子模块，设置为：对所述表单进行布局；所述生成子模块，设置为：生成标签实例；所述配置子模块，设置为：对所述标签实例进行配置；
    所述保存模块，设置为：以html格式，将所述表单存入服务器的数据库。
  20. 如权利要求19所述的表单实现装置，所述装置还包括：
    展示表单模块，设置为：展示所述表单。
  21. 如权利要求20所述的表单实现装置，其中，所述展示表单模块包括：
    获取表单子模块，设置为：在需要展示表单的位置，设置占位标签，获取与所述占位标签的属性对应的表单数据；
    解析展示表单子模块，设置为：解析所述表单数据以展示表单。
PCT/CN2016/085356 2015-08-18 2016-06-08 一种表单实现方法及装置 WO2017028611A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201510507060.7 2015-08-18
CN201510507060.7A CN106469047A (zh) 2015-08-18 2015-08-18 一种表单实现方法及装置

Publications (1)

Publication Number Publication Date
WO2017028611A1 true WO2017028611A1 (zh) 2017-02-23

Family

ID=58050880

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2016/085356 WO2017028611A1 (zh) 2015-08-18 2016-06-08 一种表单实现方法及装置

Country Status (2)

Country Link
CN (1) CN106469047A (zh)
WO (1) WO2017028611A1 (zh)

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109472010A (zh) * 2018-10-10 2019-03-15 福建升腾资讯有限公司 基于execl模板获取前端html设计表格的方法及计算机设备
CN109815288A (zh) * 2019-01-28 2019-05-28 武汉卓力品胜科技有限公司 一种数据可视化方法及***
CN112036118A (zh) * 2020-07-03 2020-12-04 山东浪潮通软信息科技有限公司 一种可配置的数据报表动态展现方法及***
CN112882703A (zh) * 2021-02-07 2021-06-01 湖北盈帆数据技术有限公司 一种自定义图表插件在线设计方法及装置
CN113988033A (zh) * 2021-10-21 2022-01-28 西安热工研究院有限公司 一种基于单元格函数快速实现图表的方法

Families Citing this family (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108628812A (zh) * 2017-03-16 2018-10-09 北京京东尚科信息技术有限公司 自定义面单模板的方法、装置、电子设备和可读存储介质
CN108664456B (zh) * 2017-03-31 2021-12-03 北京京东尚科信息技术有限公司 一种动态构造文档中的显示元素的功能的方法
CN107423061A (zh) * 2017-07-12 2017-12-01 江苏速度信息科技股份有限公司 一种基于ison数据的表单生成方法
CN107844299B (zh) * 2017-12-01 2021-01-22 浪潮软件股份有限公司 一种Web应用开发工具的实现方法
CN108509400B (zh) * 2018-02-07 2022-02-15 平安普惠企业管理有限公司 单据模板生成方法、装置、计算机设备和存储介质
CN112668290A (zh) * 2020-12-28 2021-04-16 珠海新华通软件股份有限公司 基于网格化设计的动态表单生成方法及***
CN112597750A (zh) * 2020-12-28 2021-04-02 珠海新华通软件股份有限公司 在线设计动态检测报告模板的方法、编辑器及介质
CN113468459B (zh) * 2021-07-22 2023-07-18 浪潮软件科技有限公司 一种动态数据表单的展示方法
CN114356424A (zh) * 2021-12-20 2022-04-15 杭州溪塔科技有限公司 前端项目多环境共用镜像的方法及计算机可读存储介质

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102122281A (zh) * 2010-01-11 2011-07-13 腾讯科技（北京）有限公司 一种生成页面表单的方法、装置和***
US20120194826A1 (en) * 2011-01-28 2012-08-02 Canon Kabushiki Kaisha Information processing apparatus for displaying operation screen on console section based on contents received from external device, method of controlling the same, and storage medium
CN104504160A (zh) * 2015-01-20 2015-04-08 中国地质大学（武汉） 基于SSH框架的Excel文档在线批量写入方法

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102122281A (zh) * 2010-01-11 2011-07-13 腾讯科技（北京）有限公司 一种生成页面表单的方法、装置和***
US20120194826A1 (en) * 2011-01-28 2012-08-02 Canon Kabushiki Kaisha Information processing apparatus for displaying operation screen on console section based on contents received from external device, method of controlling the same, and storage medium
CN104504160A (zh) * 2015-01-20 2015-04-08 中国地质大学（武汉） 基于SSH框架的Excel文档在线批量写入方法

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
YANG, BIN ET AL.: "Custom and Drag-Report System Based on Web and JavaScript in Thermal Power Plant", ELECTRIC POWER SCIENCE AND ENGINEERING, vol. 24, no. 10, 31 December 2008 (2008-12-31), pages 57 *

Cited By (7)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109472010A (zh) * 2018-10-10 2019-03-15 福建升腾资讯有限公司 基于execl模板获取前端html设计表格的方法及计算机设备
CN109815288A (zh) * 2019-01-28 2019-05-28 武汉卓力品胜科技有限公司 一种数据可视化方法及***
CN112036118A (zh) * 2020-07-03 2020-12-04 山东浪潮通软信息科技有限公司 一种可配置的数据报表动态展现方法及***
CN112036118B (zh) * 2020-07-03 2024-01-26 浪潮通用软件有限公司 一种可配置的数据报表动态展现方法及***
CN112882703A (zh) * 2021-02-07 2021-06-01 湖北盈帆数据技术有限公司 一种自定义图表插件在线设计方法及装置
CN113988033A (zh) * 2021-10-21 2022-01-28 西安热工研究院有限公司 一种基于单元格函数快速实现图表的方法
CN113988033B (zh) * 2021-10-21 2024-02-23 西安热工研究院有限公司 一种基于单元格函数快速实现图表的方法

Also Published As

Publication number Publication date
CN106469047A (zh) 2017-03-01

Similar Documents

Publication Publication Date Title
WO2017028611A1 (zh) 一种表单实现方法及装置
US10445350B2 (en) Optimizing content for consistent presentation through collaboration database service
US11216253B2 (en) Application prototyping tool
US10565296B2 (en) Designing interactive web templates
CN111079047B (zh) 一种面向web的页面构建***
US10049095B2 (en) In-context editing of output presentations via automatic pattern detection
US8930824B2 (en) Facilitating propagation of user interface patterns or themes
US20190340230A1 (en) System and method for generating websites from predefined templates
US9910554B2 (en) Assisting graphical user interface design
WO2012170312A2 (en) Embedded web viewer for presentation applications
CN104915186B (zh) 一种制作页面的方法和装置
US10803236B2 (en) Information processing to generate screen based on acquired editing information
US9141596B2 (en) System and method for processing markup language templates from partial input data
US10599754B2 (en) Context editing without interfering with target page
CN111881662A (zh) 表单生成方法、装置、处理设备及存储介质
US10204077B2 (en) Rich text editor
WO2015112131A1 (en) Multistage customizing of web-based application in a browser independent of platform and operating system
US20160314502A1 (en) System and method for streamlining the design and development process of multiple advertising units
TW201610713A (zh) 在文件中識別且呈現相關報告實物
KR101459299B1 (ko) 스마트 기기의 소프트웨어 개발 자동화 장치, 스마트 기기의 소프트웨어 개발 자동화 방법 및 이를 기록한 기록매체
US20180341638A1 (en) Providing suggested diagrammatic representations of user entered textual information
KR101797573B1 (ko) 웹 기반의 스프레드시트 서비스 제공 장치 및 방법
US10747943B2 (en) Method, device, client apparatus, and electronic device for presenting webpages
Ratha et al. HTML5 in web development: a new approach
US10956658B2 (en) Digital content editing of a document object model (DOM) based on object model comparison

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 16836475

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 16836475

Country of ref document: EP

Kind code of ref document: A1