CN108959211A - 表单验证的方法和装置 - Google Patents

Abstract

本发明公开了一种表单验证的方法和装置，涉及计算机技术领域。该方法的一具体实施方式包括：将主表单根据类型划分为多个子表单；当调用所述子表单时，对所述子表单进行验证，验证结果通过回调函数传送。该实施方式提高了表单验证的可用性和灵活性；同时提高了代码的可扩展性，减少了代码耦合度。

Description

表单验证的方法和装置

技术领域

本发明涉及计算机技术领域，尤其涉及一种表单验证的方法和装置。

背景技术

Javascript是一种前端的脚本语言，Vue是一种基于Javascript的前端框架。表单验证是javascript中的高级选项之一，是在数据被送往服务器前对超文本标记语言(HTML)表单中的这些输入数据进行验证。被验证的表单数据包括：用户是否已填写表单中的必填项目、用户输入的邮件地址是否合法、用户是否已输入合法的日期或用户是否在数据域(numeric field)中输入了文本等。

如图1所示的现有技术中表单验证的方法的实现流程示意图中，在表单页面中引入基于Vue框架的表单验证组件(vee-validate)或者其他验证组件，且为每个输入框绑定校验规则，在表单页面中放置一个提交按钮，提交时调用vee-validate或者其他验证组件提供的方法对当前页面的表单进行校验。

在实现本发明过程中，发明人发现现有技术中至少存在如下问题：

1、只能实现一个表单(form)的校验，即只能在一个后缀名为.vue文件里面进行验证，由于实际生产都是将表单抽象为一个一个的单独组件，而且有可能出现动态表单，在这种情况下不适用，因此在实际使用时存在局限性；

2、子组件与父组件不能跨组件通信，无法实现父子组件之间的表单校验；

3、如果是一个很大的表单，只能写在一个页面，而且可能表单的一部分是其他页面公用的，需要些多份相同的代码，不方便于扩展，对于实际生产使用来说也不够灵活。

发明内容

有鉴于此，本发明实施例提供一种表单验证的方法和装置，能够解决现有技术无法实现跨组件的表单校验的技术问题。

为实现上述目的，根据本发明实施例的一个方面，提供了一种表单验证的方法。

本发明实施例的一种表单验证的方法包括将主表单根据类型划分为多个子表单；当调用所述子表单时，对所述子表单进行验证，验证结果通过回调函数传送。

可选地，所述方法还包括：获取所述主表单的数据参数，将所述数据参数发送至所述子表单。

可选地，所述数据参数包括输入框的类型和对应的校验规则，根据所述数据参数为所述输入框配置所述校验规则并进行初始化。

可选地，对所述子表单进行验证包括：为所述子表单绑定验证方法，所述验证方法对应于所述子表单的类型；执行所述验证方法。

可选地，执行所述验证方法包括：根据所述校验规则对所述输入框进行校验得到校验结果，并对所述校验结果进行分析以得到所述验证结果。

为实现上述目的，根据本发明实施例的另一方面，提供了一种表单验证的装置。

本发明实施例的一种表单验证的装置包括：划分模块，用于将主表单根据类型划分为多个子表单；验证模块，用于当调用所述子表单时，对所述子表单进行验证，验证结果通过回调函数传送。

可选地，所述装置还包括：获取模块，用于获取所述主表单的数据参数，将所述数据参数发送至所述子表单。

可选地，所述数据参数包括输入框的类型和对应的校验规则，根据所述数据参数为所述输入框配置所述校验规则并进行初始化。

可选地，所述验证模块还用于：为所述子表单绑定验证方法，所述验证方法对应于所述子表单的类型；执行所述验证方法。

可选地，所述验证模块进一步用于：根据所述校验规则对所述输入框进行校验得到校验结果，并对所述校验结果进行分析以得到所述验证结果。

为实现上述目的，根据本发明实施例的再一方面，提供了一种表单验证的电子设备。

本发明实施例的一种表单验证的电子设备包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现本发明实施例的表单验证的方法。

