一种适用于云平台的改进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对象或者数组对象。
通过上面具体实施方式,所述技术领域的技术人员可容易的实现本发明。但是应当理解,本发明并不限于上述的一种具体实施方式。在公开的实施方式的基础上,所述技术领域的技术人员可任意组合不同的技术特征,从而实现不同的技术方案。
除说明书所述的技术特征外,均为本专业技术人员的已知技术。