FROM CACHE - jp_header
解決済

JSにて商品が登録された日付を取得したい

nnk
観光客
12 0 1

初めての質問ですので文章が拙かったりするかと思いますがご助力いただけると幸いです。

 

 Product Filter & Searchのアプリを入れたことで「boost-pfs-filter.js」というJSが生成されたと思っているのですが

こちらのアプリではセール商品・売り切れ商品の取得はできるみたいですが新商品というタグをつけることは難しそうでした。

ですので、こちらで記述を付け加えようと思ったのですが商品の販売開始日時をJS側で取得できずに困っています。

 

liquid側では「product.published_at | date: "%s"」の記述で持ってこれたのですがJSでも取得できるのでしょうか?

 

取得できるのであれあば取得のやり方、サンプルコードなどを教えていただけると幸いです。

 

情報不足等している場合は教えていただけると追記します。

1 件の受理された解決策
junichiokamura
Community Manager
1200 280 506

成功

LiquidはJSファイルに書いても動作しないので、liquidファイルのどこかでJSの変数にLiquidのobjectの内容を渡して、それを利用するJSの関数にパラメータで渡すアプローチが良いかと思います。

以下のようなイメージです。

xxx.liquid (collection.liquid など)

<script>

var d = '{{ product.published_at | date: "%s"}}';

fuctionA(d);

</script>

xxx.js (ご指摘のJSファイル)

 

function functionA(d) {

if (d > ....)

.....

};

Senior Partner Solutions Engineer

元の投稿で解決策を見る

3件の返信3

junichiokamura
Community Manager
1200 280 506

単純に、

var d = '{{ product.published_at | date: "%s"}}';

で、画面表示でJSの変数にLiquidの内容を代入するではどうでしょうか?

Senior Partner Solutions Engineer
nnk
観光客
12 0 1

ご回答ありがとうございます。

var d = '{{ product.published_at | date: "%s"}}';

画面表示でJSの変数にLiquidの内容を代入

上記の部分がよくわからなかったのですが画面表示で代入ということはJS側に記述するということで合ってますでしょうか?

JS側に記述したところ文字列として変数に代入されてしまっているようでして期待通り実行できませんでした。

 

最初に記載できておりませんでしたが

この記述を入れることで今回対応したいことは商品に「新着」のタグの表示です。

下記をJSで再現することはできるのでしょうか?

{%- assign new_product = false -%}
{%- assign published_date = product.published_at | date: "%s" -%}
{%- assign now_date = 'now' | date: "%s" -%}
{%- assign age_in_days = now_date | minus: published_date | divided_by: 60 | divided_by: 60 | divided_by: 12 -%}
{%- assign test_days = product.published_at -%}
{%- if age_in_days < settings.tag_new_limit -%}
{%- assign new_product = true -%}
{%- endif -%}

 

junichiokamura
Community Manager
1200 280 506

成功

LiquidはJSファイルに書いても動作しないので、liquidファイルのどこかでJSの変数にLiquidのobjectの内容を渡して、それを利用するJSの関数にパラメータで渡すアプローチが良いかと思います。

以下のようなイメージです。

xxx.liquid (collection.liquid など)

<script>

var d = '{{ product.published_at | date: "%s"}}';

fuctionA(d);

</script>

xxx.js (ご指摘のJSファイル)

 

function functionA(d) {

if (d > ....)

.....

};

Senior Partner Solutions Engineer