CN107102859A - 自动填充Web表单的方法 - Google Patents

自动填充Web表单的方法 Download PDF

Info

Publication number
CN107102859A
CN107102859A CN201710263432.5A CN201710263432A CN107102859A CN 107102859 A CN107102859 A CN 107102859A CN 201710263432 A CN201710263432 A CN 201710263432A CN 107102859 A CN107102859 A CN 107102859A
Authority
CN
China
Prior art keywords
web
object entity
html
automatic filling
lists
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.)
Pending
Application number
CN201710263432.5A
Other languages
English (en)
Inventor
梅文甲
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Qianxun Position Network Co Ltd
Original Assignee
Qianxun Position Network Co Ltd
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 Qianxun Position Network Co Ltd filed Critical Qianxun Position Network Co Ltd
Priority to CN201710263432.5A priority Critical patent/CN107102859A/zh
Publication of CN107102859A publication Critical patent/CN107102859A/zh
Pending legal-status Critical Current

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/31—Programming languages or programming paradigms
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/14—Tree-structured documents
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/166—Editing, e.g. inserting or deleting
    • G06F40/174—Form filling; Merging

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Health & Medical Sciences (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Artificial Intelligence (AREA)
  • Computing Systems (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

本发明提供一种自动填充Web表单的方法，所述方法基于AJAX框架并使用HTML自定义属性实现，所述方法所设计的模块包括AJAX接口调用模块，对象实体分析器，HTML属性扫描器，表单数据填充器，Web请求处理器，对象实体处理器，对象实体容器。本发明解决了对象实体到Web表单的自动填充的技术问题，数据请求地址和参数通过自定义属性声明在Web表单的标签中，与表单在一起，易于阅读和维护。

Description

自动填充Web表单的方法
技术领域
本发明涉及表单填充技术领域，特别涉及一种基于AJAX框架和HTML自定义属性自动填充Web表单的方法。
背景技术
HTML是用来描述网页的一种语言，是一种超文本标记语言(Hyper Text MarkupLanguage)，HTML使用标记标签来描述网页，HTML标记标签通常称为HTML标签(HTML tag)，如尖括号包围的关键字，<HTML><body><div>等，HTML标签具体呈现的内容以及样式是根据标签中的属性进行展示，如样式style，样式类class，标示id，宽width，高height等。标签属性不局限于只有浏览器识别的固定属性，也可以自定义的属性，浏览器对不识别的属性会自定进行过滤并不影响浏览器展示。
在Web起步早期，大部分网站都是静态页面，其中HTML内容是固定的，一个请求对应一个固定的HTML页面，但是对于静态HTML维护更新网站内容工作量巨大，之后出现了动态Web技术，如Java Servlet，ASP.NET等，服务器根据不同的请求动态生成相应的HTML返回给客户端，此方法解决了更新维护HTML难的问题，此方法对于动态更新内容有一定的局限性就是更新需要重新加载整个页面。后续就诞生了AJAX(Asynchronous JavaScript andXML，异步JavaScript和XML)技术，AJAX并不是一种新的编程语言，而是一种使用现有标准的新方法，实现在不重新加载整个页面的情况下，与服务器交互数据并实现局部更新网页的技术。
动态Web系统一般分为MVC(MODEL，VIEW，CONTROLLER，模型-视图-控制器)三层，VIEW指的就是上文提到的HTML，MODE层和CONTROLLER根据后台服务器的语言有各自的实现方法。通过AJAX可以屏蔽掉MODE、CONTROLLER实现的不同，提供给客户端只是单纯的数据，在客户端只需要考虑通过JS脚本去实现表单数据的填充，通常情况下填充方式是一对一的去填充，事先知道有哪些DOM(Document Object Model，文档对象模型)元素需要去填充，再从数据实体中获取对应属性的值，再更新到DOM元素上实现表单数据的更新。但在数据对象的结构进行变更的时候，如增加一个属性，删除一个属性，修改属性的名称等，都需要涉及HTML和JS脚本的变更，而且HTML页面和JS脚本之间相互依赖，其维护成本是很大，出错率很高。
现有的技术方案如下：
1、客户端(通常指浏览器)向服务器请求静态页面，获取Web表单视图；
2、客户端JS脚本根据预设好的数据请求地址和参数，向服务器请求数据；
3、服务器端Web处理器接收到客户端请求，解析对象参数，并分发给对应的对象实体处理器进行处理；
4、对象实体处理器解析对象参数，从数据库数据源中查询相应的对象实体；
5、如果存在对应的对象实体，填充对象并返回给服务器Web请求处理器，如果不存在，则返回不存在数据的标示给服务器Web请求处理器。
6、服务器Web处理器将对象处理器获取的结果封装成一定的数据格式，如JSON(JavaScript Object Notation JS，对象标记，是一种轻量级的数据交换格式)或者XML格式等，返回消息给客户端。
7、客户端接收到消息后回，回调到客户端AJAX接口调用模块，并将服务器返回的数据传递给表单数据填充器。
8、客户端JS脚本根据预设好的代码-其中每一个需要去填充的DOM元素都需要编写相应的获取数据逻辑以及填充DOM元素内容的逻辑，从而实现视图的更新。
现有技术方案存在的问题如下：
1、填充表单内容的逻辑累赘而复杂，需要针对每一个字段编写对应的获取数据逻辑和填充内容的逻辑，对于表单内容的变更，需要在HTML页面和JS脚本中同时进行变更。可维护性差，出错率高。
2、数据请求的地址通过写在JS脚本中，而表单的结构在HTML中，阅读性差。
发明内容
本发明提出了一种自动填充Web表单的方法，解决了对象实体到Web表单自动填充的技术问题。
本发明采用的技术方案是：
一种自动填充Web表单的方法，所述方法基于AJAX框架并使用HTML自定义属性，包括以下步骤：
步骤1，客户端向Web服务器请求静态页面，获取Web表单视图；
步骤2，HTML属性扫描器获取Web表单数据请求的地址以及参数；
步骤3，客户端根据步骤2中获取的地址及参数，组装Web请求地址，通过客户端AJAX接口调用模块，向Web服务器发出获取Web表单数据请求；
步骤4，Web请求处理器接收到客户端Web表单数据请求，解析Web表单数据请求参数，并分发给对象实体处理器进行处理；
步骤5，对象实体处理器根据对象标示，从对象实体容器中查询相应的对象实体；
步骤6，如果对象实体容器存在对应的对象实体，获取对象并返回给Web请求处理器；如果不存在对应的对象实体，则返回不存在的标示给Web请求处理器；
步骤7，Web请求处理器将对象实体处理器获取的结果封装成数据格式，返回消息给客户端；
步骤8，客户端接收到服务器消息响应后，回调客户端AJAX接口调用模块，AJAX接口调用模块将服务器返回的数据组装为对象实体传递给对象实体分析器；
步骤9，对象实体分析器判断对象实体是否存在，如果不存在，执行步骤10；如果存在，执行步骤11；
步骤10，不更新Web表单数据；
步骤11，遍历对象实体的属性-值组成的键值对；
步骤12，HTML属性扫描器根据步骤11中的属性对HTML页面进行扫描，判断是否存在对应的DOM元素，如果不存在，执行步骤13；如果存在，执行步骤14；
步骤13，执行步骤11，继续遍历对象实体的属性-值组成的键值对，直到遍历完所有的键值对；
步骤14，表单数据填充器将寻找到的DOM元素的内容更新为与对象实体的属性对应的值。
进一步地，所述方法通过HTML和JS语言实现。
进一步地，所述HTML自定义属性包括field、name和serverurl字段。
进一步地，所述步骤1中客户端是浏览器。
进一步地，所述步骤3中AJAX接口调用模块集成于第三方AJAX框架，实现对指定地址和参数请求Web服务器并接收Web服务器响应。
进一步地，所述步骤7中数据格式包括JSON或XML。
进一步地，所述步骤8中对象实体分析器分析对象实体的结构内容、属性以及与属性对应的值。
进一步地，所述步骤2和步骤12中HTML属性扫描器根据指定的属性扫描HTML页面，获取对应的DOM元素及其属性值。
进一步地，所述步骤14中表单数据填充器集成于第三方的Javascript框架，实现对DOM元素进行内容填充变更。
本发明数据请求地址和参数通过自定义属性声明在Web表单的标签中，与表单在一起，本发明有益效果如下：
1、填充表单内容是一个通用的逻辑，在表单结构变更的时候，只需要在对应的修改的DOM元素上编辑对应的自定义属性，就能实现表单内容的自动填充更新。
2、表单结构变更只用单一维护表单本身，不用关心JS脚本，降低开发成本，提高开发效率，增强系统拓展性和可维护性。
附图说明
图1是本发明系统结构图。
图2是本发明流程图。
具体实施方式
本发明通过HTML自定义属性，声明与对象实体的之间的对应关系，通过遍历对象实体的属性和值，通过HTML属性扫描器自动寻找与对象实体的属性对应的DOM元素，并更新其内容。下文中，结合附图和实施例对本发明作进一步阐述。
图1是本发明系统结构图，包括客户端20和Web服务器30，客户端20通常指浏览器，包括HTML属性扫描器22，表单数据填充器23，对象实体分析器24和AJAX接口调用模块25；Web服务器包括Web请求处理器31，对象实体处理器32，对象实体容器33。
本发明一种自动填充Web表单的方法基于AJAX框架并使用HTML自定义属性实现，所述的HTML自定义属性不局限于具体的某一个属性，依赖HTML属性扫描器22的具体实现方法，如field、name、serverurl字段等。图2是本发明流程图，包括以下步骤：
步骤1，客户端20向Web服务器30请求静态页面，获取Web表单视图。
步骤2，HTML属性扫描器22获取Web表单数据请求的地址以及参数。
步骤3，客户端20根据步骤2中获取的地址及参数，组装Web请求地址，通过客户端的AJAX接口调用模块25，向Web服务器30发出获取Web表单数据请求。
步骤4，Web请求处理器31接收到客户端Web表单数据请求，解析Web表单数据请求参数，并分发给对象实体处理器32进行处理。
步骤5，对象实体处理器32根据对象标示，从对象实体容器33中查询相应的对象实体。
步骤6，如果对象实体容器33存在对应的对象实体，获取对象并返回给Web请求处理器31；如果不存在对应的对象实体，则返回不存在的标示给Web请求处理器31。
步骤7，Web请求处理器31将对象实体处理器32获取的结果封装成一定的数据格式，如JSON或者XML格式等，返回消息给客户端20。
步骤8，客户端20接收到服务器消息响应后，回调客户端的AJAX接口调用模块25，AJAX接口调用模块25将服务器返回的数据组装为对象实体传递给对象实体分析器24。对象实体分析器24分析对象实体的结构内容，有哪些属性，以及与属性对应的值。
步骤9，对象实体分析器24判断对象实体是否存在，如果不存在，执行步骤10；如果存在，执行步骤11。
步骤10，不更新Web表单数据。
步骤11，遍历对象实体的属性-值组成的键值对，其中对每一组键值对进行如下步骤12-步骤14操作。
步骤12，HTML属性扫描器22根据步骤11中的属性对HTML页面进行扫描，判断是否存在与此属性对应的DOM元素，如果不存在，执行步骤13；如果存在，执行步骤14；
步骤13，执行步骤11，继续遍历对象实体的属性-值组成的键值对，直到遍历完所有的键值对；
步骤14，表单数据填充器23将寻找到的DOM元素的内容更新为与对象实体的属性对应的值。
较佳地，所述AJAX接口调用模块25集成于第三方AJAX框架，实现对指定地址和参数请求Web服务器30并接收Web服务器30响应。
较佳地，所述HTML属性扫描器22根据指定的属性扫描HTML页面，获取对应的DOM元素及其属性值。
较佳地，所述表单数据填充器23集成于第三方的Javascript框架，实现对指定DOM元素进行内容填充变更。
所述Web请求处理器31、对象实体处理器32、对象实体容器33不局限于某一种语言和技术方案，优选采用HTML和JS语言实现。
本发明虽然已以较佳实施例公开如上，但其并不是用来限定本发明，任何本领域技术人员在不脱离本发明的精神和范围内，都可以利用上述揭示的方法和技术内容对本发明技术方案做出可能的变动和修改，因此，凡是未脱离本发明技术方案的内容，依据本发明的技术实质对以上实施例所作的任何简单修改、等同变化及修饰，均属于本发明技术方案的保护范围。

Claims (9)

1.一种自动填充Web表单的方法，所述方法基于AJAX框架并使用HTML自定义属性，其特征在于，包括以下步骤：
步骤1，客户端向Web服务器请求静态页面，获取Web表单视图；
步骤2，HTML属性扫描器获取Web表单数据请求的地址以及参数；
步骤3，客户端根据步骤2中获取的地址及参数，组装Web请求地址，通过客户端AJAX接口调用模块，向Web服务器发出获取Web表单数据请求；
步骤4，Web请求处理器接收到客户端Web表单数据请求，解析Web表单数据请求参数，并分发给对象实体处理器进行处理；
步骤5，对象实体处理器根据对象标示，从对象实体容器中查询相应的对象实体；
步骤6，如果对象实体容器存在对应的对象实体，获取对象并返回给Web请求处理器；如果不存在对应的对象实体，则返回不存在的标示给Web请求处理器；
步骤7，Web请求处理器将对象实体处理器获取的结果封装成数据格式，返回消息给客户端；
步骤8，客户端接收到服务器消息响应后，回调客户端AJAX接口调用模块，AJAX接口调用模块将服务器返回的数据组装为对象实体传递给对象实体分析器；
步骤9，对象实体分析器判断对象实体是否存在，如果不存在，执行步骤10；如果存在，执行步骤11；
步骤10，不更新Web表单数据；
步骤11，遍历对象实体的属性-值组成的键值对；
步骤12，HTML属性扫描器根据步骤11中的属性对Web表单进行扫描，判断是否存在与属性对应的DOM元素，如果不存在，执行步骤13；如果存在，执行步骤14；
步骤13，执行步骤11，继续遍历对象实体的属性-值组成的键值对，直到遍历完所有的键值对；
步骤14，表单数据填充器将寻找到的DOM元素的内容更新为与对象实体的属性对应的值。
2.如权利要求1所述的一种自动填充Web表单的方法，其特征在于，所述方法通过HTML和JS语言实现。
3.如权利要求1所述的一种自动填充Web表单的方法，其特征在于，所述HTML自定义属性包括field、name和serverurl字段。
4.如权利要求1所述的一种自动填充Web表单的方法，其特征在于，所述步骤1中客户端是浏览器。
5.如权利要求1所述的一种自动填充Web表单的方法，其特征在于，所述步骤3中AJAX接口调用模块集成于第三方AJAX框架，实现对指定地址和参数请求Web服务器并接收Web服务器响应。
6.如权利要求1所述的一种自动填充Web表单的方法，其特征在于，所述步骤7中数据格式包括JSON或XML。
7.如权利要求1所述的一种自动填充Web表单的方法，其特征在于，所述步骤8中对象实体分析器分析对象实体的结构内容、属性以及与属性对应的值。
8.如权利要求1所述的一种自动填充Web表单的方法，其特征在于，所述步骤2和步骤12中HTML属性扫描器根据指定的属性扫描HTML页面，获取对应的DOM元素及其属性值。
9.如权利要求1所述的一种自动填充Web表单的方法，其特征在于，所述步骤14中表单数据填充器集成于第三方的Javascript框架，实现对DOM元素进行内容填充变更。
CN201710263432.5A 2017-04-20 2017-04-20 自动填充Web表单的方法 Pending CN107102859A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201710263432.5A CN107102859A (zh) 2017-04-20 2017-04-20 自动填充Web表单的方法

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201710263432.5A CN107102859A (zh) 2017-04-20 2017-04-20 自动填充Web表单的方法

Publications (1)

Publication Number Publication Date
CN107102859A true CN107102859A (zh) 2017-08-29

Family

ID=59657185

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201710263432.5A Pending CN107102859A (zh) 2017-04-20 2017-04-20 自动填充Web表单的方法

Country Status (1)

Country Link
CN (1) CN107102859A (zh)

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108415963A (zh) * 2018-02-07 2018-08-17 阿里巴巴集团控股有限公司 一种页面生成方法和装置
CN108595681A (zh) * 2018-05-02 2018-09-28 恒生电子股份有限公司 用于表单展示的方法、装置及系统
CN109783065A (zh) * 2017-11-15 2019-05-21 财团法人资讯工业策进会 产生对话式用户接口的方法及系统
CN109918370A (zh) * 2019-01-24 2019-06-21 西安交通大学 一种基于web的可配置表单应用前端的开发方法及系统
CN113220281A (zh) * 2021-04-30 2021-08-06 北京字跳网络技术有限公司 一种信息生成方法、装置、终端设备及存储介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101694618A (zh) * 2009-09-01 2010-04-14 卡斯柯信号有限公司 适用于ajax框架的模型层与视图层数据自动映射方法
CN104461513A (zh) * 2014-11-21 2015-03-25 山东航天信息有限公司 一种生成表单界面的方法及装置
CN104731594A (zh) * 2015-03-26 2015-06-24 浪潮集团有限公司 一种基于Bootstrap显示运行时定制页面的方法
CN105760440A (zh) * 2016-02-02 2016-07-13 广州市科南软件有限公司 在线表单设计器的实现方法及其系统

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101694618A (zh) * 2009-09-01 2010-04-14 卡斯柯信号有限公司 适用于ajax框架的模型层与视图层数据自动映射方法
CN104461513A (zh) * 2014-11-21 2015-03-25 山东航天信息有限公司 一种生成表单界面的方法及装置
CN104731594A (zh) * 2015-03-26 2015-06-24 浪潮集团有限公司 一种基于Bootstrap显示运行时定制页面的方法
CN105760440A (zh) * 2016-02-02 2016-07-13 广州市科南软件有限公司 在线表单设计器的实现方法及其系统

Cited By (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109783065A (zh) * 2017-11-15 2019-05-21 财团法人资讯工业策进会 产生对话式用户接口的方法及系统
CN108415963A (zh) * 2018-02-07 2018-08-17 阿里巴巴集团控股有限公司 一种页面生成方法和装置
CN108595681A (zh) * 2018-05-02 2018-09-28 恒生电子股份有限公司 用于表单展示的方法、装置及系统
CN109918370A (zh) * 2019-01-24 2019-06-21 西安交通大学 一种基于web的可配置表单应用前端的开发方法及系统
CN113220281A (zh) * 2021-04-30 2021-08-06 北京字跳网络技术有限公司 一种信息生成方法、装置、终端设备及存储介质

Similar Documents

Publication Publication Date Title
CN107102859A (zh) 自动填充Web表单的方法
CN106096056B (zh) 一种基于分布式的舆情数据实时采集方法和系统
US7406498B2 (en) Dynamic integration of web sites
CN110400196A (zh) 一种页面处理方法、装置及计算机可读存储介质
US8504913B2 (en) Client-side components
US8549497B2 (en) High-level hypermedia synthesis for adaptive web
DE60121987T2 (de) Zugreifen auf Daten, die bei einer Zwischenstation gespeichert sind, von einem Dienst aus
US20080104025A1 (en) Method and system for efficient execution and rendering of client/server interactive applications
CN101997927A (zh) 一种web平台数据缓存的方法和系统
CN106155673B (zh) 实现页面内容编辑器的方法、装置、服务器及用户设备
US20080120257A1 (en) Automatic online form filling using semantic inference
CN101158896A (zh) 基于mvc的业务组装和页面模板化开发web平台的方法
CN103959281A (zh) 用于将第三方内容与在线文档签名相关联的方法
CN107885497A (zh) 一种基于表格框架的网页前端数据展示方法及装置
CN107678943B (zh) 抽象页面对象的页面自动化测试方法
CN106686023A (zh) 一种流程设计方法、客户机、服务器侧装置及系统
US9614901B2 (en) Data infrastructure for providing interconnectivity between platforms, devices, and operating systems
CN106997298A (zh) 一种应用资源获取方法及装置
CN106873952B (zh) 移动端网页开发的数据处理系统和方法、及应用装置
US20170031877A1 (en) Web Page Design System
CN105718559A (zh) 查找表单页面和目标页面转化关系的方法和装置
US20180341477A1 (en) Descriptor-transformer framework in an integration platform
CN108268260A (zh) 一种基于一体化支撑技术的快速微应用组装方法
CN104346398A (zh) 网上自动填报数据的方法及其装置
CN108614686A (zh) 画面信息生成装置、画面信息生成方法及记录介质

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
RJ01 Rejection of invention patent application after publication
RJ01 Rejection of invention patent application after publication

Application publication date: 20170829