var validateDemo = $('.form-ajaxSubmit').IUI('validate',{
  strategy:{                      // 自定义策略
      ajaxValid:function(params){
          // this => validate object
          // params => {errMsg:'用户名已被占用，请重新命名',x:1,y:2,z:3}
          // 校验条件不通过必须 return false;
          if(this.self[0].value === '123'){
            return false;
          }
      }
  },
  collections:[
    {
        required: 'username',
        context: '.form-group',
        matches: {
            isNonEmpty: {
                errMsg: '用户名不能为空'
            },
            ajaxValid: {
                errMsg: '用户名已被占用，请重新命名',
                x:1,
                y:2,
                z:3
            }
        }
    },
    {
      required:'email',            // 对应被验证input元素的 data-required="email"
      context:'.form-group',       // 校验结果信息存放位置，一般是input的父元素
      infoMsg:'请输入您的邮箱',      // 输入提示接口
      matches:{                    // 校验规则，可校验多个条件
        isNonEmpty:{               // isNonEmpty 为校验条件，一般称为策略名
          errMsg:'邮箱不能为空。'    // 策略值，作为策略函数的参数，支持扩展自定义
        },
        isEmail:{
          errMsg:'邮箱格式不正确，请检查。'
        }
      }
    },
    {
      required:'password',
      context:'.form-group',
      infoMsg:'请输入您的密码',
      unblur:true,                // 取消 blur 事件
      matches:{
        isNonEmpty:{
          errMsg:'密码不能为空'
        },
        between:{
          errMsg:'密码长度为 6 - 16 位',
          range:[6,16]
        }
      }
    },
    {
      required:'sexy',
      context:'.form-group',
      matches:{
        isChecked:{
          errMsg:'请选择您的性别'
        }
      }
    },
    {
      required:'agree',
      context:'.checkbox',
      matches:{
        isChecked:{
          errMsg:'请同意条款'
        }
      }
    }
  ]
});


$('.form-ajaxSubmit').IUI('ajaxForm',{
  before:function(event,config){
    // this => $form
    // return false can prevent submit
    if (validateDemo.batch() === false) {
      return false;
    }
    mark('trigger before callback,    ajax-data:' + this.serialize());
  },
  success:function(response,config){
    // this => $form
    mark('trigger success callback');
  },
  pending:function(config){
    // this => $form
    mark('trigger pending callback');
  },
  error:function(error,config){
    // this => $form
    mark('trigger error callback');
  },
  always:function(response,config){
    // this => $form
    mark('trigger alway callback');
  }
});

// 侦听事件
$('.form-ajaxSubmit').find('input').each(function(index, el) {
  $(el).on('validate.focus', function(event) {
    event.preventDefault();
    var $this =$(this);
    var name = $this.attr('name');
    mark('[name="'+name+'"] trigger focus event');
  });
  $(el).on('validate.blur', function(event) {
    event.preventDefault();
    var $this =$(this);
    var name = $this.attr('name');
    mark('[name="'+name+'"] trigger blur event');
  });
  $(el).on('validate.change', function(event) {
    event.preventDefault();
    var $this =$(this);
    var name = $this.attr('name');
    mark('[name="'+name+'"] trigger change event');
  });
});