0

Here, I have input file which accept multiple files. Now I want to remove index item 2 from input file. Here is my html and js code. Here, I am getting JS Error. Your tricks would be precious.

HTML

<input type="file" multiple id="uploadFile" />
<button type="button" id="removeFile">
  Remove one file
</button>

JAVASCRIPT

  let uploadFile=document.getElementById("uploadFile");
        let removeFile=document.getElementById("removeFile");
        uploadFile.addEventListener("change",function(event){
          console.log(event.currentTarget.files);
        })
        removeFile.addEventListener("click",function(event){
            let uploadFile=document.getElementById("uploadFile");
            let files=uploadFile.files[0];
            uploadFile.files.slice(1,1);
            console.log(uploadFile.files);
        })

1 Answers1

0

The files property of input[type=file] is of the type FileList ,not array so there is no slice method to begin with.

https://developer.mozilla.org/en-US/docs/Web/API/FileList

but nothing prevents you from copying the files into an array first

var files = [].slice.call(uploadFile.files)
console.log(files.slice(1,1))
// or directly
var files = [].slice.call(uploadFile.files,1,1)
files.splice(0,1); // remove the first file, you can also use files.shift()
console.log(files)
mpm
  • 20,148
  • 7
  • 50
  • 55
  • I have tried with your solution but while I print console.log(files). It does not remove from files. Please check on [Codepen](https://codepen.io/hirakumar/pen/qMpGpW). I do not know why . – Hira Kumar Maharjan Sep 10 '18 at 09:08
  • Yes because slice doesn't change the original array but returns a copy, use splice instead, I edited my answer. – mpm Sep 10 '18 at 09:44