入力値をデータレイヤーにプッシュするGTM

Question

フォームからGTMデータレイヤーに入力値をプッシュしようとしています。私はいろいろなガイドを読んだことがあり、必要なステップで少し混乱しています。現在、私はセットアップしました次のHTMLタグを発射

1. トリガーを
入力値を捕捉するためのJavaScriptのいくつかのカスタムを持って
2. HTMLタグが

<script> 
 
    
 
    /* event listener */ 
 
    document.getElementsByName("UnitPrice")[0].addEventListener('change', doThing); 
 
    
 
    /* function */ 
 
    function doThing(){ 
 
    \t var donateAmount = this.value; 
 
     
 
     console.log(donateAmount); 
 
     
 
     window.dataLayer.push({ 
 
      'event' : 'donation', 
 
      'donationAmount' : donateAmount 
 
     }); 
 
    } 
 
</script>

（下記参照します）

私の質問は2倍です。まず、フォームアイテムで入力が更新されるたびに、データレイヤーにプッシュされた情報（GTMデバッガを使用して）が表示されないようにする必要がありますか？第二に、データレイヤーにデータを渡すまでここで一歩も欠いていますか？

編集：以下

は、入力フィールド

<input name="UnitPrice" type="hidden" id="UnitPrice" value="" /> 

Answer 1

'変更' のhtmlですかなりトリッキーなイベントです。通常、このイベントは、テキスト値が変更され、入力がフォーカスを失うのを待ってから開始されません。 https://developer.mozilla.org/en-US/docs/Web/Events/change

入力の変更ごとにプッシュする必要はありませんが、いくつかの「サブミット」のやりとりにのみ必要と思われます。

function() { 
    return document.getElementsByName("UnitPrice")[0].value; 
} 

して、変数を参照することで、あなたのタグの値にアクセスする：あなたはGTMに、この値を公開するカスタムJavascriptのタイプのユーザ定義変数を使用することができます。