为实现上述目的，根据本发明实施例的又一方面，提供了一种计算机可读介质。

本发明实施例的一种计算机可读介质，其上存储有计算机程序，所述程序被处理器执行时实现本发明实施例的表单验证的方法。

上述发明中的一个实施例具有如下优点或有益效果：因为采用将主表单按类型划分为多个子表单，当调用子表单时，对子表单进行验证，验证结果通过回调函数传送的技术手段，所以克服了只能实现一个表单的校验，且子表单与主表单不能跨组件通信，无法实现跨组件的表单校验的技术问题，提高了表单验证的可用性和灵活性；同时，将表单进行组件化划分，实现了不同类型表单的组件化，而且支持一个页面引入多个表单，完成每个表单的校验，提高了代码的可扩展性，减少了代码耦合度。

上述的非惯用的可选方式所具有的进一步效果将在下文中结合具体实施方式加以说明。

附图说明

附图用于更好地理解本发明，不构成对本发明的不当限定。其中：

图1是现有技术中表单验证的方法的实现流程示意图；

图2是本发明实施例可以应用于其中的示例性系统架构图；

图3是根据本发明实施例的表单验证的方法的主要步骤的示意图；

图4是根据本发明实施例的表单验证的方法的实现流程示意图；

图5是根据本发明实施例的表单验证的方法的应用示意图；

图6是根据本发明实施例的表单验证的装置的主要模块的示意图；

图7是适于用来实现本发明实施例的终端设备或服务器的计算机系统的结构示意图。

具体实施方式

以下结合附图对本发明的示范性实施例做出说明，其中包括本发明实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本发明的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。

图2示出了可以应用本发明实施例的表单验证的方法或表单验证的装置的示例性系统架构200。

如图2所示，系统架构200可以包括终端设备201、202、203，网络204和服务器205。网络204用以在终端设备201、202、203和服务器205之间提供通信链路的介质。网络204可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。

用户可以使用终端设备201、202、203通过网络204与服务器205交互，以接收或发送消息等。终端设备201、202、203上可以安装有各种通讯客户端应用，例如购物类应用、网页浏览器应用、搜索类应用、即时通信工具、邮箱客户端、社交平台软件等。

终端设备201、202、203可以是具有显示屏并且支持网页浏览的各种电子设备，包括但不限于智能手机、平板电脑、膝上型便携计算机和台式计算机等等。

服务器205可以是提供各种服务的服务器，例如对用户利用终端设备201、202、203所浏览的购物类网站提供支持的后台管理服务器。后台管理服务器可以对接收到的产品信息查询请求等数据进行分析等处理，并将处理结果(例如目标推送信息、产品信息)反馈给终端设备。

需要说明的是，本发明实施例所提供的表单验证的方法一般由服务器205执行，相应地，表单验证的装置一般设置于服务器205中。

应该理解，图2中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。

图3根据本发明实施例的表单验证的方法的主要步骤的示意图。

如图3所示，本发明实施例的一种通信的方法主要包括如下步骤：

步骤S301：将主表单根据类型划分为多个子表单。

表单在网页中主要负责数据采集功能，通常一个表单包括表单标签、表单域及表单按钮三个基本组成部分，其中，表单域包括文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等；表单按钮包括提交按钮、复位按钮和一般按钮，表单按钮用于将数据传送到服务器上或者取消输入，还可以用于控制其他定义了处理脚本的处理工作。

表单验证是在表单数据被送往服务器前对表单中的这些输入数据进行验证，被验证的表单数据包括：用户是否已填写表单中的必填项目、用户输入的邮件地址是否合法、用户是否已输入合法的日期或用户是否在数据域(numeric field)中输入了文本等等。

通常，一个表单下还可以包括多个表单，即多个子表单组成主表单，本发明实施例根据表单的类型将主表单划分为多个子表单，每个子表单对应于一种类型。

主表单由多个子表单组成，主表单的数据参数也包括了子表单的数据参数，在本发明实施例中，获取主表单的数据参数，将数据参数发送至子表单。在后台获取到主表单的数据结构，将数据结构封装为数据参数，并发送至子表单。

在本发明实施例中，数据参数包括输入框的类型和对应的校验规则，根据数据参数为输入框配置校验规则并进行初始化。数据参数包括输入框的类型以及该输入框的类型所对应的校验规则，校验规则用于判断输入框的内容是否符合要求，每个输入框对应有固定的校验规则，在将输入框的类型以及该输入框的类型所对应的校验规则发送至子表单后，为子表单下的输入框配置校验规则，并将输入框设置为默认值或默认状态。

步骤S302：当调用子表单时，对子表单进行验证，验证结果通过回调函数传送。

当需要调用不同类型的子表单时，需要验证子表单是否符合要求，即判断子表单下输入框的内容是否符合要求，得到的验证结果通过回调函数传送，可以将回调函数传送至主表单。

在本发明实施例中，对子表单进行验证包括：为子表单绑定验证方法，验证方法对应于子表单的类型；执行验证方法。子表单下的输入框有对应校验规则，同样的，子表单也有对应的验证方法，且验证方法与子表单的类型相对应，相同类型的子表单可以使用同一种验证方法，执行对应的验证方法对子表单进行验证。

验证方法是由多个校验规则组成的，相应地，验证结果也是由检验结果组成的。在本发明实施例中，执行验证方法包括：根据校验规则对输入框进行校验得到校验结果，并对校验结果进行分析以得到验证结果。执行验证方法是对子表单下的各个输入框的内容进行检验，得出各个输入框的内容是否符合要求的校验结果，根据校验结果分析哪些输入框的内容符合要求以及哪些输入框的内容不符合要求，从而得出验证结果。

根据本发明实施例的表单验证的方法可以看出，因为采用将主表单按类型划分为多个子表单，当调用子表单时，对子表单进行验证，验证结果通过回调函数传送的技术手段，所以克服了只能实现一个表单的校验，且子表单与主表单不能跨组件通信，无法实现跨组件的表单校验的技术问题，提高了表单验证的可用性和灵活性；同时，将表单进行组件化划分，实现了不同类型表单的组件化，而且支持一个页面引入多个表单，完成每个表单的校验，提高了代码的可扩展性，减少了代码耦合度。

图4是根据本发明实施例的表单验证的方法的实现流程示意图。

如图4所示，本发明实施例的表单验证的方法的实现流程具体包括以下步骤：

步骤S401：获取主表单的数据结构。

验证组件获取主表单的数据结构，即输入框的类型和输入框的类型所对应的校验类型，并封装为数据参数。

步骤S402：将主表单根据类型划分为多个子表单。

本步骤中，验证组件可以根据类型将主表单划分为多个子表单，以达到组件化的效果，减少代码的耦合度，然后将数据参数发送至子表单，根据数据参数为子表单下的输入框与校验规则绑定，并进行表单初始化。

步骤S403：调用子表单。

在使用的过程中根据实际需要调用子表单时，验证组件为每个子表单提供一个验证方法，且验证方法支持接收一个调用方传递的回调函数，以实现校验结果的回传。此外，验证方法的名称可以采用“validate_表单类型”的形式，例如，validate_1表示表单类型1对应的验证方法。

步骤S404：为子表单配置验证方法。

在主表单调用不同类型的子表单时，验证组件为每个子表单标注一个别名，即在标签上面写一个关键字(ref)＝ref数字，例如ref1方便后面调用对应子表单的校验方法。在主表单提交之前，验证组件通过组件别名调用验证方法来校验引入的子表单是否验证通过，每个调用返回一个正确(true)或者错误(false)的标识，其中，验证方法由与输入框类型对应的校验规则组成；调用函数为“this.$refs.ref数字.validate_表单类型(this.cb表单类型)”，需要注意的是，调用函数中的this表示主表单，$refs.ref数字表示所调用的子表单的别名，validate_表单类型表示所调用的验证方法，(this.cb表单类型)表示回调方法。

步骤S405：分析验证结果。

如果所有验证都返回true，则代表整个主表单校验通过，继续执行步骤S407；否则任意一个返回false代表不通过，执行步骤S406。因为调用了子表单的验证方法，触发了子组件内的校验。

步骤S406：提示校验错误信息。

步骤S407：提交表单。

图5是根据本发明实施例的表单验证的方法的应用示意图。

为使本领域技术人员更好地理解本发明实施例的表单验证的方法，现结合图5具体介绍本发明实施例的表单验证的方法。如图5所示，为用户购买机票时填写个人信息的表单页，验证组件根据验证方法对表单页进行验证，其中，表单页即主表单，是由于用户选择购买机票时需要填写个人信息，因此选择调用该表单页。具体的验证过程如下：

首先，验证组件将表单页根据类型划分为包含乘客表单和联系人表单两个子表单。

其次，验证组件根据表单页的数据结构为子表单下的输入框绑定与输入框类型对应的校验规则，并将子表单初始化，即将子表单中的输入框设置为默认值或默认状态，例如，乘客表单中证件类型默认选择“身份证”。

然后，当用户点击“下一步”按钮时，验证组件根据各输入框的校验规则对子表单进行校验，子表单的校验结果通过回调函数返回至表单页。

最后，验证组件分析各个子表单返回的校验结果，只有在所有子表单校验通过的情况下才能够进入下一步页面；否则弹出提示错误的信息，例如用户没有填写登机证件号码，则在输入框下方提示“请填写登机证件上的证件号码”。

图6是根据本发明实施例的表单验证的装置的主要模块的示意图；

本发明实施例的表单验证的装置600主要包括：划分模块601和验证模块602。

其中：

划分模块601，用于将主表单根据类型划分为多个子表单；

验证模块602，用于当调用所述子表单时，对所述子表单进行验证，验证结果通过回调函数传送。

本发明实施例中，所述装置还包括：获取模块，用于获取所述主表单的数据参数，将所述数据参数发送至所述子表单。

本发明实施例中，所述数据参数包括输入框的类型和对应的校验规则，根据所述数据参数为所述输入框配置所述校验规则并进行初始化。

此外，所述验证模块602还用于：为所述子表单绑定验证方法，所述验证方法对应于所述子表单的类型；执行所述验证方法。

此外，所述验证模块602进一步用于：根据所述校验规则对所述输入框进行校验得到校验结果，并对所述校验结果进行分析以得到所述验证结果。

根据本发明实施例的表单验证的装置可以看出，因为采用将主表单按类型划分为多个子表单，当调用子表单时，对子表单进行验证，验证结果通过回调函数传送的技术手段，所以克服了只能实现一个表单的校验，且子表单与主表单不能跨组件通信，无法实现跨组件的表单校验的技术问题，提高了表单验证的可用性和灵活性；同时，将表单进行组件化划分，实现了不同类型表单的组件化，而且支持一个页面引入多个表单，完成每个表单的校验，提高了代码的可扩展性，减少了代码耦合度。

下面参考图7，其示出了适于用来实现本发明实施例的终端设备的计算机系统700的结构示意图。图7示出的终端设备仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。

如图7所示，计算机系统700包括中央处理单元(CPU)701，其可以根据存储在只读存储器(ROM)702中的程序或者从存储部分708加载到随机访问存储器(RAM)703中的程序而执行各种适当的动作和处理。在RAM 703中，还存储有系统700操作所需的各种程序和数据。CPU 701、ROM 702以及RAM 703通过总线704彼此相连。输入/输出(I/O)接口705也连接至总线704。

以下部件连接至I/O接口705：包括键盘、鼠标等的输入部分706；包括诸如阴极射线管(CRT)、液晶显示器(LCD)等以及扬声器等的输出部分707；包括硬盘等的存储部分708；以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分709。通信部分709经由诸如因特网的网络执行通信处理。驱动器710也根据需要连接至I/O接口705。可拆卸介质711，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器710上，以便于从其上读出的计算机程序根据需要被安装入存储部分708。

特别地，根据本发明的实施例，上文主要步骤图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行主要步骤图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分709从网络上被下载和安装，和/或从可拆卸介质711被安装。在该计算机程序被中央处理单元(CPU)701执行时，执行本发明的系统中限定的上述功能。

需要说明的是，本发明所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本发明中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本发明中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、电线、光缆、RF等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本发明各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

描述于本发明实施例中所涉及到的模块可以通过软件的方式实现，也可以通过硬件的方式来实现。所描述的模块也可以设置在处理器中，例如，可以描述为：一种处理器包括划分模块和验证模块。其中，这些模块的名称在某种情况下并不构成对该模块本身的限定，例如，划分模块还可以被描述为“根据类型将主表单划分为多个子表单的模块”。

作为另一方面，本发明还提供了一种计算机可读介质，该计算机可读介质可以是上述实施例中描述的设备中所包含的；也可以是单独存在，而未装配入该设备中。上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被一个该设备执行时，使得该设备包括：步骤S301：将主表单根据类型划分为多个子表单。步骤S302：当调用子表单时，对子表单进行验证，验证结果通过回调函数传送。

根据本发明实施例的技术方案，因为采用将主表单按类型划分为多个子表单，当调用子表单时，对子表单进行验证，验证结果通过回调函数传送的技术手段，所以克服了只能实现一个表单的校验，且子表单与主表单不能跨组件通信，无法实现跨组件的表单校验的技术问题，提高了表单验证的可用性和灵活性；同时，将表单进行组件化划分，实现了不同类型表单的组件化，而且支持一个页面引入多个表单，完成每个表单的校验，提高了代码的可扩展性，减少了代码耦合度。

上述具体实施方式，并不构成对本发明保护范围的限制。本领域技术人员应该明白的是，取决于设计要求和其他因素，可以发生各种各样的修改、组合、子组合和替代。任何在本发明的精神和原则之内所作的修改、等同替换和改进等，均应包含在本发明保护范围之内。

Claims (12)

1.一种表单验证的方法，其特征在于，包括：

将主表单根据类型划分为多个子表单；

当调用所述子表单时，对所述子表单进行验证，验证结果通过回调函数传送。

2.根据权利要求1所述的方法，其特征在于，所述方法还包括：

获取所述主表单的数据参数，将所述数据参数发送至所述子表单。

3.根据权利要求2所述的方法，其特征在于，

所述数据参数包括输入框的类型和对应的校验规则，根据所述数据参数为所述输入框配置所述校验规则并进行初始化。

4.根据权利要求3所述的方法，其特征在于，对所述子表单进行验证包括：

为所述子表单绑定验证方法，所述验证方法对应于所述子表单的类型；

执行所述验证方法。

5.根据权利要求4所述的方法，其特征在于，执行所述验证方法包括：

根据所述校验规则对所述输入框进行校验得到校验结果，并对所述校验结果进行分析以得到所述验证结果。

6.一种表单验证的装置，其特征在于，包括：

划分模块，用于将主表单根据类型划分为多个子表单；

验证模块，用于当调用所述子表单时，对所述子表单进行验证，验证结果通过回调函数传送。

7.根据权利要求6所述的装置，其特征在于，所述装置还包括：

获取模块，用于获取所述主表单的数据参数，将所述数据参数发送至所述子表单。

8.根据权利要求7所述的装置，其特征在于，

所述数据参数包括输入框的类型和对应的校验规则，根据所述数据参数为所述输入框配置所述校验规则并进行初始化。

9.根据权利要求8所述的装置，其特征在于，所述验证模块还用于：

为所述子表单绑定验证方法，所述验证方法对应于所述子表单的类型；

执行所述验证方法。

10.根据权利要求9所述的装置，其特征在于，所述验证模块进一步用于：

根据所述校验规则对所述输入框进行校验得到校验结果，并对所述校验结果进行分析以得到所述验证结果。

11.一种表单验证的电子设备，其特征在于，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-5中任一所述的方法。

12.一种计算机可读介质，其上存储有计算机程序，其特征在于，所述程序被处理器执行时实现如权利要求1-5中任一所述的方法。