I want to ask,
so I have a form whose contents one of which is to upload multiple files, then after I browse the file, then the file will appear (preview),
then the user will have access to choose the file to upload when it is not wanted then there is a delete button for wrong one file.
then after all okay, then the form will be uploaded.
then after that the user will be able to edit the file again through another page without deleting the old file.
this is what I want,
user fills in the input form
when in the input file field, the user can select several files
Then after clicking OK, the selected file will be displayed
The user can delete one of the unwanted files
after all okay the user submit the form to db
like the display on wetransfer
can anyone teach me?
Related
So, I am on a 'competitive coding' website which requires me to manually select a file ("choose file") to submit to the online testing grader. I was wondering, since there are a multitude of extensions on chrome that allow me to auto-fill a form option, is there a way to automatically fill the "choose file" button when submitting a code file based on the last file I chose when clicking that same "choose file" button webpage?
Unfortunately JS can't help here. For security reasons, it is not possible to manually add and upload a file in a file input control with JavaScript.
The reason behind this is that webpages would be able to upload files from someone's computer, so long as they knew the path.
What you could do as a last resort would be using a third party software that would register mouse clicks for you and emulate a real user acting on the interface.
You cannot do that since this input type cannot be prefilled, here is a trick though :
What you can do is having an hiden collection of text inputs containing the base64 of the files you load using your form.
When a user selects a file, just use btoa() and atob() methods to base64-it and store it in this hidden form input
If you want to 'preset' some files, just fill your list of base64 and simply display a kind of placeholder to show that you have a file 'already appended'
Then in your script when form is submitted, work with the list of base64 instead of the actual values from the input type file
I have a form where users can upload a file. The uploading and validation afterwards (filesize, filetype...) is done with php by submitting.
But I wonder how I could give the user a "visual feedback" that his file was "picked" immediately. So I don't need validation nor anything complex. I just want to either color the label green or rename the label of the upload field when the user has selected a file and clicked "Choose" in his browser.
How would I do that most easily?
On success assign one variable then use that variable to add class to the element.
I have code that you can input multiple file using input type file multiple, which is a basic html5.
When you click the input file, you browse the file that you want (can be multiple), it will show you the list of files that you have input with remove button for each item, so you can remove it for each item.
Now the problem is I want to enhance it with download button.
Anybody knows how to add download file from input type file function using javascript ?
Thank you so much
I have an <input type="file" multiple /> and using the onchange event I maintain a list of files selected to be uploaded at a later stage. The workflow is like this:
The user selects multiple files to upload
I copy the selected File objects into an array of selected files
Repeat steps 1&2 until the user has finished selecting all of the files that they wish to upload.
Upload all of the files in the selected array
The problem is that they can potentially end up selecting the same file twice e.g.
Select folder1\a.txt, click ok
Select folder1\b.txt, click ok
Select folder1\a.txt, click ok
The File object doesn't give me the full path to the file and URL.createObjectURL doesn't return the same URL, so it seems like I can only try to guess that the same file has been selected by comparing the size, last modified time, mime type and file name.
Is there a more accurate way detect if a user is trying to upload the same file multiple times?
i was just wondering if there is any available code/function in javascipt that can download the html page and send an email link for the downloaded page.
All i am trying to do is to fill a form (with many fields and lots of text) on a page and when an user pushes the submit button : two things should happen
1) save the page with form as filled by the user 2)send a link to the file location. Please advise if approach is correct or let me know if there are other better ways.
thanks in advance