JQuery-Validate-input-Datei-Typ
Habe ich ein Formular haben kann, dass die 0-Hunderte von <input type="file">
Elemente. Ich nannte Sie Sie der Reihe nach, je nachdem, wie viele werden dynamisch auf der Seite Hinzugefügt.
Beispiel:
<input type="file" required="" name="fileupload1" id="fileupload1">
<input type="file" required="" name="fileupload2" id="fileupload2">
<input type="file" required="" name="fileupload3" id="fileupload3">
<input type="file" required="" name="fileupload999" id="fileupload999">
In meinem JQuery möchte ich überprüfen Sie diese Eingaben auf akzeptable MIME/Dateitypen. Wie diese:
$("#formNew").validate({
rules: {
fileupload: {
required: true,
accept: "image/jpeg, image/pjpeg"
}
}
Sofort mein problem ist, dass die name
- Attribut des input-Datei Elemente ist dynamisch. Es hat dynamisch zu sein, so dass meine web-Anwendung kann sich mit jedem laden korrekt. Also offensichtlich mit "fileupload" ist nicht zum arbeiten in die Spielregeln.
Wie ich die Regeln, die für alle Eingaben, die einen Namen haben wie "fileupload"?
Dies ist der code, der dynamisch fügt der Eingänge:
var filenumber = 1;
$("#AddFile").click(function () { //User clicks button #AddFile
$('<li><input type="file" name="FileUpload' + filenumber + '" id="FileUpload' + filenumber + '" required=""/> <a href="#" class="RemoveFileUpload">Remove</a></li>').prependTo("#FileUploader");
filenumber++;
return false;
});
$("#FileUploader").on('click', '.RemoveFileUpload', function () { //Remove input
if (filenumber > 0) {
$(this).parent('li').remove();
filenumber--;
}
return false;
});
Du musst angemeldet sein, um einen Kommentar abzugeben.
Eines der Elemente Hinzugefügt werden, verwenden Sie die Regeln Methode zum hinzufügen von Regeln
Demo: Fiddle
Update
each()
anwenden ein jQuery-validate-Methode wierules()
. Ihre fiddle funktioniert nur, weil die Elemente haben auch dierequired
Attribut. Siehe: jsfiddle.net/8dAU8/2.each()
wenn Sie auf mehr als ein: jsfiddle.net/8dAU8/3 ~ in der Zwischenzeit sollten Sie korrigieren oder löschen die erste Hälfte Ihrer Antwort..rules('add')
- Methode: "Fügt die angegebenen Regeln und gibt alle Regeln für das erste abgestimmt - element." ~ siehe Auch diese GitHub-thread..rules('add')
innerhalb Ihrclick
handler unmittelbar nach dem erstellen des Elements. Das ist im wesentlichen die ganze Antwort.required=""
Attribut innerhalb Ihresinput
element, wenn Sie deklarieren, dierequired
Regel an anderer Stelle. Andernfalls, wenn Sie glaubst müssen Sie das HTML5-Attribut, dann zumindest verwenden Sie es richtig:required="required"
.prop(required, true)
es fügt es alsrequired=""
nicht alsrequired="required"
. Füge ich die.each(function () { $(this).rules('add'...
bit-sofort nach dem erstellen der element? Oder nur$('#FileUpload' + filenumber).rules('add'...
required="required"
ist am besten, aber warum müssen Sie es überhaupt? Sie sind bereits mit der Deklaration derrequired
Regel an anderer Stelle. Wenn Sie nur anbringen.rules()
zu einem element, dann würden Sie nicht brauchen, die.each()
, und verwenden Sierules()
jederzeit, nachdem das element erstellt wurde.Verwenden Sie einfach die
.Regeln('add')
Methode unmittelbar nach dem erstellen der element...Werden Sie noch brauchen, um zu verwenden
.validate()
zum initialisieren des plugin innerhalb eines DOM-ready-handler.Werden Sie noch brauchen, um zu erklären, Regeln für die statische Elemente mit
.validate()
. Was auch immer input-Elemente, die Teil der form, wenn die Seite geladen wird... erklären Ihre Regeln innerhalb.validate()
.Brauchen Sie nicht zu verwenden
.each()
, wenn man nur auf EIN element mit dem jQuery-Selektor angehängt.rules()
.Brauchen Sie nicht die
required
- Attribut auf Ihre input-element, wenn Sie deklarieren, dierequired
Regel mit.validate()
oder.rules('add')
. Aus irgendeinem Grund, wenn Sie noch wollen, dass das HTML5-Attribut, das mindestens ein geeignetes format wierequired="required"
.Arbeiten DEMO: http://jsfiddle.net/8dAU8/5/
.valid()
Methode, wenn Sie brauchen, um die trigger eine neue überprüfung.So, ich hatte das gleiche Problem und leider nur das hinzufügen, um die Regeln hat nicht funktioniert. Ich fand heraus, dass zu akzeptieren: und-Erweiterung: sind nicht Bestandteil von JQuery validate.js standardmäßig, und es erfordert eine additional-Methods.js plugin zum funktionieren zu bringen.
Also für alle anderen, die folgten diesem thread und es immer noch nicht funktioniert, können Sie versuchen, das hinzufügen additional-Methods.js zu Ihrem tag zusätzlich zu der Antwort oben, und es sollte funktionieren.