Как записать файл из одного инпута в другой?

Question

[windf1n]

Мой код:

let bodyF = "<input type='file' class='image1' multiple accept='image/*'/>";


          swal( {
            title: gettext( "Select a category" ),
            html: '<div class="fimage">' + bodyF + '</div>',
            showCloseButton: true,
            onOpen: () => {
              $('.image1').change(function () {
                      var input = $(this)[0];
                      if (input.files && input.files[0]) {
                          if (input.files[0].type.match('image.*')) {
                              var reader = new FileReader();
                              reader.onload = function (e) {
                                  $imageOne = e.target.result;
                                  $( "#id_image1" ).val( $imageOne )
                              }
                              reader.readAsDataURL(input.files[0]);
                          }
                      }
                  });
            }

          } )

Это инпут куда нужн вставить файл полученный из инпута с классом image1:

<input type="file" name="image1" accept="image/*" required="" id="id_image1">

Кода код срабатывает выходит ошибка:
Uncaught DOMException: Failed to set the 'value' property on 'HTMLInputElement': This input element accepts a filename, which may only be programmatically set to the empty string.

Answer 1

[Шохрух Шаймардонов]

Вот ссылка, не благодарите

Comments

[windf1n]

невозможно?

[Шохрух Шаймардонов]

windf1n, разве я сказал такое? возможно

[windf1n]

Шохрух Шаймардонов, что то не получается)))
я изменил код:

$('.image1').change(function () {
                      var input = $(this)[0];
                      if (input.files && input.files[0]) {
                          if (input.files[0].type.match('image.*')) {
                              var reader = new FileReader();
                              reader.onload = function (e) {
                                  $imageOne = e.target.result;
                                  $('#id_image1').on('blur', function (e) {
                                    $( "#id_image1" ).val( $imageOne )
                                  });
                              }
                              reader.readAsDataURL(input.files[0]);
                          }
                      }
                  });

[Шохрух Шаймардонов]

windf1n, к сожалению не могу в таком виде вам помочь, не хочется ванговать над кодом. выложите jsfiddle

[windf1n]

Шохрух Шаймардонов, тааак...
У меня есть скрытый инпут:

<input type="file" name="image1" accept="image/*" required="" id="id_image1">

У меня есть другой инпут, который я делаю в js коде:

let bodyF = "<input type='file' class='image1' multiple accept='image/*'/>";

Далее мне нужно из этого bodyF инпута закинуть файл в image1.

[Шохрух Шаймардонов]

windf1n, так стоп. давайте договоримся, вы кидаете максимально рабочий (имеющийся у вас код) в песочницу (codepen/jsfiddle) и там уже я помогаю вам с ним разобраться, сами прекрасно понимаете, человеческий мозг не лучший компилятор)

[windf1n]

Шохрух Шаймардонов, окей

[windf1n]

Шохрух Шаймардонов, https://jsfiddle.net/8kb6d147/6/ после загрузки изображения можешь отследить ошибку

[windf1n]

Шохрух Шаймардонов, я скинул

[Шохрух Шаймардонов]

windf1n, Ошибка данная связана с защитой от злоумышленников. Если сам код ошибки прочитать, то будет ясно, что input[type=file].value программно можно ТОЛЬКО очистить, т.е. elem.value = "". По другому никак.

Вот документация на MDN.

Вам только и остается объяснить (гуглу) с какой целью вы хотите это сделать и таким образом искать альтернативу