Line Item Propertiesの「type="file"」に関する質問｜テーマアップデート

[fizty]

Line Item Propertiesを使い、購入時に備考欄と画像を添付できるようにしていました。

今回、テーマアップデートの際に手動で新しいテーマへ移行したところ、データ名は引き継がれるものの、画像の添付が反映されませんでした。
新しいテーマはDawn バージョン15.3.0、旧テーマはDawn 5.0.0です。

ファイル添付機能は廃止されたのでしょうか？
それとも設定方法が変わったのでしょうか？

ご教授いただけますと幸いです。
よろしくお願いいたします。

 <------下記コード---->

        <p class="line-item-property__field">

                      <label>備考欄</label>

                      <textarea

                        name="properties[備考欄]"

                        placeholder=""

                      ></textarea>

                    </p>



                    <!-- ファイル添付 -->

                    <div class="product-form__item product-form__item--logo cs-attachment">

                      <label>

                        <input

                          id="custom_photo"

                          class="js-change"

                          type="file"

                          name="properties[データ]"

                          class="product-form__input"

                          multiple



                        >ファイルを選択

                      </label>

                      <p class="file-names">ファイル未選択</p>

                    </div>

                    

                    <script>

                      //ファイル名を表示する

                      document.querySelectorAll('.cs-attachment input[type=file]').forEach(function () {

                        this.addEventListener('change', function (e) {

                          let parent = e.target.closest('.cs-attachment');

                          parent.querySelector('.file-names').innerHTML = '';

                          for (file of e.target.files) {

                            parent.querySelector('.file-names').insertAdjacentHTML('beforeend', file.name + '<br>');

                          }

                        });

                      });

                    </script>

[Qcoltd]

@fizty 様

画像添付の件ですが、Dawn15.3.0でも廃止はされていないかと思います。

記載いただいたコードがどこに記載されているか不明なため、推測となりますが、

textareaやinputタグ内に、formタグと紐付けるform属性がコードに不足しているように思われます。

下記のようにhtml部分を変更したら登録できるかと思われます。

<p class="line-item-property__field">
  <label>備考欄</label>
  <textarea
    name="properties[備考欄]"
    placeholder=""
    form="{{ product_form_id }}"
  ></textarea>
</p>

<!-- ファイル添付 -->
<div class="product-form__item product-form__item--logo cs-attachment">
  <label>
    <input
      id="custom_photo"
      class="js-change product-form__input"
      type="file"
      name="properties[データ]"
      accept="image/*"
      multiple
      form="{{ product_form_id }}"
    >ファイルを選択
  </label>
  <p class="file-names">ファイル未選択</p>
</div>

コード自体はテストをしておりませんので、動かない場合もございますので、ご了承ください。

ご参考まで。

（キュー小坂）