複数のお届け先入力フォーム(部分テンプレート)
注文情報入力画面で利用する各入力フォーム用部分テンプレートです。
注文情報入力画面で include して利用します。(注文情報入力画面以外では利用できません)
テーマ管理のファイルパス
ec_force/shop/orders/_view_multiple_shipping_information_form_data.html.liquid
ec_force/shop/orders/_view_multiple_shipping_information_form_data.html+smartphone.liquid
必要なコンポーネント
任意とあるもの以外はシステム上必要なコンポーネントとなりますので、必ず使用するようにしてください。
{% if multiple_shipping_is_available %}
<!-- 複数のお届け先フォームデータ -->
<div id="multiple-shipping-raw-form">
{% for shipping_address in order.shipping_addresses_without_deleted %}
<!-- お届け先ごとのフォームデータ枠(必須タグ) -->
<div>
{% assign index = forloop.index0 %}
<button class="delete_shipping_address" type="button">削除</button>
<!-- お届け先住所の選択 -->
<label>お届け先住所</label>
<select class="shipping_addresses_id" name="order[shipping_addresses_attributes][{{ index }}][shipping_address_id]">
<option value="same" {% if selected_shipping_addresses_value[index] == blank or selected_shipping_addresses_value[index] == 'same' %}selected{% endif %}>請求先住所と同じ</option>
{% if customer_signed_in %}
{% for sa in current_customer.shipping_addresses %}
<option value="{{ sa.id }}" {% if selected_shipping_addresses_value[index] == sa.id %}selected{% endif %}>
{{ sa.full_name }} | 〒{{ sa.full_zip }} {{ sa.full_address }}
</option>
{% endfor %}
{% endif %}
<option value="new" {% if selected_shipping_addresses_value[index] == 'new' %}selected{% endif %}>新しく入力する</option>
</select>
<div id="shipping_address_input_{{ index }}">
<!-- お名前 -->
<label>お名前</label>
{% if shop_form_settings['name_1_field'] %}
<input type="text" class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_name01" name="order[shipping_addresses_attributes][{{ index }}][name01]" placeholder="例)山田 花子" value="{{ shipping_address.full_name }}">
{% else %}
<span>姓</span>
<input type="text" class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_name01" name="order[shipping_addresses_attributes][{{ index }}][name01]" placeholder="例)山田" value="{{ shipping_address.name01 }}">
<span>名</span>
<input type="text" class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_name02" name="order[shipping_addresses_attributes][{{ index }}][name02]" placeholder="例)花子" value="{{ shipping_address.name02 }}">
{% endif %}
<!-- フリガナ -->
<label>フリガナ</label>
{% if shop_form_settings['kana_1_field'] %}
<input type="text" class="validate[required,custom[katakana]]" id="order_shipping_addresses_{{index}}_attributes_kana01" name="order[shipping_addresses_attributes][{{ index }}][kana01]" placeholder="例)ヤマダ ハナコ" value="{{ shipping_address.full_kana }}">
{% else %}
<span>セイ</span>
<input type="text" class="validate[required,custom[katakana]]" id="order_shipping_addresses_{{index}}_attributes_kana01" name="order[shipping_addresses_attributes][{{ index }}][kana01]" placeholder="例)ヤマダ" value="{{ shipping_address.kana01 }}">
<span>メイ</span>
<input type="text" class="validate[required,custom[katakana]]" id="order_shipping_addresses_{{index}}_attributes_kana02" name="order[shipping_addresses_attributes][{{ index }}][kana02]" placeholder="例)ハナコ" value="{{ shipping_address.kana02 }}">
{% endif %}
<!-- 郵便番号 -->
<label>郵便番号</label>
{% if shop_form_settings['zip_1_field'] %}
<span>〒</span>
<input type="tel" class="shipping_addresses_zip01 validate[required,custom[integer],minSize[7]]" id="order_shipping_addresses_{{index}}_attributes_zip01" maxlength="7" name="order[shipping_addresses_attributes][{{ index }}][zip01]" placeholder="1500031" value="{{ shipping_address.full_zip }}">
{% else %}
<span>〒</span>
<input type="tel" class="shipping_addresses_zip01 validate[required,custom[integer],minSize[3]]" id="order_shipping_addresses_{{index}}_attributes_zip01" maxlength="3" name="order[shipping_addresses_attributes][{{ index }}][zip01]" placeholder="150" value="{{ shipping_address.zip01 }}">
<span>−</span>
<input type="tel" class="shipping_addresses_zip02 validate[required,custom[integer],minSize[4]]" id="order_shipping_addresses_{{index}}_attributes_zip02" maxlength="4" name="order[shipping_addresses_attributes][{{ index }}][zip02]" placeholder="0031" value="{{ shipping_address.zip02 }}">
{% endif %}
<!-- 都道府県 -->
<label>都道府県</label>
<select class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_prefecture_name" name="order[shipping_addresses_attributes][{{ index }}][prefecture_id]">
<option value="">選択してください</option>
{% for prefecture in prefectures %}
<option value="{{ prefecture.id }}" {% if shipping_address.prefecture_id == prefecture.id %}selected{% endif %}>{{ prefecture.name }}</option>
{% endfor %}
</select>
<!-- 住所1 -->
<label>{{ shop_form_settings['addr01_label'] }}</label>
<input type="text" class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_addr01" name="order[shipping_addresses_attributes][{{ index }}][addr01]" placeholder="{{ shop_form_settings['addr01_placeholder'] }}" value="{{ shipping_address.addr01 }}">
<!-- 住所2 -->
<label>{{ shop_form_settings['addr02_label'] }}</label>
{% if shop_form_settings['addr03'] %}
<input type="text" class="{% if shop_form_settings['addr02_require'] %}validate[required]{% endif %}" id="order_shipping_addresses_{{index}}_attributes_addr02" name="order[shipping_addresses_attributes][{{ index }}][addr02]" value="{{ shipping_address.addr02 }}" placeholder="{{ shop_form_settings['addr02_placeholder'] }}">
{% else %}
<input type="text" class="{% if shop_form_settings['addr02_require'] %}validate[required]{% endif %}" id="order_shipping_addresses_{{index}}_attributes_addr02" name="order[shipping_addresses_attributes][{{ index }}][addr02]"
value="{{ shipping_address.addr02 }}{{ shipping_address.addr03 }}" placeholder="{{ shop_form_settings['addr02_placeholder'] | append: shop_form_settings['addr03_placeholder'] }}">
{% endif %}
<!-- 住所3 -->
{% if shop_form_settings['addr03'] %}
<label>{{ shop_form_settings['addr03_label'] }}</label>
<input type="text" id="order_shipping_addresses_{{index}}_attributes_addr03" name="order[shipping_addresses_attributes][{{ index }}][addr03]" placeholder="{{ shop_form_settings['addr03_placeholder'] }}" value="{{ shipping_address.addr03 }}">
{% endif %}
<!-- 電話番号 -->
<label>電話番号</label>
{% if shop_form_settings['tel_1_field'] %}
<input type="tel" class="validate[required,custom[integer]]" maxlength="12" name="order[shipping_addresses_attributes][{{ index }}][tel01]" value="{{ shipping_address.full_tel }}">
{% else %}
<input type="tel" class="validate[required,custom[integer]]" maxlength="5" name="order[shipping_addresses_attributes][{{ index }}][tel01]" value="{{ shipping_address.tel01 }}">
<span>-</span>
<input type="tel" class="validate[required,custom[integer]]" maxlength="4" name="order[shipping_addresses_attributes][{{ index }}][tel02]" value="{{ shipping_address.tel02 }}">
<span>-</span>
<input type="tel" class="validate[required,custom[integer]]" maxlength="4" name="order[shipping_addresses_attributes][{{ index }}][tel03]" value="{{ shipping_address.tel03 }}">
{% endif %}
<!-- お届け先登録-->
<label for="order_shipping_addresses_{{ index }}_attributes_persist_as_customer_shipping_address">
<input type="hidden" name="order[shipping_addresses_attributes][{{ index }}][persist_as_customer_shipping_address]" value="0">
<input type="checkbox" id="order_shipping_addresses_{{ index }}_attributes_persist_as_customer_shipping_address" name="order[shipping_addresses_attributes][{{ index }}][persist_as_customer_shipping_address]" value="1" {% if shipping_address.persist_as_customer_shipping_address == true %}checked{% endif %}>お届け先登録する
</label>
</div>
<!-- お届け先商品情報 -->
{% for order_item in order_items_without_bundled_and_gift %}
{% assign order_items_info = "" %}
{% for oiil in shipping_address.order_items_info_list %}
{% if oiil.order_item.id == order_item.id %}
{% assign order_items_info = oiil %}
{% endif %}
{% endfor %}
<label>{{ order_item.variant.name_with_option_values_presentation }}</label>
<div class="order_items_info">
<!-- お届け先商品数量の選択 -->
<input type="hidden" class="order_items_info__order_item_id" name="order[shipping_addresses_attributes][{{ index }}][order_items_info_list_attributes][{{ forloop.index0 }}][order_item_id]" value="{{ order_item.id }}">
<select class="order_items_info__quantity" name="order[shipping_addresses_attributes][{{ index }}][order_items_info_list_attributes][{{ forloop.index0 }}][quantity]">
{% for i in (0..order_item.quantity) %}
<option value="{{ i }}" {% if order_items_info.quantity == i %}selected{% endif %}>{{ i }}</option>
{% endfor %}
</select>
</div>
{% endfor %}
<!-- 配送業者情報 -->
<div style="{% unless display_shipping_carrier_view_flag %}display: none;{% endunless %}">
<div class="shipping_carrier_contents">
<!-- 配送業者の選択-->
<label>配送業者</label>
<select class="shipping_carrier_id" name="order[shipping_addresses_attributes][{{ index }}]['delivery_info_attributes'][shipping_carrier_id]">
{% if shipping_address.shipping_carrier_id %}
<option value="{{ shipping_address.shipping_carrier_id }}" selected>{{ shipping_address.shipping_carrier.name }}</option>
{% endif %}
</select>
<div class="shipping_carrier_description"></div>
</div>
</div>
</div>
{% endfor %}
</div>
<!-- 複数のお届け先入力フォームテンプレート -->
<div id="multiple-shipping-template-form" style="display: none;">
{% assign index = '#{index}' %}
{% assign shipping_address = shipping_address_instance %}
<button class="delete_shipping_address" type="button">削除</button>
<!-- お届け先住所の選択 -->
<label>お届け先住所</label>
<select class="shipping_addresses_id" name="order[shipping_addresses_attributes][{{ index }}][shipping_address_id]">
<option value="same" {% if selected_shipping_addresses_value[index] == blank or selected_shipping_addresses_value[index] == 'same' %}selected{% endif %}>請求先住所と同じ</option>
{% if customer_signed_in %}
{% for sa in current_customer.shipping_addresses %}
<option value="{{ sa.id }}" {% if selected_shipping_addresses_value[index] == sa.id %}selected{% endif %}>
{{ sa.full_name }} | 〒{{ sa.full_zip }} {{ sa.full_address }}
</option>
{% endfor %}
{% endif %}
<option value="new" {% if selected_shipping_addresses_value[index] == 'new' %}selected{% endif %}>新しく入力する</option>
</select>
<div id="shipping_address_input_{{ index }}">
<!-- お名前 -->
<label>お名前</label>
{% if shop_form_settings['name_1_field'] %}
<input type="text" class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_name01" name="order[shipping_addresses_attributes][{{ index }}][name01]" placeholder="例)山田 花子" value="{{ shipping_address.full_name }}">
{% else %}
<span>姓</span>
<input type="text" class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_name01" name="order[shipping_addresses_attributes][{{ index }}][name01]" placeholder="例)山田" value="{{ shipping_address.name01 }}">
<span>名</span>
<input type="text" class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_name02" name="order[shipping_addresses_attributes][{{ index }}][name02]" placeholder="例)花子" value="{{ shipping_address.name02 }}">
{% endif %}
<!-- フリガナ -->
<label>フリガナ</label>
{% if shop_form_settings['kana_1_field'] %}
<input type="text" class="validate[required,custom[katakana]]" id="order_shipping_addresses_{{index}}_attributes_kana01" name="order[shipping_addresses_attributes][{{ index }}][kana01]" placeholder="例)ヤマダ ハナコ" value="{{ shipping_address.full_kana }}">
{% else %}
<span>セイ</span>
<input type="text" class="validate[required,custom[katakana]]" id="order_shipping_addresses_{{index}}_attributes_kana01" name="order[shipping_addresses_attributes][{{ index }}][kana01]" placeholder="例)ヤマダ" value="{{ shipping_address.kana01 }}">
<span>メイ</span>
<input type="text" class="validate[required,custom[katakana]]" id="order_shipping_addresses_{{index}}_attributes_kana02" name="order[shipping_addresses_attributes][{{ index }}][kana02]" placeholder="例)ハナコ" value="{{ shipping_address.kana02 }}">
{% endif %}
<!-- 郵便番号 -->
<label>郵便番号</label>
{% if shop_form_settings['zip_1_field'] %}
<span>〒</span>
<input type="tel" class="shipping_addresses_zip01 validate[required,custom[integer],minSize[7]]" id="order_shipping_addresses_{{index}}_attributes_zip01" maxlength="7" name="order[shipping_addresses_attributes][{{ index }}][zip01]" placeholder="1500031" value="{{ shipping_address.full_zip }}">
{% else %}
<span>〒</span>
<input type="tel" class="shipping_addresses_zip01 validate[required,custom[integer],minSize[3]]" id="order_shipping_addresses_{{index}}_attributes_zip01" maxlength="3" name="order[shipping_addresses_attributes][{{ index }}][zip01]" placeholder="150" value="{{ shipping_address.zip01 }}">
<span>−</span>
<input type="tel" class="shipping_addresses_zip02 validate[required,custom[integer],minSize[4]]" id="order_shipping_addresses_{{index}}_attributes_zip02" maxlength="4" name="order[shipping_addresses_attributes][{{ index }}][zip02]" placeholder="0031" value="{{ shipping_address.zip02 }}">
{% endif %}
<!-- 都道府県 -->
<label>都道府県</label>
<select class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_prefecture_name" name="order[shipping_addresses_attributes][{{ index }}][prefecture_id]">
<option value="">選択してください</option>
{% for prefecture in prefectures %}
<option value="{{ prefecture.id }}" {% if shipping_address.prefecture_id == prefecture.id %}selected{% endif %}>{{ prefecture.name }}</option>
{% endfor %}
</select>
<!-- 住所1 -->
<label>{{ shop_form_settings['addr01_label'] }}</label>
<input type="text" class="validate[required]" id="order_shipping_addresses_{{index}}_attributes_addr01" name="order[shipping_addresses_attributes][{{ index }}][addr01]" placeholder="{{ shop_form_settings['addr01_placeholder'] }}" value="{{ shipping_address.addr01 }}">
<!-- 住所2 -->
<label>{{ shop_form_settings['addr02_label'] }}</label>
{% if shop_form_settings['addr03'] %}
<input type="text" class="{% if shop_form_settings['addr02_require'] %}validate[required]{% endif %}" id="order_shipping_addresses_{{index}}_attributes_addr02" name="order[shipping_addresses_attributes][{{ index }}][addr02]" value="{{ shipping_address.addr02 }}" placeholder="{{ shop_form_settings['addr02_placeholder'] }}">
{% else %}
<input type="text" class="{% if shop_form_settings['addr02_require'] %}validate[required]{% endif %}" id="order_shipping_addresses_{{index}}_attributes_addr02" name="order[shipping_addresses_attributes][{{ index }}][addr02]"
value="{{ shipping_address.addr02 }}{{ shipping_address.addr03 }}" placeholder="{{ shop_form_settings['addr02_placeholder'] | append: shop_form_settings['addr03_placeholder'] }}">
{% endif %}
<!-- 住所3 -->
{% if shop_form_settings['addr03'] %}
<label>{{ shop_form_settings['addr03_label'] }}</label>
<input type="text" id="order_shipping_addresses_{{index}}_attributes_addr03" name="order[shipping_addresses_attributes][{{ index }}][addr03]" placeholder="{{ shop_form_settings['addr03_placeholder'] }}" value="{{ shipping_address.addr03 }}">
{% endif %}
<!-- 電話番号 -->
<label>電話番号</label>
{% if shop_form_settings['tel_1_field'] %}
<input type="tel" class="validate[required,custom[integer]]" maxlength="12" name="order[shipping_addresses_attributes][{{ index }}][tel01]" value="{{ shipping_address.full_tel }}">
{% else %}
<input type="tel" class="validate[required,custom[integer]]" maxlength="5" name="order[shipping_addresses_attributes][{{ index }}][tel01]" value="{{ shipping_address.tel01 }}">
<span>-</span>
<input type="tel" class="validate[required,custom[integer]]" maxlength="4" name="order[shipping_addresses_attributes][{{ index }}][tel02]" value="{{ shipping_address.tel02 }}">
<span>-</span>
<input type="tel" class="validate[required,custom[integer]]" maxlength="4" name="order[shipping_addresses_attributes][{{ index }}][tel03]" value="{{ shipping_address.tel03 }}">
{% endif %}
<!-- お届け先登録-->
<label for="order_shipping_addresses_{{ index }}_attributes_persist_as_customer_shipping_address">
<input type="hidden" name="order[shipping_addresses_attributes][{{ index }}][persist_as_customer_shipping_address]" value="0">
<input type="checkbox" id="order_shipping_addresses_{{ index }}_attributes_persist_as_customer_shipping_address" name="order[shipping_addresses_attributes][{{ index }}][persist_as_customer_shipping_address]" value="1" {% if shipping_address.persist_as_customer_shipping_address == true %}checked{% endif %}>お届け先登録する
</label>
</div>
<!-- お届け先商品情報 -->
{% for order_item in order_items_without_bundled_and_gift %}
{% assign order_items_info = "" %}
{% for oiil in shipping_address.order_items_info_list %}
{% if oiil.order_item.id == order_item.id %}
{% assign order_items_info = oiil %}
{% endif %}
{% endfor %}
<label>{{ order_item.variant.name_with_option_values_presentation }}</label>
<div class="order_items_info">
<!-- お届け先商品数量の選択 -->
<input type="hidden" class="order_items_info__order_item_id" name="order[shipping_addresses_attributes][{{ index }}][order_items_info_list_attributes][{{ forloop.index0 }}][order_item_id]" value="{{ order_item.id }}">
<select class="order_items_info__quantity" name="order[shipping_addresses_attributes][{{ index }}][order_items_info_list_attributes][{{ forloop.index0 }}][quantity]">
{% for i in (0..order_item.quantity) %}
<option value="{{ i }}" {% if order_items_info.quantity == i %}selected{% endif %}>{{ i }}</option>
{% endfor %}
</select>
</div>
{% endfor %}
<!-- 配送業者情報 -->
<div style="{% unless display_shipping_carrier_view_flag %}display: none;{% endunless %}">
<div class="shipping_carrier_contents">
<!-- 配送業者の選択-->
<label>配送業者</label>
<select class="shipping_carrier_id" name="order[shipping_addresses_attributes][{{ index }}]['delivery_info_attributes'][shipping_carrier_id]">
{% if shipping_address.shipping_carrier_id %}
<option value="{{ shipping_address.shipping_carrier_id }}" selected>{{ shipping_address.shipping_carrier.name }}</option>
{% endif %}
</select>
<div class="shipping_carrier_description"></div>
</div>
</div>
</div>
{% endif %}