如何验证用户是否已选择要上传的文件

How to validate if user has selected file to upload?

本文关键字:选择 文件 是否 何验证 验证 用户      更新时间:2023-09-26

我需要使用 JavaScript/jQuery 进行表单验证。我的表单有一个输入字段,用户可以在其中上传文件,还有一个表,其中<td>是输入字段。喜欢这个:

 <input type="file" name="file" class="filestyle" id="fajl" data-icon="false" accept=".pdf,.csv,.xlsx">

而这个:

<table class="table table-bordered table-hover ">
<tbody>
<tr id="prvi_red">
<td><input type="text" name="user1_name" class="form-control" placeholder="12121212" required></td>
<td><input type="text" name="user1_surname" class="form-control" placeholder="Text" required></td>
<td><input type="text" name="user1_email" class="form-control" placeholder="Number" required></td>
</tr>

而且我还有一个按钮可以提交整个表单(上传的文件和手动插入表格)。我尝试使用Parsley.js验证插件来验证这样的表单:

$(document).ready(function(){
    $('#form1').submit(function(){
        if(($('#fajl').val()=='')){
            console.log('ovdje sam');
            var validateForm = $('#prvi_red').parsley().validate();
            if(validateForm){
                //do something
            }
        }
    });
});

而这个:

$(document).ready(function(){
    $('#buton').click(function(){//when submit button is clicked
        if(($('#fajl').val()=='')){
            console.log('ovdje sam');
            var validateForm = $('#prvi_red').parsley().validate();
            if(validateForm){
                //do something
            }
        }
    });
});

如您所见,我试图实现的是,如果未上传文件,则对表输入字段进行验证。但是在这两种情况下,上面的代码都没有发生。我试图放console.log('ovdje sam');只是为了测试脚本是否进入该部分,但这也没有显示在控制台中。任何帮助将非常受欢迎。

最好的方法是在用户指定文件时删除属性required。侦听文件输入上的 input 事件,并相应地更新其他输入。更新它们时,应触发'input'(或调用parsley().validate()),以便删除显示的任何错误消息。