CN107203595B - Method for dynamically generating web interface based on free form - Google Patents
Method for dynamically generating web interface based on free form Download PDFInfo
- Publication number
- CN107203595B CN107203595B CN201710305804.6A CN201710305804A CN107203595B CN 107203595 B CN107203595 B CN 107203595B CN 201710305804 A CN201710305804 A CN 201710305804A CN 107203595 B CN107203595 B CN 107203595B
- Authority
- CN
- China
- Prior art keywords
- input
- list
- page
- interface
- data
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/24—Querying
- G06F16/248—Presentation of query results
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/20—Information retrieval; Database structures therefor; File system structures therefor of structured data, e.g. relational data
- G06F16/25—Integrating or interfacing systems involving database management systems
- G06F16/252—Integrating or interfacing systems involving database management systems between a Database Management System and a front-end application
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Computational Linguistics (AREA)
- User Interface Of Digital Computer (AREA)
- Information Transfer Between Computers (AREA)
Abstract
The invention provides a method for dynamically generating a web interface based on a free form, which comprises the following steps: defining page level information; defining field level information; analyzing according to the page level information and rule constraint, dynamically rendering list pages, and loading data; automatically rendering a card page according to the field level information, and loading data; checking whether the input is correct or not according to the input rule; and outputting the loaded list interface and the list interface. The invention generates the form into the web interface, can self-define the generated web interface, enables the use to be more flexible, simultaneously analyzes according to the rule constraint, can rapidly and dynamically render the list page and load data, can automatically generate the web interface without manual intervention compared with the traditional mode of generating the form based on the web by using a partial automation technology, can self-define a plurality of functional buttons, and is convenient for operation.
Description
Technical Field
The invention relates to the technical field of web interfaces, in particular to a method for dynamically generating a web interface based on a free form.
Background
In many web-based applications, data access, data manipulation, and data presentation are facilitated by a user interface to underlying data, such as database tables. To standardize functionality, the user interface can be presented in a web-based format to enable any user with access to a web browser to interact with the underlying data. For example, the data may be presented through one or more web-based forms that allow a user to access and manipulate the data. To create a web-based form, the form designer typically manually designs the data layer and presentation layer. The data layer interacts with the underlying data (e.g., issues queries to the database) and provides data (e.g., results of database queries) to the presentation layer in response to commands from the presentation layer. The form designer may also build other functions into the data layer such as filtering, master details, server-based paging, and editing, deleting, and inserting commands. For example, the data layer may filter the query results according to other criteria in order to return the appropriate data set to the presentation layer.
Some web form development platforms utilize partially automated techniques to generate web-based forms. For example, at least one platform supports automatic display, editing, updating, and deleting functions. However, these platforms still require manual activity to obtain other functionality. For example, filtering, paging, and sorting often require human intervention even with these development platforms. Thus, even when partially automated techniques are used, considerable resources may still be consumed in order to manually add additional functionality.
Disclosure of Invention
The object of the present invention is to solve at least one of the technical drawbacks mentioned.
Therefore, the invention aims to provide a method for dynamically generating a web interface based on a free form, which can dynamically generate the web interface based on the free form, so that the operation of the web interface is more flexible, and additional functions can be added without consuming considerable resources.
In order to achieve the above object, the present invention provides a method for dynamically generating a web interface based on a free form, comprising the following steps:
step S1, defining page-level information at least including associated metadata, list page data paging rules and list page data default sorting rules;
step S2, defining field level information at least including Chinese name, element type, input type, and input setting;
step S3, according to the page level information, resolving according to rule constraint, dynamically rendering list pages, and loading data;
the list page loading steps are as follows:
step S301, reading form configuration according to the function number;
step S302, rendering list and column according to the list display field;
step S303, loading service data according to the lookup table or the attempt;
step S304, performing paging processing according to the display quantity of each page;
step S305, rendering the column control according to the element type and the input type of the field;
step S306, initializing data in the control according to input setting;
step S307, initializing a button according to the form list button;
step S308, completing list interface loading;
step S4, automatically rendering a card page according to the field level information, and loading data;
step S5, checking whether the input is correct according to the input rule;
and step S6, outputting the loaded list interface and card interface.
Further, in step S3, an Action interface may be implemented according to the self-defined service extension class, so as to complete the special service of saving and deleting the service data.
Furthermore, the list page is also provided with a personalized button and a query button.
Further, in step S4, a field control may be automatically generated in the card interface according to the input type and the input setting, where the field control at least includes a drop-down box, a radio box, and a multi-selection box.
Further, in step S5, if the verification input is not correct, re-input is prompted, and if the verification input is correct, the next operation is entered.
Further, in step S4, the card page loading step is as follows:
step S401, reading form configuration according to the function number;
step S402, rendering a detailed page input field according to the card display field;
step S403, inquiring service data according to the operation table;
step S404, rendering the control of the input box according to the element type and the input type of the field;
step S405, initializing data in the control according to input setting;
step S406, according to whether the read-only control input item can be edited or not;
step S407, controlling whether the input item is allowed to be empty according to whether the card is empty;
step S408, initializing a button according to the form card button;
and step S409, completing card interface loading.
Further, the loading of the card page is started after double-clicking the list data.
The invention generates the form into the web interface, can self-define the generated web interface, enables the use to be more flexible, simultaneously analyzes according to the rule constraint, can rapidly and dynamically render the list page and load data, can automatically generate the web interface without manual intervention compared with the traditional mode of generating the form based on the web by using a partial automation technology, can self-define a plurality of functional buttons, and is convenient for operation.
Drawings
The above and/or additional aspects and advantages of the present invention will become apparent and readily appreciated from the following description of the embodiments, taken in conjunction with the accompanying drawings of which:
FIG. 1 is a flow chart of the main body of the present invention;
FIG. 2 is a list page loading flow diagram of the present invention;
FIG. 3 is a flowchart of card page loading according to the present invention.
Detailed Description
Reference will now be made in detail to embodiments of the present invention, examples of which are illustrated in the accompanying drawings, wherein like or similar reference numerals refer to the same or similar elements or elements having the same or similar function throughout. The embodiments described below with reference to the drawings are illustrative and intended to be illustrative of the invention and are not to be construed as limiting the invention.
The present invention will be described in detail with reference to the following embodiments.
As shown in FIGS. 1-3, the method for dynamically generating a web interface based on a free form provided by the invention comprises the following steps:
step S1, defining page-level information at least including associated metadata, list page data paging rules and list page data default sorting rules;
step S2, defining field level information at least including Chinese name, element type, input type, and input setting;
step S3, according to the page level information, resolving according to rule constraint, dynamically rendering list pages, and loading data;
the list page loading steps are as follows:
step S301, reading form configuration according to the function number;
step S302, rendering list and column according to the list display field;
step S303, loading service data according to the lookup table or the attempt;
step S304, performing paging processing according to the display quantity of each page;
step S305, rendering the column control according to the element type and the input type of the field;
step S306, initializing data in the control according to input setting;
step S307, initializing a button according to the form list button;
step S308, completing list interface loading;
in addition, the list interface can realize an Action interface according to self-defined expansion classes of services, and is used for finishing special services of storing and deleting service data. The list page is also provided with a personalized button and a query button, and the personalized button can be realized in the expanded js.
Step S4, automatically rendering a card page according to the field level information, and loading data; the card page loading is started by double-clicking the list data.
The card page loading steps are as follows:
step S401, reading form configuration according to the function number;
step S402, rendering a detailed page input field according to the card display field;
step S403, inquiring service data according to the operation table;
step S404, rendering the control of the input box according to the element type and the input type of the field;
step S405, initializing data in the control according to input setting;
step S406, according to whether the read-only control input item can be edited or not;
step S407, controlling whether the input item is allowed to be empty according to whether the card is empty;
step S408, initializing a button according to the form card button;
and step S409, completing card interface loading.
In addition, a field control can be automatically generated in the card interface according to the input type and the input setting, and the field control at least comprises a drop-down box, a radio box and a multi-selection box.
Step S5, checking whether the input is correct according to the input rule; if the check input is not correct, the input is prompted to be input again, and if the check input is correct, the next operation is started.
And step S6, outputting the loaded list interface and card interface.
The invention generates the form into the web interface, can self-define the generated web interface, enables the use to be more flexible, simultaneously analyzes according to the rule constraint, can rapidly and dynamically render the list page and load data, can automatically generate the web interface without manual intervention compared with the traditional mode of generating the form based on the web by using a partial automation technology, can self-define a plurality of functional buttons, and is convenient for operation.
Although embodiments of the present invention have been shown and described above, it is understood that the above embodiments are exemplary and should not be construed as limiting the present invention, and that variations, modifications, substitutions and alterations can be made in the above embodiments by those of ordinary skill in the art without departing from the principle and spirit of the present invention. The scope of the invention is defined by the appended claims and their full range of equivalents.
Claims (4)
1. A method for dynamically generating a web interface based on a free form, comprising the steps of:
step S1, defining page-level information at least including associated metadata, list page data paging rules and list page data default sorting rules;
step S2, defining field level information at least including Chinese name, element type, input type, and input setting;
step S3, according to the page level information, resolving according to rule constraint, dynamically rendering list pages, and loading data;
the list page loading steps are as follows:
step S301, reading form configuration according to the function number;
step S302, rendering list and column according to the list display field;
step S303, loading service data according to the lookup table or the attempt;
step S304, performing paging processing according to the display quantity of each page;
step S305, rendering the column control according to the element type and the input type of the field;
step S306, initializing data in the control according to input setting;
step S307, initializing a button according to the form list button;
step S308, completing list interface loading; the list interface can realize an Action interface according to self-defined expansion classes of the services, and is used for finishing special services of storing and deleting service data; the list page is also provided with a personalized button and a query button, and the personalized button can be realized in the expanded js;
step S4, automatically rendering a card page according to the field level information, and loading data; the card page loading steps are as follows:
step S401, reading form configuration according to the function number;
step S402, rendering a detailed page input field according to the card display field;
step S403, inquiring service data according to the operation table;
step S404, rendering the control of the input box according to the element type and the input type of the field;
step S405, initializing data in the control according to input setting;
step S406, according to whether the read-only control input item can be edited or not;
step S407, controlling whether the input item is allowed to be empty according to whether the card is empty;
step S408, initializing a button according to the form card button;
step S409, card interface loading is completed;
step S5, checking whether the input is correct according to the input rule;
and step S6, outputting the loaded list interface and card interface.
2. The method for dynamically generating a web interface based on free forms according to claim 1, wherein in step S4, field controls are automatically generated in the card interface according to the input type and the input setting, and the field controls at least include a drop-down box, a radio box and a multi-selection box.
3. The method for dynamically generating a web interface based on a free form of claim 1, wherein in step S5, if the check input is not correct, re-input is prompted, and if the check input is correct, the next operation is entered.
4. The free-form based method for dynamically generating a web interface of claim 1, wherein the card page loading is initiated by double-clicking on list data.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710305804.6A CN107203595B (en) | 2017-05-03 | 2017-05-03 | Method for dynamically generating web interface based on free form |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201710305804.6A CN107203595B (en) | 2017-05-03 | 2017-05-03 | Method for dynamically generating web interface based on free form |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN107203595A CN107203595A (en) | 2017-09-26 |
| CN107203595B true CN107203595B (en) | 2021-11-30 |
Family
ID=59906330
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201710305804.6A Active CN107203595B (en) | 2017-05-03 | 2017-05-03 | Method for dynamically generating web interface based on free form |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN107203595B (en) |
Families Citing this family (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN108170706A (en) * | 2017-11-22 | 2018-06-15 | 链家网（北京）科技有限公司 | A kind of information collection page generation method and device |
| CN107886280B (en) * | 2017-11-29 | 2022-02-18 | 深圳市易达云科技有限公司 | Intelligent filtering display method and system for order operation items |
| CN109165266A (en) * | 2018-09-03 | 2019-01-08 | 中国平安人寿保险股份有限公司 | List generation method, device, computer equipment and storage medium |
| CN112004160B (en) * | 2020-07-15 | 2022-04-05 | 福建新大陆通信科技股份有限公司 | Interface interaction method, device and medium based on page list control |
| CN112465620B (en) * | 2020-12-30 | 2023-12-19 | 广东金赋科技股份有限公司 | Terminal form filling service linkage method and device based on dynamic form and rule engine |
| CN112711416B (en) * | 2020-12-31 | 2021-10-26 | 北方工业大学 | APP interface customization implementation method |
| CN113110315A (en) * | 2021-03-31 | 2021-07-13 | 深圳市法拉第电驱动有限公司 | Upper computer system for dynamically loading control based on WPF and control method thereof |
| CN114356472A (en) * | 2021-12-03 | 2022-04-15 | 浙江臻善科技股份有限公司 | System interface differential dynamic rendering method |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101241434A (en) * | 2008-03-04 | 2008-08-13 | 浪潮集团山东通用软件有限公司 | Form self-defining method |
| CN102789382A (en) * | 2012-06-28 | 2012-11-21 | 用友软件股份有限公司 | System and method for generating and running form |
| CN104732306A (en) * | 2013-12-19 | 2015-06-24 | 北京索为高科系统技术有限公司 | Rapid development system for service application system and method |
| CN105630502A (en) * | 2015-12-28 | 2016-06-01 | 武汉传神信息技术有限公司 | Method and system for generating dynamic form |
Family Cites Families (5)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US9336191B2 (en) * | 2009-05-05 | 2016-05-10 | Suboti, Llc | System, method and computer readable medium for recording authoring events with web page content |
| CN102737128B (en) * | 2012-06-20 | 2014-12-10 | 深圳市远行科技有限公司 | Dynamic webpage processing device based on browser |
| CN103631570A (en) * | 2012-08-21 | 2014-03-12 | 镇江雅迅软件有限责任公司 | Form self-definition method |
| US20140173405A1 (en) * | 2012-12-19 | 2014-06-19 | Google Inc. | Using custom functions to dynamically manipulate web forms |
| CN104881490B (en) * | 2015-06-10 | 2019-11-22 | 中科宇图天下科技有限公司 | A kind of WEB form data access method and system |
-
2017
- 2017-05-03 CN CN201710305804.6A patent/CN107203595B/en active Active
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN101241434A (en) * | 2008-03-04 | 2008-08-13 | 浪潮集团山东通用软件有限公司 | Form self-defining method |
| CN102789382A (en) * | 2012-06-28 | 2012-11-21 | 用友软件股份有限公司 | System and method for generating and running form |
| CN104732306A (en) * | 2013-12-19 | 2015-06-24 | 北京索为高科系统技术有限公司 | Rapid development system for service application system and method |
| CN105630502A (en) * | 2015-12-28 | 2016-06-01 | 武汉传神信息技术有限公司 | Method and system for generating dynamic form |
Non-Patent Citations (1)
| Title |
|---|
| 李洪营;基于模型驱动的web表单开发工具的设计与实现;《中国优秀硕士学位论文全文数据库 信息科技辑》;20160215;I138-662 * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN107203595A (en) | 2017-09-26 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN107203595B (en) | Method for dynamically generating web interface based on free form | |
| JP6730399B2 (en) | System and method for dialog customization | |
| US7750924B2 (en) | Method and computer-readable medium for generating graphics having a finite number of dynamically sized and positioned shapes | |
| US9582288B1 (en) | Method for integrating software components into a spreadsheet application | |
| US7831929B2 (en) | Method, system, and program product for controlling a display on a data editing screen | |
| CN107025037B (en) | Control method and device of intelligent equipment | |
| US20130290837A1 (en) | Method and Apparatus for Correcting Document Formatting Based on Source Document | |
| CN113641719A (en) | Data processing method, data processing device, computer and storage medium | |
| KR20170042464A (en) | A batch processing system for properties of the Building Information Modeling library | |
| CN113553635A (en) | Method and device for configuring graph base primitive, electronic equipment and storage medium | |
| CN106886390A (en) | A kind of Java object generation and conversion method and Java object generation and conversion equipment | |
| CN110968311B (en) | Front-end page construction method and device and electronic equipment | |
| US9355130B1 (en) | Method and system for component parameter management | |
| CN106648338A (en) | Method and device for editing data | |
| CN103294516A (en) | Method and device for displaying information | |
| CN110866379B (en) | Data Visualization Chart Library System | |
| WO2016133153A2 (en) | Information management device, and file management method | |
| CN106227713A (en) | The processing method and processing device of document | |
| CN111079382A (en) | Form rendering method and system based on MVVM (multifunction virtual machine) mode | |
| WO2020125541A1 (en) | Apparatus and method for menu having diversified option names | |
| CN108170415B (en) | Light application program creating method based on configurable control | |
| CN117931164A (en) | Form application design method and system based on low codes | |
| KR20050081336A (en) | Method and programm recording medium for customizing a presentation file according to event | |
| CN117271510A (en) | Construction method of material data management platform and material data management platform | |
| CN114254333A (en) | Application permission processing method and device |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |