CN106339442A - 一种适用于云平台的改进jQuery Validate异步验证方法 - Google Patents

Abstract

本发明公开了一种适用于云平台的改进jQuery Validate异步验证方法，属于云平台前端技术开发领域，本发明要解决的技术问题为如何能够在对云平台的表格和表单校验中，有效减少后台代码量及服务器的压力，采用的技术方案为：该方法包括如下步骤：（1）、引入validate.js文件，同时设置validate.js的引入路径；（2）、增加remote的默认配置项；（3）、对remote进行改进。

Description

一种适用于云平台的改进jQuery Validate异步验证方法

技术领域

本发明涉及云平台前端技术开发领域，具体地说是一种适用于云平台的改进jQuery Validate异步验证方法。

背景技术

近年来随着云计算的发展，云平台也越来越多。云平台的表格以及表单都多于一般的项目。表单在填写时需要进行验证，比如名字是否存在，数据是否超出范围等等。这些校验不是简单通过一些正则规则就能校验，一般需要后台服务器进行校验。但是，由于云平台表格或类表格的展现以及表单都较多，如果对这些每个表单里的异步校验都在服务器写一个处理程序，这样做不仅增加了后台的代码量同时也增加了服务器的压力。

发明内容

本发明的技术任务是提供一种适用于云平台的改进jQuery Validate异步验证方法，来解决如何能够在对云平台的表格和表单校验中，有效减少后台代码量及服务器的压力的问题。

本发明的技术任务是按以下方式实现的，一种适用于云平台的改进jQueryValidate异步验证方法，该方法包括如下步骤：

（1）、引入validate.js文件，同时设置validate.js的引入路径；

（2）、增加remote的默认配置项；

（3）、对remote进行改进，使应用程序更灵活的进行表单输入框的异步验证，同时也有效的减少了代码量。

作为优选，所述步骤（2）中增加remote的默认配置项是在remote原有的四个配置项“url”、“type”、“dataType”和“data”的基础上增加“key”和“fun”这两个配置项，其中，key配置项的默认值为name，fun的默认值为空。

作为优选，所述步骤（3）中remote的改进方法包括如下步骤：

（Ⅰ）、读取remote的配置项及配置值；

（Ⅱ）、发起ajax异步请求；

（Ⅲ）、在ajax请求成功的回调函数里判断配置项fun是否为空：

①、若配置项fun为空，则执行步骤（Ⅳ）；

②、若配置项fun不为空，则跳转至步骤（Ⅷ）；

（Ⅳ）、判断ajax请求的返回值类型：

①、若返回值类型为布尔型的值或者字符串，则执行步骤（Ⅴ）；

②、否则跳转至步骤（Ⅵ）；

（Ⅴ）、如果返回值为true或者“true”，remote返回true，否则返回false，下一步执行步骤（Ⅸ）；

（Ⅵ）、判断后台接口的返回值是否为object类型：

①、若返回值是object类型，则读取remote配置项的“key”值,下一步执行步骤（Ⅶ）；

②、若返回值为空，则取默认值“name”，下一步执行步骤（Ⅶ）；

③、若返回值不是object类型，则返回false，下一步跳转至步骤（Ⅸ）；

（Ⅶ）、遍历返回值，判断每一个对象的[key]属性是否与输入框一致：

①、若相同，则返回false，下一步跳转至步骤（Ⅸ）；

②、若不同，则返回true，下一步跳转至步骤（Ⅸ）；

（Ⅷ）、读取配置项“fun”的值定义为fun，将ajax请求的返回值response传入函数fun，执行fun(response)；remote返回fun(response)的返回值；下一步执行步骤（Ⅸ）；

（Ⅸ）、结束、退出。

其中，remote写的方法用来校验唯一性，如果用户需要一些特殊的校验，比如校验可用的内存，可用的配额等，可以通过remote的配置项“fun”，进行自定义ajax请求成功的回调函数。

其中，AJAX（ajax开发）即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。

AJAX = 异步 JavaScript和XML（标准通用标记语言的子集）。

AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 AJAX）如果需要更新内容，必须重载整个网页页面。

本发明的适用于云平台的改进jQuery Validate异步验证方法具有以下优点：

1、本发明主要针对的是前端技术的开发，改进基于jQuery Validate的异步验证，通过自定义一些配置项及方法改进远程校验的方式，已达到适应性更强以及减少后台的代码量；jQuery Validate 插件为表单提供了强大的验证功能，让客户端表单验证变得更简单，同时提供了大量的定制选项，满足应用程序各种需求，本发明适用于云平台等这种多表格展示及多表单提交的项目，可以提高表单填写效率以及节省代码量；

2、本发明通过增加jQuery Validate异步验证remote的配置项，并改进remote的方法，可以使应用程序更灵活的进行表单输入框的异步验证，同时也有效的减少了后台代码量以及服务器的压力；

3、由于云平台的展现多以表格或类表格的形式，这就导致后台有向前端返回数组对象的接口，在此基础上表单异步校验就可以通过这个已有的接口，而不是再写一个接口；比如在新建时要求“name”的唯一性，可以改进remote原有方法对远程地址输出的数组中每一个对象的“name”属性作比较，没有相同的返回true，否则返回false，并且应用程序可以通过remote的配置项“fun”自定义对于返回值处理的方法，大大减少了后台的代码量，并且将校验放在前端会减轻服务器压力，并且提高验证效率，有效可以防止客户端提交非法数据。

本发明具有设计合理、结构简单、使用方便、一物多用等特点，因而，具有很好的推广使用价值。

附图说明

下面结合附图对本发明进一步说明。

附图1为适用于云平台的改进jQuery Validate异步验证方法的流程框图；

附图2为附图1中remote改进方法的流程框图。

具体实施方式

参照说明书附图和具体实施例对本发明的一种适用于云平台的改进jQueryValidate异步验证方法作以下详细地说明。

实施例：

如附图1和2所示，本发明的适用于云平台的改进jQuery Validate异步验证方法, 该方法包括如下步骤：

（1）、引入validate.js文件，同时设置validate.js的引入路径；

（2）、增加remote的默认配置项；增加remote的默认配置项是在remote原有的四个配置项“url”、“type”、“dataType”和“data”的基础上增加“key”和“fun”这两个配置项，其中，key配置项的默认值为name，fun的默认值为空。

jQuery Validate异步验证remote原有的配置项为：

remote: {

url: "check-email.php",

type: "post",

dataType: "json",

data: {

username: function() {

return $("#username").val();

}

}

}

“url”为后台处理程序，“type”为请求方式，“dataType”为接受数据的格式，“data”为要传递的数据。本发明增加两个remote配置项“key”、“fun”。通过“key”这个配置项，选取异步请求回来的数据中应用程序需要的值，通过“fun”这个配置项，应用程序可以自定义异步请求成功后的回调方法。remote改进后的配置示例如下：

remote: {

url: "check-email.php",

type: "post",

dataType: "json",

key: "name",

fun: "",

data: {

username: function() {

return $("#username").val();

}

}

}

具体配置项的参数值根据项目要求进行配置。

（3）、对remote进行改进，使应用程序更灵活的进行表单输入框的异步验证，同时也有效的减少了代码量。remote的改进方法包括如下步骤：

（Ⅰ）、读取remote的配置项及配置值；

（Ⅱ）、发起ajax异步请求；

（Ⅲ）、在ajax请求成功的回调函数里判断配置项fun是否为空：

①、若配置项fun为空，则执行步骤（Ⅳ）；

②、若配置项fun不为空，则跳转至步骤（Ⅷ）；

（Ⅳ）、判断ajax请求的返回值类型：

①、若返回值类型为布尔型的值或者字符串，则执行步骤（Ⅴ）；

②、否则跳转至步骤（Ⅵ）；

（Ⅴ）、如果返回值为true或者“true”，remote返回true，否则返回false，下一步执行步骤（Ⅸ）；

（Ⅵ）、判断后台接口的返回值是否为object类型：

①、若返回值是object类型，则读取remote配置项的“key”值,下一步执行步骤（Ⅶ）；

②、若返回值为空，则取默认值“name”，下一步执行步骤（Ⅶ）；

③、若返回值不是object类型，则返回false，下一步跳转至步骤（Ⅸ）；

（Ⅶ）、遍历返回值，判断每一个对象的[key]属性是否与输入框一致：

①、若相同，则返回false，下一步跳转至步骤（Ⅸ）；

②、若不同，则返回true，下一步跳转至步骤（Ⅸ）；

（Ⅷ）、读取配置项“fun”的值定义为fun，将ajax请求的返回值response传入函数fun，执行fun(response)；remote返回fun(response)的返回值；下一步执行步骤（Ⅸ）；

（Ⅸ）、结束、退出。remote写的方法用来校验唯一性，如果用户需要一些特殊的校验，比如校验可用的内存，可用的配额等，可以通过remote的配置项“fun”，进行自定义ajax请求成功的回调函数。

remote原有的方法只支持远程地址只能输出 “true” 或 “false”，不能有其他输出，而改进的方法可以支持远程地址输出object对象或者数组对象。

通过上面具体实施方式，所述技术领域的技术人员可容易的实现本发明。但是应当理解，本发明并不限于上述的一种具体实施方式。在公开的实施方式的基础上，所述技术领域的技术人员可任意组合不同的技术特征，从而实现不同的技术方案。

除说明书所述的技术特征外，均为本专业技术人员的已知技术。

Claims (3)

1.一种适用于云平台的改进jQuery Validate异步验证方法，其特征在于该方法包括如下步骤：

（1）、引入validate.js文件，同时设置validate.js的引入路径；

（2）、增加remote的默认配置项；

（3）、对remote进行改进。

2.根据权利要求1所述的适用于云平台的改进jQuery Validate异步验证方法，其特征在于所述步骤（2）中增加remote的默认配置项是在remote原有的四个配置项“url”、“type”、“dataType”和“data”的基础上增加“key”和“fun”这两个配置项，其中，key配置项的默认值为name，fun的默认值为空。

3.根据权利要求1所述的适用于云平台的改进jQuery Validate异步验证方法，其特征在于所述步骤（3）中remote的改进方法包括如下步骤：

（Ⅰ）、读取remote的配置项及配置值；

（Ⅱ）、发起ajax异步请求；

（Ⅲ）、在ajax请求成功的回调函数里判断配置项fun是否为空：

①、若配置项fun为空，则执行步骤（Ⅳ）；

②、若配置项fun不为空，则跳转至步骤（Ⅷ）；

（Ⅳ）、判断ajax请求的返回值类型：

①、若返回值类型为布尔型的值或者字符串，则执行步骤（Ⅴ）；

②、否则跳转至步骤（Ⅵ）；

（Ⅴ）、如果返回值为true或者“true”，remote返回true，否则返回false，下一步执行步骤（Ⅸ）；

（Ⅵ）、判断后台接口的返回值是否为object类型：

①、若返回值是object类型，则读取remote配置项的“key”值,下一步执行步骤（Ⅶ）；

②、若返回值为空，则取默认值“name”，下一步执行步骤（Ⅶ）；

③、若返回值不是object类型，则返回false，下一步跳转至步骤（Ⅸ）；

（Ⅶ）、遍历返回值，判断每一个对象的[key]属性是否与输入框一致：

若相同，则返回false，下一步跳转至步骤（Ⅸ）；

②、若不同，则返回true，下一步跳转至步骤（Ⅸ）；

（Ⅷ）、读取配置项“fun”的值定义为fun，将ajax请求的返回值response传入函数fun，执行fun(response)；remote返回fun(response)的返回值；下一步执行步骤（Ⅸ）；

（Ⅸ）、结束、退出。