How to add dynamically an input file tag with image javascript or jquery

Question

I want to add input file dynamically with an image from another input either js or jquery

I have two input type fields

<input type="file" name="f1" />


<input type="file" name="f2[]" />

When we upload a multiple files in f2[] I need some specific file in f1 file control

can anyone help me please. Thanks in advance.

If user selects a file from browser from `name=f2[]` input field, I want that file in `name=f1` input field by using javascript/jquery. — user3797279, Aug 06 '14 at 09:03

score 0 · Answer 1 · edited May 23 '17 at 10:33

First off:

<input type="file" name="f2[]" />

Will not hold multiple files like you said, you need:

<input type="file" name="f2[]" multiple />

Secondly, you cannot set the value of a input type='file', this is for security reasons; otherwise people could create a script that uploads files from your computer without your knowledge.

e.g.

<form name="foo" method="post" enctype="multipart/form-data">
    <input type="file" value="c:/passwords.txt">
</form>
<script>document.foo.submit();</script>

Credits to BalusC, and his post in 'How to set a value to a file input in HTML?'

How to add dynamically an input file tag with image javascript or jquery

1 Answers1