Comment vérifier si le fichier d'entrée est vide dans jQuery

101

Tout nouveau chez JS.
J'essaie de vérifier si l'élément d'entrée de fichier est vide lors de la soumission du formulaire avec jQuery / JavaScript. J'ai parcouru un tas de solutions et rien ne fonctionne pour moi. J'essaie d'éviter le /c/fakepath(sauf s'il n'y a pas d'autre option)

<input type="file" name="videoFile" id="videoUploadFile" />

Cela ne fonctionne pas:

var vidFile = $("#videoUploadFile").value;

La seule façon d'obtenir le nom de fichier est d'utiliser ce qui suit:

var vidFile = document.getElementById("videoUploadFile").files[0].name;

S'il n'y a pas de fichier disponible, le code génère une erreur:

impossible de lire le nom de propriété non défini

ce qui est logique car le tableau n'est pas défini. mais je ne peux pas comprendre comment faire une gestion d'erreur avec cela.

Comment saisir correctement l'élément d'entrée du fichier videoUploadFile, vérifier s'il est vide, lancer un message d'erreur s'il est vide?

javascript jquery html

— user3753569
source

7

Vérifier .files.length?

— Teemu du

5

Pourquoi quelqu'un voterait-il contre cette question? Je ne comprends pas parfois. Je vous ai voté pour revenir à 0.

— Seano666

vous pouvez également filtrer les fichiers non vides si vous en avez plusieurs sur le formulaire:var files = $('#formbody').find('input[type=file]').filter(function() { return $(this)[0].files.length > 0; });

— Piotr Kowalski

177

Vérifiez simplement la propriété length of files , qui est un objet FileList contenu dans l'élément d'entrée

if( document.getElementById("videoUploadFile").files.length == 0 ){
    console.log("no files selected");
}

— Patrick Evans
source

1

( document.getElementById("videoUploadFile").files.length === 0 )

— Pathros

140

En voici la version jQuery:

if ($('#videoUploadFile').get(0).files.length === 0) {
    console.log("No files selected.");
}

— Salim
source

1

Cette réponse est plus appropriée car l'OP a demandé une solution JQuery.

— Hussain Akbar le

$('#videoUploadFile').get(0)même que $('#videoUploadFile')[0]mais peut get()- être fait quelques vérifications de bon sens

— zanderwar

18

Pour vérifier si le fichier d'entrée est vide ou non en utilisant la propriété de longueur de fichier, indexdoit être spécifié comme suit:

var vidFileLength = $("#videoUploadFile")[0].files.length;
if(vidFileLength === 0){
    alert("No file selected.");
}

— Mamun
source

3

Questions: comment vérifier que le fichier est vide ou non?

Ans: J'ai résolu ce problème en utilisant ce code Jquery

//If your file Is Empty :     
      if (jQuery('#videoUploadFile').val() == '') {
                       $('#message').html("Please Attach File");
                   }else {
                            alert('not work');
                   }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="file" id="videoUploadFile">
<br>
<br>
<div id="message"></div>

Développer l'extrait

— Adnan Limdiwala
source

1

Des explications supplémentaires sur les raisons pour lesquelles cela fonctionnerait ou ce qui n'allait pas dans la question initiale aideraient à améliorer la qualité de cette réponse.

— Josh Burgess

@josh burgess cette réponse était de savoir comment vérifier que le fichier est vide ou non est une autre façon de vérifier votre fichier lorsque vous soumettez le formulaire en utilisant jquery.

— Adnan Limdiwala

@JoshBurgess l'OP demande comment faire cela dans jQuery. Toutes les autres réponses utilisent soit JS vanille, soit une combinaison de JS et jQuery. C'est le seul à utiliser exclusivement jQuery. Peut-être que je suis pointilleux, mais je n'aime pas mélanger jQuery avec vanilla JS à moins que j'aie vraiment à le faire.

— Eduard Luca

@EduardLuca Answer a plus de deux ans. Il a été signalé comme étant de mauvaise qualité à l'époque. Une explication du code est généralement appréciée par la communauté SO, et le commentaire a été conçu comme un rappel utile non seulement pour publier le code, mais aussi pour expliquer ce qu'est le code et pourquoi il fonctionne. J'espère que cela aidera à clarifier les choses.

— Josh Burgess

3

Je sais que je suis en retard à la fête mais j'ai pensé ajouter ce que j'ai fini par utiliser pour cela - qui consiste simplement à vérifier si l'entrée de téléchargement de fichier ne contient pas une valeur de vérité avec l'opérateur not & JQuery comme ceci:

if (!$('#videoUploadFile').val()) {
  alert('Please Upload File');
}

Notez que s'il s'agit d'un formulaire, vous souhaiterez peut-être également l'encapsuler avec le gestionnaire suivant pour empêcher l'envoi du formulaire:

$(document).on("click", ":submit", function (e) {

  if (!$('#videoUploadFile').val()) {
  e.preventDefault();
  alert('Please Upload File');
  }

}

— Joël Youngberg
source