layui表单+监听验证+上传

<form class="layui-form" lay-filter="example">

<input class="layui-input" type="text" name="projectname" lay-verify="title" autocomplete="off"/>

<button type="button" class="layui-btn" lay-submit=""  lay-filter="demo1"><i class="layui-icon"></i>上传文件</button>
<input type="hidden" class="layui-btn"  id="test3" ></button>

</form>

 <script type="text/javascript">
  layui.use(['form', 'layedit', 'laydate','upload'], function(){

var form = layui.form
  ,layer = layui.layer
  ,layedit = layui.layedit
  ,laydate = layui.laydate;

  //自定义验证规则
  form.verify({
    title: function(value){
      if(value.length < 5){
        return '标题至少得5个字符啊';
      }
    }  });

    var data=form.val('example'); 
    form.on('submit(demo1)', function(data){
    $('#test3').click();
    return false;
  });

            upload.render({
                 elem: '#test3'
                 ,url: 'upload_file.action'
                 ,accept: 'file'
                 ,field:'upload'
                 ,before: function () {
                    this.data = { "data": JSON.stringify(data) }
                  }
                 ,progress: function(n, elem, res, index){
                       var percent = n + '%' //获取进度百分比
                       element.progress('demo', percent); //可配合 layui 进度条元素使用  
                       console.log(elem); //得到当前触发的元素 DOM 对象。可通过该元素定义的属性值匹配到对应的进度条。
    console.log(res); //得到 progress 响应信息
    console.log(index); //得到当前上传文件的索引，多文件上传时的进度条控制，如：
    element.progress('demo-'+ index, n + '%'); //进度条
  }
  ,done: function(res){
      layer.msg(res.msg);      
      console.log(res);
      setTimeout( function(){
element.progress('demo', 0);
}, 3 * 1000 );
     
    }
});  
 });
  </script>