FROM CACHE - jp_header
解決済

cart attributesを削除するコードについて

るん
Shopify Partner
79 3 10

いつもお世話になっております。

現在カートページのコードを編集して、cart attributesを取得できるようにしています。

一度チェックアウト画面に進むとcart attibutesが保存され、特に値を変更しない限り、決済が終わるまでは値が保存されると思うのですが、カートページでお客様が特定の操作をした場合、cart attributesを削除したいです。

 

どのようなコードを書けば良いでしょうか?

jQueryを使用しないコードでお願いいたします。

 

よろしくお願いいたします。

2 件の受理された解決策

Qcoltd
Shopify Partner
1051 429 417

成功

@るん 様

 

https://shopify.dev/docs/api/ajax/reference/cart

こちらにcart APIについてのドキュメントがありますので、

こちらをお読みいただくのが良いのです。

 

cart/update.jsでattributeの値を空にすることで、削除できるようです。

 

例: cartAttribute[hoge]を削除する場合

var formData = new FormData();
formData.append("attributes[hoge]", "");
fetch(window.Shopify.routes.root + 'cart/update.js', {
  method: 'POST',
  body: formData
})
.then(response => response.json())
.then(data => console.log(data));

 

ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/

元の投稿で解決策を見る

Qcoltd
Shopify Partner
1051 429 417

成功

@るん 様

 

クリック時に条件分岐後に呼び出しをしたいのですが、こちらのコードを普通に関数の中に入れれば良いでしょうか?

 

下記のようにコードを丸々if文で囲むのでしたら、async/awaitのことは気にされなくて大丈夫です。

document.querySelector('.button').addEventListener('click', function{
  if (何らかの条件){
    var formData = new FormData();
    formData.append("attributes[hoge]", "");
    fetch(window.Shopify.routes.root + 'cart/update.js', {
      method: 'POST',
      body: formData
    })
    .then(response => response.json())
    .then(data => console.log(data));
  }
});

 
ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/

元の投稿で解決策を見る

4件の返信4

Qcoltd
Shopify Partner
1051 429 417

成功

@るん 様

 

https://shopify.dev/docs/api/ajax/reference/cart

こちらにcart APIについてのドキュメントがありますので、

こちらをお読みいただくのが良いのです。

 

cart/update.jsでattributeの値を空にすることで、削除できるようです。

 

例: cartAttribute[hoge]を削除する場合

var formData = new FormData();
formData.append("attributes[hoge]", "");
fetch(window.Shopify.routes.root + 'cart/update.js', {
  method: 'POST',
  body: formData
})
.then(response => response.json())
.then(data => console.log(data));

 

ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
るん
Shopify Partner
79 3 10

株式会社Q (キュー)田辺様

 

いつもお世話になっております。

お返事が大変遅くなってしまい、申し訳ございません。

 

ありがとうございます。

教えていただいたコードを試したところ、cart attributesを削除することができました。

 

勉強不足で大変申し訳ないのですが、よろしければもう1点教えていただけますでしょうか?

クリック時に条件分岐後に呼び出しをしたいのですが、こちらのコードを普通に関数の中に入れれば良いでしょうか?

async/awaitを使った方が良いのかよくわかっておりません。

 

よろしくお願いいたします。

 

Qcoltd
Shopify Partner
1051 429 417

成功

@るん 様

 

クリック時に条件分岐後に呼び出しをしたいのですが、こちらのコードを普通に関数の中に入れれば良いでしょうか?

 

下記のようにコードを丸々if文で囲むのでしたら、async/awaitのことは気にされなくて大丈夫です。

document.querySelector('.button').addEventListener('click', function{
  if (何らかの条件){
    var formData = new FormData();
    formData.append("attributes[hoge]", "");
    fetch(window.Shopify.routes.root + 'cart/update.js', {
      method: 'POST',
      body: formData
    })
    .then(response => response.json())
    .then(data => console.log(data));
  }
});

 
ご参考まで。

(キュー田辺)

株式会社Q (キュー)
グラフィックデザイン、アパレル事業、Web制作など色々やっている渋谷区代々木の会社です。ShopifyでのECサイトの運営・開発も行なっています。
私たちについて: https://web.q-co.jp/ テックブログ: https://techlab.q-co.jp/
るん
Shopify Partner
79 3 10

株式会社Q (キュー)田辺様

 

お世話になっております。

 

ご丁寧に教えていただきまして、ありがとうございました。

大変助かりました。