Collect Tracking Code - SetUserInfo

Question

I am configuring SetUserInfo but with a small customization, here is what I am trying to do:

<script src="//xxxxxxxx.collect.igodigital.com/collect.js"></script>
<script type="text/javascript">
  _etmc.push(["setOrgId", "xxxxxxxx"]);
      document.getElementById('btn1').addEventListener('click',function(){
      var valorinput = document.getElementById('input1').value;
    _etmc.push(["setUserInfo", { "email" : valorinput }]);;
      alert(valorinput);
});
  _etmc.push(["trackPageView", { "item" : "00001" }]);

But unfortunately is not working as expected. Basically, I need to setUserInfo to populate IGO_PROFILES with EmailAdrress when a user submit a form with him informations including EmailAdress that is being caught here:

var valorinput = document.getElementById('input1').value;

Form will not redirect user to another page, instead, will allow him to download a file when the submit button is clicked. I already tested code snippet provided by Lukas Lunow here: Collect tracking code implementation and works fine, but since the requirements is a bit different I am trying to use another approach.

There is TIP in salesforce documentation [https://help.salesforce.com/articleView?id=mc_ctc_set_user_info.htm&type=5] that makes me think that I don't need to redirect the user to another page and pass his informations by URL.

What is wrong with my code? (It's weird, because is if I use the same code snippet to trackPageView it works fine). Beside that, can anyone give me some "light" of examples related with this kind of implementation?

Thanks,

Youssef Kanso.

Answer 1

The code you have above runs on page load and it does the trackPageView immediately. The button click event listener you've created at the same time will handle the button click event, but there's no trackPageView being called within the handler's body. Reformat your code to something similar to this in order to do your trackPageView on button click:

<script src="//xxxxxxxx.collect.igodigital.com/collect.js"></script>
<script type="text/javascript">
  document.getElementById('btn1').addEventListener('click',function(){
      var valorinput = document.getElementById('input1').value;
      _etmc.push(["setOrgId", "xxxxxxxx"]);
      _etmc.push(["setUserInfo", { "email" : valorinput }]);
      _etmc.push(["trackPageView", { "item" : "00001" }]);
  });
</script>