如何在jQuery Validate规则中使用ID代替名称



我正在尝试为文件上传设置验证。我已经在形式的其他输入中使用jQuery验证(在此不显示简单性(,所以我想继续使用此方法来保持一致性。

我正在努力使其工作起作用,因为文件输入中的名称字段具有用于上传多个附件的数组的括号。因此,我遇到了两个问题之一:

  1. 我在jQuery规则uploadedFile[]中放置了实际名称,然后我遇到了一个错误。

  2. 我取下括号并只有uploadedFile,但是此字段未识别,并且验证不起作用。

对我来说最合乎逻辑的事情是使用ID。我找不到基于我搜索的所有内容的好方法。

是否有一种方法可以使用uploadedFile[]的ID运行此操作,或者有其他更有效的方法吗?

输入

<input type="file" name="uploadedFile[]" class="inputfile" id="uploadedFileTest" data-multiple-caption="{count} files selected" multiple>

JS

$('#shareProjectForm').validate({
    ignore: [],
    rules: {
        uploadedFile: {
            required: true,
            extension: 'png|jpg|jpeg|pdf|gif'
        }
    },
    messages: {
        uploadedFile: {
            required: "A file must be uploaded",
            extension: "You must choose a file with one of the following formats: .png, .jpg, .jpeg, .pdf or .gif"
        }
    },

尝试以下:

$("#uploadedFileTest").change(function(){ $("#uploadedFileTest").blur().focus(); });
$.validator.addMethod(
            "validate_file_type",
            function(val,elem) {
                 var files    =   $('#'+elem.id)[0].files;
                for(var i=0;i<files.length;i++){
                    var fname = files[i].name.toLowerCase();
                    var re = /(.pdf|.jpg|.jpeg)$/i;
                    if(!re.exec(fname))
                    {
                                return false;
                    }
                }
                return true;
            },
            "Please upload pdf or jog or jpeg files"
    );
$('#form').validate({
       rules: {
           "uploadedFile[]": {
                         required: true,
                         validate_file_type: true,
                         
                      }
							},
              messages: {
        "uploadedFile[]": {
            required: "A file must be uploaded",
            
        }
        }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>
<form id="form">
  
   <input type="file" name="uploadedFile[]" class="inputfile" id="uploadedFileTest" data-multiple-caption="{count} files selected" multiple>
 
    <input type="submit" />
</form>

最新更新