2016-07-26 13 views
0

ユーザーが選択したオプションの値を動的に取得し、その値をボタンクリック時のFacebook Pixelに戻す必要があります。フォームから選択したオプション値を取得し、jquery/javascript経由で返す必要があります。

スクリプト領域で選択されたオプション値を参照してください。

 <form action="/cart/add" method="post" enctype="multipart/form-data" class="AddToBagForm text-center medium-up--text-left" novalidate>  
     <select name="id" id="product-select-2585865157" class="product-single__variants"> 
       <option selected="selected" value="7534116741">White Marble/S - $39.95 USD</option> 
       <option value="7534116869">White Marble/L - $39.95 USD</option> 
       <option value="7534117061">Midnight/S - $39.95 USD</option> 
       <option value="7534117253">Midnight/L - $39.95 USD</option> 
       <option value="9032311493">Maroon/M - $39.95 USD</option> 
       <option value="9032318853">Maroon/L - $39.95 USD</option> 
     </select> 
     <div class="add-container clearfix"> 
      <a href="#" class="btn--primary BIS_trigger" data-product-handle="mighty-ganesh-flowy-top" data-variant-id="7534116741">Get Notified</a> 
      <div class="quantity-field"> 
      <label for="Quantity" class="quantity-selector">Qty:</label> 
      <input type="number" id="Quantity" name="quantity" value="1" min="1" max="3" class="quantity-selector"> 
      </div> 
      <button type="submit" name="add" class="AddToBag btn--primary" id="add-to-cart" > 
      <span class="AddToBagText">Add to Bag</span> 
      </button> 
     </div> 

     <script type="text/javascript"> 
      $('#add-to-cart').click(function() { 
      fbq('track', 'AddToCart', { 
       content_ids: '{{ product.id }}.' + **SELECTED OPTION VALUE**, 
       content_type: 'product', 
       value: {{ product.price | money_without_currency}}, 
      }); 
      }); 
     </script> 

     </form> 

答えて

1

すでにライブラリを使用するので、あなたはselect要素の選択オプション値through the .val() function with jQueryを得ることができます。

$('#product-select-2585865157').val()

あるいは、そのidが発生しているように見えるので、:$('select.product-single__variants').val()

最終的なJavaScriptは次のようになります。

$('#add-to-cart').click(function() { 
     var selection = $('#product-select-2585865157').val(); 
     /* var selection = $('select.product-single__variants').val(); */ 

     fbq('track', 'AddToCart', { 
      content_ids: '{{ product.id }}.' + selection, 
      content_type: 'product', 
      value: {{ product.price | money_without_currency}}, 
     }); 
}); 
+0

感謝を。私はすぐにそれを確認します。 1つの簡単なフォローアップの質問:product-select-#は、Shopifyの内部変数の1つを使用して動的です。