2016-07-26 51 views
0

我們希望使用Google跟蹤代碼管理器來跟蹤表單提交當我從GTM添加jQuery腳本並測試它時,腳本甚至不會觸發 - 即使不是「你好,我已經剝離出來的AngularJS {{表達式}}值來保護我們的公司財產。我希望這是足夠的信息。GTM網頁跟蹤jQuery()。submit(函數不能與AngularJS形式一起使用

<div id="login_signIn" class=""> 
    <form id="login_form" name="loginForm" novalidate> 
    <fieldset> 
     <legend>Sign In</legend> 
     <label for="u_name" ng-class=""> Email address </label> 
     <input name="u_name" id="u_name" type="email" maxlength="50" ng-model="" required ng-class="" /> 
     <label for="Password1" ng-class=""> Password </label> 
     <input name="passwd" id="Password1" type="password" maxlength="50" ng-model="" required ng-class="" /> 
     <div class="login_forgot p-bottom clearfix"> <span class='loading f-left' ng-show=""> <img src="/images/loading.gif" width="48" height="47" alt="Loading" /> </span> <span class="f-right"><a href="/forgot-password/"><em>Forgot Password?</em></a></span> </div> 
     <div class="form-error p-bottom clearfix" ng-show=''></div> 
     <input type="submit" value="Sign In" name="new_submit_img" ng-click="" class="cliq-submit" /> 
     <script type="text/javascript"> 
     jQuery('#login_form').submit(function(e){ 
      alert("hello"); 
      window.dataLayer = window.dataLayer || []; 
      window.dataLayer.push({ 
       'event' : 'formSubmissionSuccess', 
       'formId' : 'login_form' 
      }); 
     }); 
     </script> 
    </fieldset> 
    </form> 
</div> 

感謝您的想法。

+0

我們使用jquery.min 1.12.4,jquery-migrate.min.js 1.4.1和AngularJS v1.2.26 –

+0

當我調試它時,我設置的斷點不會停止頁面,它只是提交表單並沿着下一頁。 –

回答

0

我發現這篇文章介紹了GTM腳本在上述GTM腳本不起作用時添加GTM腳本的不同方式:

http://www.simoahava.com/analytics/track-form-abandonment-with-google-tag-manager/

的標題下:基本自定義HTML代碼我用GTM腳本塊,我們的口主體的標記之後的上方放置這個腳本和它的工作就像一個魅力:

<script> 
     (function() { 
     window.addEventListener('beforeunload', function() { 
      window.dataLayer.push({ 
      'event' : 'formSubmissionSuccess', 
      'formId' : 'login_form' 
      }); 
     }); 
     })(); 
    </script>