Cart attributesが注文データに反映されない現象について

akatuki
観光客
12 0 4

配送日時を注文データに反映させるため、カートページに以下Cart attributes(カート属性)コードを設置しています。
※配送希望日はjsライブラリ「flatpickr」使って、商品毎に選択可能な最短配送日を動的に変える処理をしています。

 

<label for="shipping-day">配送希望日</label>
<input class="flatpickr" id="shipping-day" type="text" name="attributes[希望配送日]" value="配送希望日を選択する">

<label for="shipping-time">配送希望時間</label>
<select id="shipping-time" name="attributes[希望配送時間]">
<option value="希望なし" selected>配送希望時間帯を選択する</option>
<option value="8:00-12:00"{% if cart.attributes["希望配送時間"] == "8:00-12:00" %} selected{% endif %}>8:00-12:00</option>
<option value="14:00-16:00"{% if cart.attributes["希望配送時間"] == "14:00-16:00" %} selected{% endif %}>14:00-16:00</option>
<option value="16:00-18:00"{% if cart.attributes["希望配送時間"] == "16:00-18:00" %} selected{% endif %}>16:00-18:00</option>
<option value="18:00-20:00"{% if cart.attributes["希望配送時間"] == "18:00-20:00" %} selected{% endif %}>18:00-20:00</option>
<option value="19:00-21:00"{% if cart.attributes["希望配送時間"] == "19:00-21:00" %} selected{% endif %}>19:00-21:00</option>
</select>

51ng1nbfsg.png

設置サイト
https://mini-mal.tokyo/

================
問題点
================

このCart attributesが、注文データの「追加の詳細」に登録されるケースとされないケース(空欄)があります。
(同じ購入商品・同じ決済方法でも、注文データによっては「追加の詳細」が保存されているケースとされていないケースがあり、規則性がありません)

 

正常に登録されるケース↓

hf7bfd554.png

チェックアウト画面に行くには必ずカート画面を経由して配送日時を選択してもらう形で、
配送日時を未選択の場合でもデフォルトのデータ(配送希望時間なら、「希望なし」)が必ず登録されるはずですので、
「追加の詳細」覧が空欄であることはおかしいです。

================
試したこと
================

以下、原因調査のために行ったことです。

■支払い方法による影響がないか

参考:https://community.shopify.com/c/Technical-Q-A/Cart-attributes-not-always-saving/td-p/715733
参考:https://help.shopify.com/en/manual/online-store/os/dynamic-checkout/compatibility#cart-attributes
海外記事では動的チェックアウトボタンが原因と書かれていますが、ShopifyPayment(クレカ決済)でも問題が発生しています。

結果:支払い方法は原因ではない

■ブラウザ毎の購入検証

・PC
GoogleCrome
FireFox
IE
Edge

・スマホ
iOS
Googleアプリ

結果:上記主要ブラウザで購入検証しましたが、全て正常にデータが保存されます。


================
疑問点
================

Cart attributesは何らかの要因で注文データに反映されないケースはあるのでしょうか?

0 件の「いいね!」
_osamu_iwasaki_
探検家
61 16 96

LiquidはDOM構築前の処理を行うものなので、
DOM構築後にユーザーがINPUTタグでアクションする条件分岐には対応してないはずです。

JQueryで条件分岐作りなおしてみてください。