2

I have seen numerous posts on this stating that for security reasons you cannot do so. For example, see this Stackoverflow post and this one too. I do not want to reset the input file field. I merely want to delete some files from the selected ones. The deletion in the UI occurs out of the form field. For example, on change event, I refresh a div with the info on the selected fields. The user can change the content of this div by deleting certain entries. How do I then reflect it in the display in the input field itself where is says "3 files" or "2 files" or whatever depending on the number of files selected?

I tried this:

 $('#fileField')[0].files

Where fileField is the id of a input field of type file. Let us say that the user has selected 3 files. I tried to simply delete one of them through, for example:

   delete $('#fileField')[0].files[1]

I would expect that there will be two files now for that field. Does not work.

A bit more details on what I am doing...

I am using formdata object as in new FormData() and then appending files from the form input fields, as in:

 var fd = new FormData(), fileData;
 $('#' + myForm + ' input[type="file"]').each(function(index) {
    fileData = $(this)[0].files;
    if ($(this).attr('multiple')) {
       for (var i = 0; i<fileData.length; ++i)
         fd.append($(this).attr('name')+"__"+i, fileData[i]);
       }
    ...

I can allow the user to manipulate the entries in the auxiliary div and skip any file to be sent to the server by not appending the ones deleted. Problem is that I need to have the "2 files" or "3 files" or whatever that is displayed in the input field, after selection of multiple files, also be changed to accurately reflect the entries deleted in the div. How do I do this? I know many plugins do this. Using one is not an option.

Community
  • 1
  • 1
Sunny
  • 9,245
  • 10
  • 49
  • 79

0 Answers0