[英]jQuery Validation plugin check that at least one image was uploaded
I have a form like this that allows users to upload images. 我有一个这样的表格,允许用户上传图像。 Each image a user uploads is displayed in a
div
called imgHolder
that's outside the form, and a file[]
input from the upload form is removed (a user can only upload 5 files). 用户上传的每个图像都显示在表单外部的
imgHolder
div
,并且删除了从上传表单输入的file[]
(用户只能上传5个文件)。
Problem i'm stuck with is, how can I use the the jquery validation plugin to check the imgHolder
div
to see if at least one image were uploaded? 我
imgHolder
问题是,如何使用jquery验证插件检查imgHolder
div
以查看是否至少上传了一张图像? I don't need to check the file fields themselves. 我不需要自己检查文件字段。 That I do in another way.
我用另一种方式做。
<div class="imgHolder">
<div><img src="demo-1.jpg"><i class="icon-remove"></i></div>
</div>
Form 形成
<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>
The way I use the plugin is simple. 我使用插件的方法很简单。
$("#images").validate({
rules: {
albumTitle: {
required: true,
minlength: 10,
maxlength: 25
},
messages: {
itemTitle: {
required: "Please enter a valid title",
minlength: "Minimum title length required is 10 characters",
maxlength: "Maximum title length allowed is 25 characters"
},
But is there a way to get the plugin to check a div that's out side the form? 但是有没有办法让插件检查表格之外的div?
Based on the code you posted (or lack thereof), it's impossible for the jQuery Validate plugin to have been working at all. 根据您发布的代码(或缺少代码),jQuery Validate插件根本无法正常工作。
1) You cannot have multiple elements with the same name
attribute. 1)您不能有多个具有相同
name
属性的元素。 The name
must be unique as this is how the plugin was designed to keep track of inputs. name
必须唯一,因为这是插件设计用来跟踪输入的方式。 Something like this will work... 这样的事情会起作用...
<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) If you want at least one of these four input elements to be mandatory, you could use the require_from_group
method which does exactly that. 2)如果您希望这四个输入元素中的至少一个是强制性的,则可以使用
require_from_group
方法来实现。 However, since all four input elements are identical to each other, simply make the very first one required
. 然而,由于所有四个输入元件是彼此相同的,只需使最前面的一个
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) You either intentionally made messages
a child of rules
or you forgot some closing braces. 3)您或者故意使
messages
成为rules
的孩子,或者您忘记了一些右括号。 The messages
option is a sibling of the rules
option, not a child... 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) I don't see any elements named albumTitle
or itemTitle
within your HTML markup as you posted it. 4)发布标记时,在HTML标记中没有看到任何名为
albumTitle
或itemTitle
元素。 You cannot validate any input element that does not exist within the form
container. 您无法验证
form
容器中不存在的任何输入元素。
5) You are attaching .validate()
to #images
... 5)您将
#images
.validate()
附加到#images
...
$("#images").validate({...
However, there is no id
in your markup called images
. 但是,您的标记中没有名为
images
id
。 The selector needs to match your form
... 选择器需要匹配您的
form
...
<form id="images" action="/us/imgpcr.php" method="post" ....
Quote OP: 报价OP:
"But is there a way to get the plugin to check a div that's out side the form?"
“但是有没有办法让插件检查表格外的div?”
You absolutely cannot validate a div
under any circumstances. 您绝对不能在任何情况下验证
div
。 Nor can you validate any input element that is not contained within the form
you've attached to .validate()
. 您也无法验证
.validate()
附加的form
未包含的任何输入元素。
The plugin can only validate <input>
, <textarea>
and <select>
elements within a <form></form>
container. 该插件只能验证
<input>
<form></form>
容器内的<input>
, <textarea>
和<select>
元素。 There are no workarounds. 没有解决方法。
I don't understand the need for this request. 我不了解此请求的必要性。 Since you want to make sure a file is uploaded, simply make the
input type="file"
field required. 由于您要确保文件已上传,因此只需将
input type="file"
字段设为必填字段即可。
Otherwise, this plugin has no way to tell if a file has already been uploaded, it can only make the type="file"
field mandatory. 否则,此插件无法判断文件是否已经上传,只能使
type="file"
字段为必填字段。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.