CODEWITHSUNDEEP
javascriptjquery
DolDurma
DolDurma

Reputation: 17321

jQuery checking file type in IF statement not working

in my jQuery script this code:

r.files[i].file

return

File
    lastModified: 1594820307797
    name: "01.jpg"
    size: 116354
    type: "image/jpeg"
    uniqueIdentifier: "116354-01jpg"
    webkitRelativePath: ""
    ...

and when i want to check this file type with this code, alert showing for me:

for (let i = 0; i < r.files.length; i++) {
    if(r.files[i].file.type !== "image/jpeg" || r.files[i].file.type !== "image/png"){
        alert('file is not image');
        notUploaded ++;
    }
}

full code:

$('.resumable-drop').show();
r.assignDrop($('.resumable-drop')[0]);
r.assignBrowse($('.resumable-browse')[0]);
// Handle file add event
r.on('fileAdded', function (file) {
    //console.log(r);
    for (let i = 0; i < r.files.length; i++) {
        if(r.files[i].file.type !== "image/jpeg" || r.files[i].file.type !== "image/png"){
            alert('file is not image');
        }
    }
    if(notUploaded>0){
        alert('please check files again');
    }else{
        notUploaded = 0;
        $('.resumable-progress, .resumable-list').show();
        $('.resumable-progress .progress-resume-link').hide();
        $('.resumable-progress .progress-pause-link').show();
        $('.resumable-file-' + file.uniqueIdentifier + ' .resumable-file-name').html(file.fileName);
        r.upload();
    }
});

Upvotes: 0

Views: 55

Answers (2)

Carsten L&#248;vbo Andersen
Carsten L&#248;vbo Andersen

Reputation: 27041

First you don't need to use '.file'

Second use && and not || because in your case it will always be true.

if (r.files[i].type !== "image/jpeg" && r.files[i].type !== "image/png") {
  alert('file is not image');
}

Demo

$('.run').click(function() {
  var r = $('.file')[0];
  for (let i = 0; i < r.files.length; i++) {
  console.log(r.files[i].type)
    if (r.files[i].type !== "image/jpeg" && r.files[i].type !== "image/png") {
      alert('file is not image');
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input class="file" multiple type="file" />

<button class="run">run</button>

Upvotes: 1

Karan
Karan

Reputation: 12629

You should be using && instead of || inside if condition.

if (r.files[i].file.type !== "image/jpeg" && r.files[i].file.type !== "image/png")

As per your condition with ||, if r.files[i].file.type has value image/jpeg then it will return true for second condition, if it has value image/png then it will return true for first condition else both will be true. So your code will always satisfy if and display alert.

Upvotes: 2

Related Questions