Question

我有一个这样的表单，允许用户上传图像。用户上传的每个图片都显示在表单外的名为div的{{1}}中，并且上传表单中的imgHolder输入已被删除（用户只能上传5个文件）。< / p>

我遇到的问题是，如何使用jquery验证插件检查file[] imgHolder以查看是否上传了至少一张图片？我不需要自己检查文件字段。我以另一种方式做。

div

表格

<div class="imgHolder">
    <div><img src="demo-1.jpg"><i class="icon-remove"></i></div>
</div>

我使用插件的方式很简单。

<form action="/us/imgpcr.php" method="post" enctype="multipart/form-data">
<div><input type="file" name="file[]"></div>
<div><input type="file" name="file[]"></div>
<div><input type="file" name="file[]"></div>
<div><input type="file" name="file[]"></div>
<input type="submit">
</form>

但是有没有办法让插件检查一个表格外的div？

Answer 1

根据您发布的代码（或缺少代码），jQuery Validate插件无法正常工作。

1）您不能拥有具有相同name属性的多个元素。 name 必须是唯一的，因为这是插件设计用于跟踪输入的方式。像这样的东西会起作用......

<input type="file" name="file[1]">
<input type="file" name="file[2]">
<input type="file" name="file[3]">
<input type="file" name="file[4]">

2）如果您希望这四个输入元素中至少有一个是强制性的，那么可以使用require_from_group方法。但是，由于所有四个输入元素彼此相同，只需创建第一个required。

$("#images").validate({
    rules: {
        "file[1]": {  // <- must use quotes on the name because of the brackets
            required: true
        },
        albumTitle: {
            required: true,
            minlength: 10,
            maxlength: 25
        }
    }, ....

3）你有意让messages成为rules的孩子，或者你忘记了一些结束括号。 messages选项是rules选项的兄弟，而不是孩子......

rules: {
    albumTitle: { // <- matches the 'name' attribute of the input
        ....
    }
},  // <- this brace was missing
messages: {
    itemTitle: {  // <- shouldn't this be the same 'name' used within 'rules'?
        ....
    }
},  // <- this brace was missing

4）我发布的HTML标记中没有看到任何名为albumTitle或itemTitle的元素。您无法验证form容器中不存在的任何输入元素。

5）您正在将.validate()附加到#images ...

$("#images").validate({...

但是，标记中没有id名为images。选择器需要与您的form ...

相匹配

<form id="images" action="/us/imgpcr.php" method="post" ....

引用OP：

“但有没有办法让插件检查表格外的div？”

在任何情况下，您都无法验证div。您也无法验证form .validate()中未包含的任何输入元素。

该插件只能验证<input>容器中的<textarea>，<select>和<form></form>元素。没有解决方法。

我不明白是否需要此请求。由于您要确保上传文件，只需填写input type="file"字段即可。

否则，此插件无法判断文件是否已上传，只能强制type="file"字段。

jQuery Validation插件检查至少上传了一个图像

1 个答案: