JQuery validation des entrées de type de fichier
J'ai un formulaire qui peut avoir 0-des centaines de <input type="file">
éléments. J'ai nommé l'une après l'autre, en fonction de combien sont dynamiquement ajoutés à la page.
Par exemple:
<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">
Dans mon JQuery je veux valider les entrées sur acceptables MIME/type de fichier. Comme ceci:
$("#formNew").validate({
rules: {
fileupload: {
required: true,
accept: "image/jpeg, image/pjpeg"
}
}
Tout de suite mon problème est que le name
attribut du fichier d'entrée des éléments est dynamique. Elle doit être dynamique, de sorte que mon application web peut traiter charger correctement. Alors, évidemment, à l'aide de "fileupload" n'est pas d'aller travailler dans les règles de la section.
Comment puis-je configurer les règles pour toutes les entrées qui ont un nom comme "fileupload"?
C'est le code qui ajoute dynamiquement des entrées:
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;
});
OriginalL'auteur volume one | 2014-01-05
Vous devez vous connecter pour publier un commentaire.
L'un des éléments sont ajoutés, utiliser les règles de la méthode pour ajouter les règles
Démo: Violon
Mise à jour
pouvez-vous partager le code, qui est l'ajout de l'élément
Arun, c'est une condition connue. Vous devriez peut-être poster un rapport de bug pour le jQuery Valider développeur sur GitHub... les méthodes pour ce plugin a toujours exigé de confinement à l'intérieur d'un
.each()
lors du ciblage plus d'un: jsfiddle.net/8dAU8/3 ~ pendant ce temps, vous devez corriger ou de supprimer la première moitié de votre réponse.selon la documentation pour
.rules('add')
méthode: ", Ajoute aux règles établies et retourne toutes les règles pour la premier appariés." ~ voir Aussi GitHub thread.voir ma réponse.
OriginalL'auteur Arun P Johny
Simplement utiliser le
.règles('ajouter')
méthode immédiatement après la création de l'élément...Vous aurez toujours besoin d'utiliser
.validate()
pour initialiser le plugin dans un DOM prêt gestionnaire.Vous aurez toujours besoin de déclarer des règles pour les éléments statiques à l'aide de
.validate()
. Quelle que soit la saisie d'éléments qui font partie de la forme lorsque le chargement de la page... déclarer leurs règles à l'intérieur de.validate()
.Vous n'avez pas besoin d'utiliser
.each()
, quand vous êtes seulement en ciblant UN élément avec le sélecteur jQuery attaché à.rules()
.Vous n'avez pas besoin de la
required
attribut sur votre élément d'entrée lorsque vous êtes en déclarant larequired
règle à l'aide de.validate()
ou.rules('add')
. Quelle que soit la raison, si vous voulez toujours l'attribut HTML5, à moins d'utiliser un format approprié commerequired="required"
.De travail de DÉMONSTRATION: http://jsfiddle.net/8dAU8/5/
j'ai mis à jour jsfiddle de sorte que vous pouvez voir la question jsfiddle.net/8dAU8/4 Essayez d'ajouter un enregistrement txt ou fichier zip et qu'il n'affiche pas d'erreur.
mon erreur. Vous ne pouvez pas incrémenter le compteur jusqu'à ce que, après la règle est déclarée. Prendre note que j'ai supprimé un tas de code superflu.... voir: jsfiddle.net/8dAU8/5
stackoverflow.com/users/594235/sparky - Donc, je remarque que la validation n'a pas mis à jour lors de tout changement de l'ajout d'un fichier... Il met à jour si l'entrée est à nouveau activé ou si le bouton "soumettre" est cliqué. Est-il un moyen de mettre à jour le message de validation sur le changement pour ne pas être dans un état d'erreur?
vous le feriez manuellement à l'appel de la
.valid()
méthode lorsque vous avez besoin de déclencher un nouveau test de validation.OriginalL'auteur Sparky
Donc, j'ai eu le même problème et malheureusement juste en ajoutant à la règles n'ont pas de travail. J'ai découvert que d'accepter, et de l'extension: ne font pas partie de JQuery validate.js par défaut, et il exige un additional-Methods.js plugin pour le faire fonctionner.
Donc, pour quelqu'un d'autre qui l'ont suivi ce fil et il ne fonctionne toujours pas, vous pouvez essayer d'ajouter additional-Methods.js à votre tag en plus de la réponse ci-dessus, et cela devrait fonctionner.
OriginalL'auteur Dedan