2017-08-02 4 views
0

J'écris une fonction Javascript qui sera un tag dans Google Tag Manager.Puis-je surveiller les modifications apportées aux variables de la base de données dans Google Gestionnaire de balises?

Il est chargé sur un SPA sur lequel j'ai un contrôle minimal.

Chaque fois qu'un utilisateur clique, j'utiliser la fonctionnalité de GTM pour pousser certaines données à la couche de données, par exemple:

var someEventIsTriggered = function(e) { 
     var target = $('input#watched'); 

     // Trigger a generic "gtm.click" event on every click 
     dataLayer.push({ 
      "event": "gtm.customEvent", 
      "gtm.customWatchedVariable": target.val() 
     }); 
}; 

Chaque fois que cela est déclenché, il poussera un nouvel événement à la couche de données, et mis à jour le valeur de gtm.customWatchedVariable. Ce que je veux maintenant vérifier est si le gtm.customWatchedVariable actuel est différent du dernier gtm.customWatchedVariable, puis déclenche un déclencheur dans GTM quand il change.

Comment est-ce que je peux faire ceci?

Répondre

0

Merci à @ victor-Leontiev, pour moi pointant vers la réponse.

Je n'avais pas réalisé que vous pouviez traiter l'objet dataLayer comme n'importe quel autre tableau. Donc, mon code ressemble maintenant à ceci:

var someEventIsTriggered = function(e) { 
    var target = $('input#watched'); 
    var lastEvent = dataLayer 
         .filter(function (e) { return e.event === 'gtm.customEvent'; }) 
         .pop(); 
    var lastValue = lastEvent instanceof Object 
         ? lastEvent["gtm.customWatchedVariable"] 
         : false; 

    // Trigger a generic "gtm.click" event on every click 
    dataLayer.push({ 
     "event": "gtm.customEvent", 
     "gtm.customWatchedVariable": target.val() 
    }); 

    if (lastValue !== target.val()) { 
     // Do the thing. 
    } 

}; 

Merci!

1

Ce JS est la vérification si la dernière gtm.customWatchedVariable variables dataLayer objet est différent:

var someEventIsTriggered = function(e) { 
    var target = $('input#watched'); 

    dataLayer.push({ 
     "event": "gtm.customEvent", 
     "gtm.customWatchedVariable": target.val() 
    }); 

    var customWatcherVar = dataLayer.filter(function(e){ return typeof(e["gtm.customWatchedVariable"]) != 'undefined';}); 
    var prevDatalayer = customWatcherVar[customWatcherVar.length-2]; 
    var newDatalayer = customWatcherVar[customWatcherVar.length-1]; 
    var prevVal = null; 
    var newVal = null; 
    if (prevDatalayer!=null) 
    { 
     prevVal = prevDatalayer["gtm.customWatchedVariable"]; 
    } 
    if (newDatalayer!=null) 
    { 
     newVal = newDatalayer["gtm.customWatchedVariable"]; 
    } 
    if (prevVal != newVal) 
    { 
     // Push another datalayer, because gtm.customWatchedVariable changed 
    } 

}; 
+0

Merci! Je n'avais pas réalisé que vous pouviez traiter le dataLayer comme un simple tableau Javascript. La façon la plus élégante de le faire serait de prendre le dernier élément avant de pousser votre nouvel élément. – haz

+0

Si cela fonctionne pour vous, pouvez-vous s'il vous plaît accepter ma réponse –