CN105760440B - The implementation method and its system of online Form Designer - Google Patents
The implementation method and its system of online Form Designer Download PDFInfo
- Publication number
- CN105760440B CN105760440B CN201610074587.XA CN201610074587A CN105760440B CN 105760440 B CN105760440 B CN 105760440B CN 201610074587 A CN201610074587 A CN 201610074587A CN 105760440 B CN105760440 B CN 105760440B
- Authority
- CN
- China
- Prior art keywords
- list
- instruction
- html
- online form
- form designer
- 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
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/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
Abstract
The present invention relates to the implementation methods and its system of a kind of online Form Designer, wherein, the implementation method of online Form Designer, the following steps are included: carrying out instruction encapsulation to online Form Designer, the first HTML and list JSON data are obtained, and the first HTML and list JSON data are sent to server；Instruction encapsulation includes to instruction setting height and content and the initialization for carrying out relevant information；Receive the list HTML code that server is parsed according to the first HTML and list JSON data；Preset manual compiling instruction is called to compile list HTML code manually, the list HTML code after manual compiling is shown on the page by the list HTML code after being compiled manually.The present invention provides the online Form Designers that one kind can be combined with AngularJS frame.
Description
Technical field
The present invention relates to WEB development field technologies, a kind of implementation method more particularly to online Form Designer and its
System.
Background technique
Currently, online Form Designer existing for market mainly utilize HTML (HyperText Markup Language:
Hypertext markup language), JavaScript, JSON (JavaScript Object Notation:JavaScript object indicate
Method) and the realization of XML (Extensible Markup Language: extensible markup language) technology；HTML technology is used in page
List is shown on face, JavaScript technology is for being edited and being designed to list, and JSON and XML technology are then for depositing
Store up the list of design.When needing to show list, HTML is converted into according to certain rules to JSON or XML in server end,
It is transferred to client again and shows list.It is current that there is no a online Form Designers combined with AngularJS frame.
It is equivalent to a single-page application using the application of AngularJS technology, unlike common Web application has page
The trigger timing that face has rendered, this results in the DOM (Document that operation pages are purely gone using JavaScript technology
Object Model: DOM Document Object Model) member usually designing form when, it may appear that obtain less than DOM element object the case where, lead
Cause system fault.Therefore, AngularJS official document does not recommend directly directly to operate DOM member using JavaScript technology
Element.If necessary to DOM element is operated movement when, then be recommended to use distinctive " instruction " Lai Shixian of AngularJS.But
When using " instruction ", after missing compilation process, form design extension element can not be recompilated and be shown on the page.And
And for some special instructions, compared to the form controls of list routine in HTML, " instruction " can not be with routine
Mode assignment is simultaneously shown.
Therefore, inventor's discovery is primarily present in the application using AngularJS as frame using online Form Designer
Following problems:
AngularJS is in the application of frame, and DOM object is obtained using JavaScript selector will fail；
AngularJS distinctive " instruction " cannot be shown to the page after page rendering；For some special form controls " instruction ",
JavaScript can not carry out assignment and value to it.In addition, online Form Designer on the market needs user voluntarily right
List pattern is controlled and is laid out, complicated for operation.
Summary of the invention
Based on this, it is necessary to be set for the online list that can be combined with AngularJS frame is lacked in traditional technology
The problem of gauge, provides the implementation method and its system of a kind of online Form Designer.
To achieve the goals above, the embodiment of technical solution of the present invention are as follows:
On the one hand, a kind of implementation method of online Form Designer is provided, comprising the following steps:
Instruction encapsulation is carried out to online Form Designer, obtains the first HTML and list JSON data, and by the first HTML
Server is sent to list JSON data；Instruction encapsulation includes to instruction setting height and content and carrying out relevant information
Initialization；
Receive the list HTML code that server is parsed according to the first HTML and list JSON data；
Preset manual compiling instruction is called to compile list HTML code manually, the list after being compiled manually
List HTML code after manual compiling is shown on the page by HTML code.
On the one hand, a kind of implementation method of online Form Designer is additionally provided, comprising the following steps:
Receive the first HTML and list JSON data；First HTML and list JSON data be browser client by pair
Online Form Designer carries out the data that instruction encapsulation obtains；Instruction encapsulation includes to instruction setting height and content and progress
The initialization of relevant information；
According to the first HTML and the list JSON data, parsing obtains list HTML code, and by list HTML code
It is sent to browser client；By browser client by calling preset manual compiling instruction to carry out list HTML code
Compiling manually, the list HTML code after being compiled manually, and the list HTML code after manual compiling is shown to the page
On.
On the other hand, a kind of realization system of online Form Designer is provided, comprising:
Package module is instructed to obtain the first HTML and list JSON for carrying out instruction encapsulation to online Form Designer
Data, and the first HTML and list JSON data are sent to server；Instruction encapsulation includes to instruction setting height and content
And carry out the initialization of relevant information；
Browser client receiving module parses to obtain for receiving server according to the first HTML and list JSON data
List HTML code；
Collector obtains in one's hands for calling preset manual compiling instruction to compile list HTML code manually
List HTML code after dynamic compiling, and the list HTML code after manual compiling is shown on the page.
Above-mentioned technical proposal has the following beneficial effects:
The implementation method and its system of the online Form Designer of the present invention, will be based on component framework by using " instruction "
The online Form Designer of response type WEB is packaged, while being combined with AngularJS technology, solves to use JavaScript
The problem of operation DOM element may malfunction；By compiling " instruction " manually after pagecompile has rendered, to list HTML code
It is recompilated and is shown on the page；The present invention provides the online tables that one kind can be combined with AngularJS frame
Set up gauge.
Detailed description of the invention
Fig. 1 is the implementation method embodiment 1 for the online Form Designer that the present invention is realized from browser client angle
Flow diagram；
Fig. 2 is the process of the implementation method embodiment 1 for the online Form Designer that the present invention is realized from server side perspective
Schematic diagram；
Fig. 3 is the realization system embodiment 1 for the online Form Designer that the present invention is realized from browser client angle
Structural schematic diagram；
Fig. 4 is the one specific embodiment schematic diagram of implementation method and its system of the online Form Designer of the present invention.
Specific embodiment
To facilitate the understanding of the present invention, a more comprehensive description of the invention is given in the following sections with reference to the relevant attached drawings.In attached drawing
Give preferred embodiment of the invention.But the invention can be realized in many different forms, however it is not limited to this paper institute
The embodiment of description.On the contrary, purpose of providing these embodiments is make it is more thorough and comprehensive to the disclosure.
Unless otherwise defined, all technical and scientific terms used herein and belong to technical field of the invention
The normally understood meaning of technical staff is identical.Term as used herein in the specification of the present invention is intended merely to description tool
The purpose of the embodiment of body, it is not intended that in the limitation present invention.Term " and or " used herein includes one or more phases
Any and all combinations of the listed item of pass.
The implementation method embodiment 1 for the online Form Designer that the present invention is realized from browser client angle:
In order to solve to lack asking for the online Form Designer that can be combined with AngularJS frame in traditional technology
Topic, the present invention provides a kind of implementation method embodiments 1 of online Form Designer realized from browser client angle；Figure
The flow diagram of the implementation method embodiment 1 of the 1 online Form Designer realized for the present invention from browser client angle；
As shown in Figure 1, may comprise steps of:
Step S110: carrying out instruction encapsulation to online Form Designer, obtains the first HTML and list JSON data, and will
First HTML and list JSON data are sent to server；Instruction encapsulation includes to instruction setting height and content and carrying out phase
Close the initialization of information；
Step S120: the list HTML code that server is parsed according to the first HTML and list JSON data is received；
Step S130: it calls preset manual compiling instruction to compile list HTML code manually, is compiled manually
List HTML code after manual compiling is shown on the page by the list HTML code after translating.
In a specific embodiment, step S130 calls preset manual compiling instruction to carry out list HTML code
The step of compiling can specifically include manually:
By calling preset manual compiling instruction, list HTML code is associated with corresponding attribute value；
When listening to attribute value and changing, the attribute value after variation is inserted into list HTML code, and is passed through
AngularJS compiles the attribute value after variation manually.
Specifically, compiling " instruction " (preset code) manually is called to carry out relevant list HTML code segment
Compiling manually.In the present embodiment, compiling " instruction " can be serviced by " the $ compile " built in AngularJS manually, first
It is associated with list HTML code first with " attribute ", and monitor whether the attribute changes, when a change, just should
Value (attribute value after changing) after attribute change is inserted into list HTML code, and " $ compile " is utilized to compile manually
Value after above-mentioned attribute change enables the instruction in list HTML code to come into force.Compiling " instruction " can be compiled in the page manually
It translates after having rendered, list HTML code is re-started and compiles and is shown to the page.
In a specific embodiment, the step of step S110 carries out instruction encapsulation to online Form Designer specifically may be used
To include:
Online Form Designer is inserted into the online form design page by instruction, and judges whether to obtain online
The object of Form Designer；
If the object cannot be obtained, preset JavaScript code is loaded, and carry out just to online Form Designer
Beginningization.
In a specific embodiment, the step of step S110 carries out instruction encapsulation to online Form Designer can be with
Include:
It will be serviced in injection instruction by AngularJS, service includes the preservation of online Form Designer, assignment and acquisition
The operation code of form parameters.
Specifically, carry out instruction encapsulation to online Form Designer, can by the way that height and content is arranged to " instruction ",
Initialization related information is realized.First online Form Designer is inserted into the online form design page in " instruction ", then
Judge whether that the object that can get online Form Designer loads related necessary JavaScript code if can not obtain
After (will illustrate in a specific embodiment of the invention), then online Form Designer is initialized." refer at this
Enable " in be also filled with " formDesignService " service class (the dependence injection mechanism provided using AngularJS can be
Will be in relevant service injection instruction when writing " instruction "), which houses form design preservation, assignment, obtains list
The objects such as the operation codes such as parameter and Form Designer, so that corresponding operation can be done to Form Designer except instruction.
It by using " instruction " to encapsulate online Form Designer, and is combined with AngularJS technology, can solve biography
The error problem of JavaScript operation DOM element is used in system technology.
In a specific embodiment, the reality for the online Form Designer that the present invention is realized from browser client angle
Existing embodiment of the method 1 can with comprising steps of
Value and assignment are carried out to online Form Designer by bi-directional data binding.
Specifically, " the bi-directional data binding " using AngularJS services, it can be each list in designing form
One object of control bundle need to only obtain the object in this way when needing to obtain the data of the list.And the tax to list
Value then only need to be the object value, using " the bi-directional data binding " of AngularJS can easily realize the value of list with
Assignment.
The implementation method embodiment 1 for the online Form Designer that the present invention is realized from browser client angle, by making
The online Form Designer of response type WEB based on component framework is packaged with " instruction ", at the same with AngularJS technology phase
In conjunction with, solve the problems, such as using JavaScript operation DOM element may malfunction；By compiling " instruction " manually in pagecompile
After having rendered, list HTML code is recompilated and is shown on the page；It provides a kind of from browser client angle
Spend the online Form Designer that can be combined with AngularJS frame realized.
The implementation method embodiment 1 for the online Form Designer that the present invention is realized from server side perspective:
The technology of implementation method embodiment 1 based on the above-mentioned online Form Designer realized from browser client angle
Thought, while in order to solve to lack asking for the online Form Designer that can be combined with AngularJS frame in traditional technology
Topic, the present invention also provides a kind of implementation method embodiments 1 of online Form Designer realized from server side perspective；Fig. 2
The flow diagram of the implementation method embodiment 1 for the online Form Designer realized from server side perspective for the present invention；Such as Fig. 2
It is shown, it may comprise steps of:
Step S210: the first HTML and list JSON data are received；First HTML and list JSON data are browser visitor
Family end is by carrying out the data that instruction encapsulation obtains to online Form Designer；Instruction encapsulation includes highly and interior to instruction setting
Hold and carry out the initialization of relevant information；
Step S220: according to the first HTML and the list JSON data, parsing obtains list HTML code, and by list
HTML code is sent to browser client；By browser client by calling preset manual compiling instruction to list HTML
Code is compiled manually, the list HTML code after being compiled manually, and by the list HTML code exhibition after manual compiling
Show on the page.
In a specific embodiment, step S220 obtains list according to the first HTML and list JSON data, parsing
The step of HTML code, can specifically include:
According to the first HTML and list JSON data, preset list pattern layout code is called, obtains list HTML generation
Code.
Specifically, the relevant form layout's pattern of online Form Designer is configured in the relevant code in backstage, use
Without considering that the pattern of list is laid out when family operates, in a specific embodiment, need to only add into online Form Designer
Add form controls.When needing using list, in the form controls attribute that server end is stored by JSON form, in conjunction with
The list HTML code containing related style and layout can be obtained in configured list pattern layout code from the background.And pass through
Unified list pattern layout (calling preset list pattern layout code), defines without user's self-setting, user is facilitated to grasp
Make, simplifies operation.
In one particularly embodiment, the first HTML and list JSON data can also be stored in data by server
In library, related data is timely stored and obtains convenient for server.
The realization system embodiment 1 for the online Form Designer that the present invention is realized from browser client angle:
Technical solution based on above method embodiment, while can be in order to solve to lack in traditional technology
The problem of online Form Designer that AngularJS frame combines, the present invention provides one kind from browser client angle
The realization system embodiment 1 for the online Form Designer realized；Fig. 3 is of the invention from the online of browser client angle realization
The structural schematic diagram of the realization system embodiment 1 of Form Designer；As shown in figure 3, may include:
Package module 310 is instructed to obtain the first HTML and list for carrying out instruction encapsulation to online Form Designer
JSON data, and the first HTML and list JSON data are sent to server；Instruction encapsulation include to instruction setting height and
Content and the initialization for carrying out relevant information；
Browser client receiving module 320 is parsed for receiving server according to the first HTML and list JSON data
Obtained list HTML code；
Collector 330 is obtained for calling preset manual compiling instruction to compile list HTML code manually
List HTML code after compiling manually, and the list HTML code after manual compiling is shown on the page.
In a specific embodiment, collector 330 specifically can be used for by calling preset manual compiling to refer to
It enables, list HTML code is associated with corresponding attribute value；When listening to attribute value and changing, by the attribute after variation
Value is inserted into list HTML code, and is compiled manually by AngularJS to the attribute value after variation.
In a specific embodiment, the reality for the online Form Designer that the present invention is realized from browser client angle
Now system embodiment 1 can also include:
Value assignment module 340, for carrying out value and assignment to online Form Designer by bi-directional data binding.
The realization system embodiment 1 for the online Form Designer that the present invention is realized from browser client angle, passes through finger
Enable package module that the online Form Designer of response type WEB based on component framework is carried out instruction encapsulation, while and AngularJS
Technology combines, and solves the problems, such as to malfunction using JavaScript operation DOM element；By collector to list HTML
Code is recompilated and is shown on the page；Provide it is a kind of realized from browser client angle can be with
The online Form Designer that AngularJS frame combines.
The online implementation method of Form Designer and its technical solution of system, the present invention in order to which the present invention is further explained
Spy illustrates the online Form Designer of the present invention by taking the interactive process between browser client, server and database as an example
Implementation method and its system specific implementation process；Fig. 4 is the implementation method and its system of the online Form Designer of the present invention
One specific embodiment schematic diagram；As shown in figure 4, being specifically as follows following procedure:
1. " instruction " is used to encapsulate online Form Designer；
Instruction (directives) is most important ingredient in any AngularJS application.One instruction is exactly one and draws
Enter the thing of new syntax.Instruction is the label done on DOM element, and attached some specific behaviors simultaneously.
First online Form Designer is inserted into the online form design page in " instruction ", then decides whether to obtain
To the object of online Form Designer, if can not obtain, after loading related necessary JavaScript code, then to online list
Designer is initialized；In a specific embodiment, the above-mentioned necessary JavaScript code of correlation may include
Jquery-1.7.2.min.js, ueditor.config.js and ueditor.all.min.js " etc. are third-party
The library JavaScript；
Injection " formDesignService " services class in " instruction ", which houses form design and save, assign
Value obtains the objects such as operation codes and Form Designer such as form parameters, to do phase to Form Designer except instruction
Corresponding operation.In a specific embodiment, the dependence injection mechanism provided using AngularJS " can be referred to writing
Enable " when by relevant service injection instruction in, such as:
app.directive('conowUeditor',["formDesignService",
function(formDesignService){……}])；.
2. " instruction " is used to realize compiling manually；
The life cycle of AngularJS can be divided into compilation phase and operation DOM element stage.In the compilation phase,
AngularJS can traverse entire html document and handle the finger stated on the page according to the instruction definition in JavaScript
It enables, will modify to dom tree after entire html document has compiled.It therefore, can not after missing this compilation phase
Instruction in designed list is compiled again and is shown on the page.It is therefore desirable to call compiling " instruction " manually
Relevant list HTML code segment is compiled manually.Compiling " instruction " can pass through " the $ built in AngularJS manually
Compile " service, it is associated with list HTML code first with " attribute ", and monitor whether the attribute changes, work as hair
When changing, just the value after the attribute change is inserted into list HTML code, and " $ compile " is utilized to compile manually
Attribute value after stating variation, enables the instruction in list HTML code to come into force.
3. " bi-directional data binding " is used to realize the value and assignment of list；
Bi-directional data binding refers to modification meeting automatic synchronization of the user on view into data model；Likewise, such as
Value in fruit data model is changed, and can be also synchronized in view at once.
It is serviced using " the bi-directional data binding " of AngularJS, can be each form controls binding in designing form
One object, specifically, may comprise steps of:
When backstage generates correlation list html, " ng-model " is set a property for each form controls.Such as it is following
The layout pattern of Input:
String temp=" < div class=" form-group
{4}\"><label>{0}</label><div
Class=" input-container "><input type=" { 1 } "
Name=" { 2 } " id=" { 2 } "
Ng-model=" formDesign. { 2 } "
{3}/></div></div>"；
Wherein the control by ng-model bind be object " formDesign " an attribute.
In this way when needing to obtain the data of the list, the object need to be only obtained.And the assignment of list is then only needed
For the object value, the value and assignment of list can be easily realized using " the bi-directional data binding " of AngularJS.And have
The value and assignment process of body may comprise steps of:
It a. is that each form controls sets a property " ng-model " (Angularjs when backstage generates correlation list html
In a built-in instruction, pass through the instruction realize data double-way binding) binding one object；
B. front end page by " $ compile " manually compiling correlation html list, make in html with Angularjs phase
Instruction is closed to come into force.
As long as c. form controls inputs correlation values, which can get by " the bi-directional data binding " of Angularjs
The numerical value of middle input；If assignment operation is carried out to the object of form controls binding, the form controls on the page can also be shown
Show correlation values, realizes the assignment operation of form controls.
4. unified fixed form layout pattern；
The relevant form layout's pattern of online Form Designer is configured in the relevant code in backstage, specifically,
" parsing form controls tool-class " has an individual analytic method for resolution table single control every kind of form controls from the background
Part, relevant layout pattern are then stored in the variable in related resolution method, can specifically include following steps:
A. the analytic method of corresponding form controls is write；
B. a string variable is created in analytic method store relevant form layout's pattern；Such as:
String template=" < div class=" form-group
{4}\"><label>{0}</label><div
Class=" input-container "><input type=" { 1 } "
Name=" { 2 } " id=" { 2 } "
Ng-model=" formDesign. { 2 } " { 3 }/></div></div>"；
C. it will change the number in form layout's pattern and be substituted for the html code that correlation values produce front end needs.
Therefore, when user's operation without consider list pattern be laid out, in a specific embodiment, only need to toward
Form controls is added in line Form Designer.When needing using list, stored in server end by JSON form
The table containing related style and layout can be obtained in conjunction with the configured list pattern layout code in backstage in form controls attribute
Single HTML code.In addition, server can also store the first HTML and list JSON data in database shown in Fig. 4,
Related data is timely stored and obtained convenient for server.
One specific embodiment of implementation method and its system of the online Form Designer of the present invention, online Form Designer is made
It is encapsulated with " instruction ", is combined with AngularJS technology, solve to ask using what JavaScript operation DOM element may malfunction
Topic；Compiling " instruction " solves after pagecompile has rendered manually, re-starts to list HTML code and compiles and be shown to page
Face；It the use of distinctive " bi-directional data binding " characteristic of AngularJS is list assignment and display data；Unified list pattern cloth
Office is not required to the definition of user's self-setting, user-friendly；By solving to the comprehensive of the above problem, the present invention provides one
The online Form Designer that kind can be combined with AngularJS frame.
Each technical characteristic of embodiment described above can be combined arbitrarily, for simplicity of description, not to above-mentioned reality
It applies all possible combination of each technical characteristic in example to be all described, as long as however, the combination of these technical characteristics is not deposited
In contradiction, all should be considered as described in this specification.
The embodiments described above only express several embodiments of the present invention, and the description thereof is more specific and detailed, but simultaneously
It cannot therefore be construed as limiting the scope of the patent.It should be pointed out that coming for those of ordinary skill in the art
It says, without departing from the inventive concept of the premise, various modifications and improvements can be made, these belong to protection of the invention
Range.Therefore, the scope of protection of the patent of the invention shall be subject to the appended claims.
Claims (10)
1. a kind of implementation method of online Form Designer, which comprises the following steps:
Instruction encapsulation is carried out to online Form Designer, obtains the first HTML and list JSON data, and by the first HTML
Server is sent to the list JSON data；Described instruction encapsulation includes to instruction setting height and content and carrying out phase
Close the initialization of information；The list JSON data include the attribute information of AngularJS instruction；
Receive the list HTML code that the server is parsed according to the first HTML and the list JSON data；
It calls preset manual compiling instruction in AngularJS to compile the list HTML code manually, obtains manually
List HTML code after the manual compiling is shown on the page by the list HTML code after compiling.
2. the implementation method of online Form Designer according to claim 1, which is characterized in that call preset manual volume
The step of instruction compiles the list HTML code manually is translated to specifically include:
By calling the preset manual compiling instruction, the list HTML code is associated with corresponding attribute value；
When listening to the attribute value and changing, the attribute value after variation is inserted into the list HTML code, and
The attribute value after the variation is compiled manually by AngularJS.
3. the implementation method of online Form Designer according to claim 1, which is characterized in that online Form Designer
The step of carrying out instruction encapsulation specifically includes:
The online Form Designer is inserted into the online form design page by described instruction, and judges whether to obtain
The object of the online Form Designer；
If the object cannot be obtained, preset JavaScript code is loaded, and carry out just to the online Form Designer
Beginningization.
4. the implementation method of online Form Designer according to claim 3, which is characterized in that further comprise the steps of:
By AngularJS by service injection described instruction, the service includes the online Form Designer preservation, assignment
And obtain the operation code of form parameters.
5. the implementation method of online Form Designer as claimed in any of claims 1 to 4, which is characterized in that also
Comprising steps of
Value and assignment are carried out to the online Form Designer by bi-directional data binding.
6. a kind of implementation method of online Form Designer, which comprises the following steps:
Receive the first HTML and list JSON data；First HTML and the list JSON data are logical for browser client
It crosses and the data that instruction encapsulation obtains is carried out to online Form Designer；Described instruction encapsulation includes to instruction setting height and content
And carry out the initialization of relevant information；The list JSON data include the attribute information of AngularJS instruction；
According to the first HTML and the list JSON data, parsing obtains list HTML code, and by the list HTML
Code is sent to the browser client；By the browser client by calling preset manual volume in AngularJS
It translates instruction to compile the list HTML code manually, the list HTML code after being compiled manually, and by the hand
List HTML code after dynamic compiling is shown on the page.
7. the implementation method of online Form Designer according to claim 6, which is characterized in that according to the first HTML
With the list JSON data, parses the step of obtaining list HTML code and specifically includes:
According to the first HTML and the list JSON data, preset list pattern layout code is called, the table is obtained
Single HTML code.
8. a kind of realization system of online Form Designer characterized by comprising
Instruct package module, for carrying out instruction encapsulation to online Form Designer, obtain the first HTML and list JSON data,
And the first HTML and the list JSON data are sent to server；Described instruction encapsulation includes to instruction setting height
With the initialization of content and progress relevant information；The list JSON data include the attribute information of AngularJS instruction；
Browser client receiving module, for receiving the server according to the first HTML and the list JSON data
Parse obtained list HTML code；
Collector, for calling preset manual compiling instruction in AngularJS to carry out manually the list HTML code
Compiling, the list HTML code after being compiled manually, and the list HTML code after the manual compiling is shown to the page
On.
9. the realization system of online Form Designer according to claim 8, which is characterized in that
The collector is used for by calling the preset manual compiling instruction, by the list HTML code and accordingly
Attribute value it is associated；When listening to the attribute value and changing, the attribute value after variation is inserted into the list
In HTML code, and the attribute value after the variation is compiled manually by AngularJS.
10. the realization system of online Form Designer according to claim 8 or claim 9, which is characterized in that further include:
Value assignment module, for carrying out value and assignment to the online Form Designer by bi-directional data binding.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201610074587.XA CN105760440B (en) | 2016-02-02 | 2016-02-02 | The implementation method and its system of online Form Designer |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201610074587.XA CN105760440B (en) | 2016-02-02 | 2016-02-02 | The implementation method and its system of online Form Designer |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN105760440A CN105760440A (en) | 2016-07-13 |
| CN105760440B true CN105760440B (en) | 2019-06-04 |
Family
ID=56329651
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201610074587.XA Active CN105760440B (en) | 2016-02-02 | 2016-02-02 | The implementation method and its system of online Form Designer |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN105760440B (en) |
Families Citing this family (10)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN106776800B (en) * | 2016-11-22 | 2020-09-11 | 山东中创软件工程股份有限公司 | Page generation method, device and system for AngularJS framework |
| CN106599213B (en) * | 2016-12-16 | 2020-06-30 | 车智互联（北京）科技有限公司 | Automatic form filling method and system |
| CN107102859A (en) * | 2017-04-20 | 2017-08-29 | 千寻位置网络有限公司 | The method of automatic filling Web lists |
| CN107943455A (en) * | 2017-08-11 | 2018-04-20 | 成都萌想科技有限责任公司 | A kind of list rendering system based on JSON data formats |
| CN108363573A (en) * | 2018-01-11 | 2018-08-03 | 山东浪潮通软信息科技有限公司 | A kind of efficient mobile form design and rendering intent |
| CN110162301B (en) * | 2019-04-01 | 2023-07-04 | 贵州力创科技发展有限公司 | Form rendering method, form rendering device and storage medium |
| CN110442816B (en) * | 2019-07-12 | 2024-01-30 | 平安科技（深圳）有限公司 | Method and device for configuring web form and computer readable storage medium |
| CN111930379B (en) * | 2020-08-11 | 2021-07-06 | 上海亿锎智能科技有限公司 | Method, device and system for realizing Web end complaint form designer |
| CN111916164B (en) * | 2020-08-11 | 2023-06-16 | 上海太美星云数字科技有限公司 | Method and device for realizing center-started investigation system in clinical research |
| CN113031947A (en) * | 2021-03-05 | 2021-06-25 | 苏州帝博信息技术有限公司 | Configuration data management method and device used in interface design tool |
Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102360296A (en) * | 2011-10-20 | 2012-02-22 | 北京金和软件股份有限公司 | WEB-based online form development tool |
| CN102360290A (en) * | 2011-09-29 | 2012-02-22 | 用友软件股份有限公司 | Form building device and form building method |
| CN102707945A (en) * | 2012-04-11 | 2012-10-03 | 佳都新太科技股份有限公司 | Implementation method of form designer based on layout template in Eclipse |
| CN103631597A (en) * | 2013-12-09 | 2014-03-12 | 中博信息技术研究院有限公司 | Extensible markup language (XML)-based WEB form engine device and method |
-
2016
- 2016-02-02 CN CN201610074587.XA patent/CN105760440B/en active Active
Patent Citations (4)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN102360290A (en) * | 2011-09-29 | 2012-02-22 | 用友软件股份有限公司 | Form building device and form building method |
| CN102360296A (en) * | 2011-10-20 | 2012-02-22 | 北京金和软件股份有限公司 | WEB-based online form development tool |
| CN102707945A (en) * | 2012-04-11 | 2012-10-03 | 佳都新太科技股份有限公司 | Implementation method of form designer based on layout template in Eclipse |
| CN103631597A (en) * | 2013-12-09 | 2014-03-12 | 中博信息技术研究院有限公司 | Extensible markup language (XML)-based WEB form engine device and method |
Also Published As
| Publication number | Publication date |
|---|---|
| CN105760440A (en) | 2016-07-13 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN105760440B (en) | The implementation method and its system of online Form Designer | |
| CN105354013B (en) | Application interface rendering method and device | |
| CN105824787B (en) | A kind of control method and system of html template dynamic configuration | |
| US8418131B2 (en) | Interactive server side components | |
| US8266202B1 (en) | System and method for auto-generating JavaScript proxies and meta-proxies | |
| CN110806863A (en) | Interface document generation method and device, electronic equipment and storage medium | |
| US8839192B2 (en) | System and method for presentation of cross organizational applications | |
| US9122650B1 (en) | Web server based on the same paradigms as web clients | |
| US20090276479A1 (en) | Distributed execution model for cross-organizational declarative web applications | |
| CN104572092B (en) | Webpage making method and apparatus | |
| CN110347378A (en) | The building method and device of item development environment | |
| CN109766529A (en) | A kind of generation method and equipment of report | |
| CN110196733A (en) | A kind of default API document structure tree method, apparatus, equipment and storage medium | |
| CN108920496A (en) | A kind of rendering method and device | |
| CN110007924A (en) | The automated construction method and system of YANG model configuration interface | |
| CN103412742A (en) | Method and device for application program to be configured with UI | |
| CN104063231B (en) | Test resource rapid access method based on HIT-TENA | |
| CN110968317A (en) | Method and system for automatically generating vue page component through UCI/USI configuration file | |
| US8762956B1 (en) | Generating a report document from code | |
| CN109002390A (en) | A kind of test case dynamic state of parameters configuration method and device | |
| CN109284488A (en) | Based on the method, apparatus and medium that modification front end table column data is locally stored | |
| CN105025065B (en) | Web site is converted to the method, apparatus and system of Web application | |
| Grolaux et al. | Qtk: An integrated model-based approach to designing executable user interfaces | |
| US20050080608A1 (en) | Simulator for request/response systems | |
| CN111694723B (en) | Method for editing nodes and components when product runs under H5 and storage medium |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| C06 | Publication | ||
| PB01 | Publication | ||
| C10 | Entry into substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant | ||
| PE01 | Entry into force of the registration of the contract for pledge of patent right |
Denomination of invention: Implementation method and system of online form designer Effective date of registration: 20211209 Granted publication date: 20190604 Pledgee: China Minsheng Banking Corp Guangzhou branch Pledgor: CO-NOW! SOFTWARE Co.,Ltd. Registration number: Y2021440000365 |
|
| PE01 | Entry into force of the registration of the contract for pledge of patent right |