/**
* @version 0.1
* @author: Smily.Liang
* @company: MikeCRM
* @date: 2013-8-29 update
* @copyright: Copyright (c) MikeCRM(http://www.mikecrm.com)
* ---------------------------------------------------------
* 功能:
* 1、input框的验证(required>maxlength>minlgth>email>phone>equalTo>remote>checkboxMax>checkboxEqual>checkboxMin)
**/
(function($) {
$.fn.mikeValidate = function(options){
//初始化数据
var defaults = {
rules: {
//初始化规则
required: false,
maxlength: false,
minlength: false,
email: false,
equalTo: false,
remote: false,
checkboxMax: false,
checkboxEqual: false,
checkboxMin: false
},
messages: {
//初始化错误提示信息
required: "此项为必填项",
maxlength: "太长了,不要输那么多",
minlength: "太短了,多输一点啦",
email: "请输入正确格式的电子邮件",
equalTo: "两次输入不同,请重新输入",
remote: "请修正该字段",
checkboxMax: "多于限制选项数",
checkboxEqual: "不等于限制选项数",
checkboxMin: "少于限制选项数"
},
onkeyup:true,
onfocusout: true,
onsubmit: true,
submitHandler: function() {
}
};
options = jQuery.extend(defaults, options);
// 验证各种组件是否符合标准
var _requiredField = function ( element ){
var count = 0;
if( element.attr("type")=="checkbox" || element.attr("type")=="radio" ){
$("[name='"+element.attr("name")+"']").each(function(){
if($(this).attr("checked")){
count++;
}
});
return !count; // 有值时返回false;
} else if(element.attr("type")=="text" || element.hasClass("textarea")){
var elementValue = element.val().replace(/\s/g,""); // 将空格处理之后进行判断
return !elementValue;
} else if(element.attr("type")=="file"){
var elementFile = element.attr('hasFile');
return !elementFile;
} else if(element.hasClass('starGroup')){
var _val = parseInt(element.attr('starselected'));
if(_val > 0){
return false;
} else {
return true;
}
}
};
//验证的方法——默认顺序:required>maxlength>minlength>email>phone>equalTo>remote>checkboxMax>checkboxEqual>checkboxMin
function validate(element,type){
var errorType = "required",_field;
if (options.rules.required !== true && options.rules.required !== false) {
options.rules.required = options.rules.required();
}
_field = _requiredField( element );
if (options.rules.required) {
if ( _field && type!=='FOCUSOUT' ) {// if (element.val() == "") {
return check.error(errorType,element);
}else{
return maxlength(element);
}
}else{
if (element.val() == "" && (element.attr("type")=="text" || element.hasClass("textarea"))) {
check.valid(element);
} else {
return maxlength(element);
}
}
}
function maxlength(element){
if (options.rules.maxlength) {
errorType = "maxlength";
if ( element.val().length > options.rules.maxlength ) {
return check.error(errorType,element);
}else{
return minlength(element);
}
}else{
return minlength(element);
}
}
function minlength(element){
if (options.rules.minlength) {
errorType = "minlength";
if ( element.val().length < options.rules.minlength ) {
return check.error(errorType,element);
}else{
return email(element);
}
}else{
return email(element);
}
}
function email(element){
if (options.rules.email) {
errorType = "email";
if ( !/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))$/i.test(element.val()) ) {
return check.error(errorType,element);
}else{
return equalTo(element);
}
}else{
return equalTo(element);
}
}
function equalTo(element){
if (options.rules.equalTo) {
errorType = "equalTo";
if ( element.val() != options.rules.equalTo.val() ) {
return check.error(errorType,element);
}else{
return remote(element);
}
}else{
return remote(element);
}
}
function remote(element){
if (options.rules.remote) {
if (element.val()!=="") {
errorType = "remote";
$.ajax({
type: "POST",
dataType: "JSON",
url: options.rules.remote.url,
data: options.rules.remote.data,
success: function(data){
if (data.flag) {
return checkboxMax(element);
// return check.valid(element);
}else{
return check.error(errorType,element);
}
}
});
}
}else{
return checkboxMax(element);
// return check.valid(element);
}
}
function checkboxMax(element){
if (options.rules.checkboxMax) {
errorType = "checkboxMax";
var checkNum = 0;
if( element.attr("type")=="checkbox"){
$("[name='"+element.attr("name")+"']").each(function(){
if($(this).attr("checked")){
checkNum++;
}
});
if ( checkNum > options.rules.checkboxMax) {
return check.error(errorType,element);
}else{
return checkboxEqual(element);
}
}else{
return checkboxEqual(element);
}
}else{
return checkboxEqual(element);
}
}
function checkboxEqual(element){
if (options.rules.checkboxEqual) {
errorType = "checkboxEqual";
var checkNum = 0;
if( element.attr("type")=="checkbox"){
$("[name='"+element.attr("name")+"']").each(function(){
if($(this).attr("checked")){
checkNum++;
}
});
if ( checkNum == options.rules.checkboxEqual ) {
return checkboxMin(element);
}else{
return check.error(errorType,element);
}
}else{
return checkboxMin(element);
}
}else{
return checkboxMin(element);
}
}
function checkboxMin(element){
if (options.rules.checkboxMin) {
errorType = "checkboxMin";
var checkNum = 0;
if( element.attr("type")=="checkbox"){
$("[name='"+element.attr("name")+"']").each(function(){
if($(this).attr("checked")){
checkNum++;
}
});
if ( checkNum < options.rules.checkboxMin) {
return check.error(errorType,element);
}else{
return check.valid(element);
}
}else{
return check.valid(element);
}
}else{
return check.valid(element);
}
}
//验证的结果
var check ={
valid: function(element){
if( element.attr("type")=="checkbox" || element.attr("type")=="radio" ){
element.closest("div").siblings(".title").find("label.error").remove();
} else if(element.attr("type")=="text"|| element.hasClass("textarea") ){
element.removeClass("error");
element.closest("div").siblings(".title").find("label.error").remove();
} else if(element.attr("type")=="file"){
element.parent().removeClass("error");
element.parent().parent().siblings(".title").find("label.error").remove();
} else if(element.hasClass('starGroup')){
element.parent().siblings(".title").find("label.error").remove();
}
return true;
},
error: function(errorType,element){
if( element.attr("type")=="checkbox" || element.attr("type")=="radio" ){
element.closest("div").siblings(".title").find("label.error").remove();
element.nextAll().andSelf().last().closest("div").siblings(".title").append("");
} else if(element.attr("type")=="text"|| element.hasClass("textarea") ){
element.addClass("error");
element.parent().siblings(".title").find("label.error").remove();
element.parent().siblings(".title").append("");
} else if(element.attr("type")=="file"){
element.parent().addClass("error");
element.parent().parent().siblings(".title").find("label.error").remove();
element.parent().parent().siblings(".title").append("");
} else if(element.hasClass('starGroup')){
element.parent().siblings(".title").find("label.error").remove();
element.parent().siblings(".title").append("");
}
// var labelWidth = element.closest(".locked").find(".title").width()+70;
// element.closest(".locked").find("label.error").css("left",labelWidth);
return false;
}
};
return this.each(function(){
// 绑定自定义事件,触发提交验证
$(this).bind("submitValidate", function(e){
validate($(e.target));
});
//input正在输入时验证——默认为true
if (options.onkeyup) {
$(this).keyup(function(){
validate($(this));
});
if( $(this).attr("type")=="checkbox" || $(this).attr("type")=="radio" ){
$(this).change(function(){
validate($(this));
});
}
}
//input失去焦点时进行验证——默认为true
if (options.onfocusout) {
$(this).focusout(function(){
validate($(this),'FOCUSOUT');
});
}
if($(this).hasClass('starGroup')){
$(this).click(function() {
validate($(this));
});
}
//点击class为validate_submit的提交按钮式先进行验证——默认为true
if (options.onsubmit) {
$(this).closest("form").find(".validate_submit").unbind("click");
$(this).closest("form").find(".validate_submit").bind("click",function(){
$(this).closest("form").find("input").each(function(){
$(this).trigger("submitValidate");
});
$(this).closest("form").find("textarea").each(function(){
$(this).trigger("submitValidate");
});
$(this).closest("form").find(".starGroup").each(function(){
$(this).trigger("submitValidate");
});
if ($("label.error").length === 0) {
options.submitHandler();
} else {
return false;
}
//var errorCount = 0;
//这里也可以添加其他验证
//$(this).closest("form").find("input").each(function(){
//if( !validate($(this)) ){
// errorCount++;
// }
//});
//errorCount==0,说明验证通过,提交表单
//if (errorCount == 0) {
// options.submitHandler();
//};
});
}
});
};
})(jQuery);