怎么做上传控件的非空校验?

提问 未结 15 346
SANSEC
SANSEC VIP4 2020-3-20
悬赏:20飞吻
<div class="layui-upload-drag" id="div-file" lay-verify="required" style="width: 340px">
<i class="layui-icon"></i>
<p>选择或拖拽到此处</p>
</div>

在此上传时,选择文件后报必填项。
回帖
  • Gosse
    2020-3-21
    选择文件后,报必填项的意义是什么?请描述清楚一些
    0 回复
  • @Gosse 做个文件非空验证
    0 回复
  • Gosse
    2020-3-21
    你的意思是说点击其他按钮,要提示必须上传文件吗?
    0 回复
  • @Gosse 点击提交按钮,提示必须上传文件
    0 回复
  • Gosse
    2020-3-21
    0 回复
  • @Gosse $("#div-file").attr("lay-verify", "required"); 也可以做验证。但是上传失败后,控件下方文件名消失,但是文件还和控件绑定,怎么让失败后显示文件名?
    0 回复
  • @Gosse $("#div-file").attr("lay-verify", "required");这种方式和您发的有什么区别?
    0 回复
  • Gosse
    2020-3-21
    $("#div-file").attr("lay-verify", "required"); 你这个没有控制表单校验啊,需要在input等表单标签中使用,至于你说的失败后,你需要在error里用js处理就行了
    0 回复
  • @Gosse 在error中怎么写js,让失败后控件下方显示文件名
    0 回复
  • Gosse
    2020-3-21
    感觉你描述太不清楚了,我先随便写了一个,看看对你有帮助不
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="layui/css/layui.css"/>
    </head>
    <body>
    <div class="layui-form">
    <div class="layui-row">
    <div class="layui-upload-drag" id="div-file" lay-verify="required" style="width: 340px">
    <i class="layui-icon"></i>
    <p>选择或拖拽到此处</p>
    </div>
    </div>
    <div class="layui-row">
    <div id="showFileName" style="display: none;"></div>
    </div>
    <div class="layui-row">
    <button class="layui-btn layui-btn-primary" id="test9" lay-submit="" lay-filter="sub">提交</button>
    </div>


    </div>

    <script src="layui/layui.js"></script>
    <script>
    layui.use(['form', 'upload'], function(){
    let $ = layui.jquery;
    let form = layui.form;
    let upload = layui.upload;
    upload.render({
    elem: '#div-file'
    ,url: '/test' //改成您自己的上传接口
    ,accept: 'file'
    ,auto: false
    ,bindAction: '#test9'
    ,choose: function(obj) {
    obj.preview(function(index, file, result){
    $('#showFileName').text("文件名:" + file.name)
    });
    }
    ,done: function(res){
    // 省略
    },
    error: function(index, upload) {
    $('#showFileName').show()
    }
    });
    $('#div-file').next('input[name="file"]').attr("lay-verify", "required");
    $('#div-file').removeAttr("lay-verify");
    });
    </script>
    </body>
    </html>
    0 回复