javascript - how to clone a file input to another file input which is in hidden iframe -

javascript - how to clone a file input to another file input which is in hidden iframe -

i have form has file input element , when user selects file want set selected file file input in hidden iframe,

this form:

<form name="uploadform" > <input type="file" id="fileone" name="fileone" value="" /> <button type="button" id="attachement_upload" onclick="addfile()" >upload</button> </form> <iframe id="fileuploadframe" name="fileuploadframe" src="" style="display: none; border: 0; width: 0; height: 0;"> <form id="fileuploadform" name="fileuploadform" accept-charset="utf-8" target="fileuploadframe" enctype="multipart/form-data" encoding="multipart/form-data" method="post" action="cimtrek_regional_whseform_fileupload"> <input type="file" id="filetwo" name="filetwo" value="" /> </form> </iframe>

and java script :

function addfile(){ //this want clone fileone filetwo , submit form in iframe }

i have seen thing don't know how :

$(".inputfield1").change(function(){ var $this = $(this), $clone = $this.clone(); $this.after(clone).appendto(hiddenform); });

please help me done.

you can't (or shouldn't) able this. file input type, given has direct access user's file system, has special security restrictions. notably cannot set value of file input in javascript, allow things set ~/.ssh/id_rsa , steal of import info without user beingness aware. consequence, jquery shouldn't able clone file input because can't set value.

to work you'll have allow user click on file input in iframe, perhaps using css positioning tricks create seem part of page. alternatively, if users typically have more modern browsers, utilize file api , upload file ajax.

javascript jquery html5 file