How to set a value to a file input in HTML

Question

How can I set the value of this    lt input type  file    gt

User · Answer

You can t   The only way to set the value of a file input is by the user to select a file   This is done for security reasons  Otherwise you would be able to create a JavaScript that automatically uploads a specific file from the client s computer

User · Answer

You cannot  due to security reasons  Imagine   lt form name  quot foo quot  method  quot post quot  enctype  quot multipart form-data quot  gt       lt input type  quot file quot  value  quot c  passwords txt quot  gt   lt  form gt   lt script gt document foo submit    lt  script gt   You don t want the websites you visit to be able to do this  do you

User · Answer

Actually we can do it  we can set the file value default by using webbrowser control in c  using FormToMultipartPostData Library We have to download and include this Library in our project  Webbrowser enables the user to navigate Web pages inside form  Once the web page loaded   the script inside the webBrowser1 DocumentCompleted will be executed  So   private void webBrowser1 DocumentCompleted object sender  WebBrowserDocumentCompletedEventArgs e               FormToMultipartPostData postData                new FormToMultipartPostData webBrowser1  form           postData SetFile  fileField     C  windows win ini            postData Submit            Refer the below link for downloading and complete reference   https   www codeproject com Articles 28917 Setting-a-file-to-upload-inside-the-WebBrowser-com

User · Answer

Define in html    lt input type  hidden  name  image  id  image   gt    In JS   ajax jsonRpc   consulta dni    call     document number   document number        then function  data            if  data error                                      else                   image   val data image                      After    lt input type  hidden  name  image  id  image  value   9j 4AAQSkZJRgABAgAAAQABAAD 2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8U      gt   lt button type  submit  gt Submit lt  button gt

User · Answer

You can t  And it s a security measure  Imagine if someone writes JS that sets file input value to some sensitive data file

User · Answer

As everyone else here has stated  You cannot upload just any file automatically with JavaScript  HOWEVER   If you have access to the information you want to send in your code  i e   not C  passwords txt   then you can upload it as a blob-type  and then treat it as a file  What the server will end up seeing will be indistinguishable from someone actually setting the value of  lt input type  quot file quot    gt    The trick  ultimately  is to begin a new XMLHttpRequest   with the server    function uploadFile  data               define data and connections     var blob   new Blob  JSON stringify data         var url   URL createObjectURL blob       var xhr   new XMLHttpRequest        xhr open  POST    myForm php   true                   define new form     var formData   new FormData        formData append  someUploadIdentifier   blob   someFileName json                        action after uploading happens     xhr onload   function e            console log  quot File uploading completed  quot                           do the uploading     console log  quot File uploading started  quot        xhr send formData             This data text below is local to the JS script  so we are allowed to send it  uploadFile   hello    how are you       So  what could you possibly use this for   I use it for uploading HTML5 canvas elements as jpg s   This saves the user the trouble of having to open a file input element  only to select the local  cached image that they just resized  modified  etc    But it should work for any file type

User · Answer

Not an answer to your question  which others have answered   but if you want to have some edit functionality of an uploaded file field  what you probably want to do is    show the current value of this field by just printing the filename or URL  a clickable link to download it  or if it s an image  just show it  possibly as thumbnail the  lt input gt  tag to upload a new file a checkbox that  when checked  deletes the currently uploaded file  note that there s no way to upload an  empty  file  so you need something like this to clear out the field s value

[javascript] How to set a value to a file input in HTML?

Examples related to javascript

Examples related to html

Examples related to file-upload

Examples related to preset