web-analyticsadobe-analyticsweb-analytics-tools

Adobe Dynamic Tag Manager: Event-Based Rule Upon Unordered List


If there are no Class or DIV designations for the items within this unordered list, how would you go about using the %this.innerHTML% notation to pull which link was clicked in an Event-Based rule?

< div class="relatedCategories rowBottomSpace" >

    < strong class="header black short">Related Categories</strong>

    <ul>
      <li>
    <a href="/link1" rel="link 1">LINK 1</a>
        <span>|</span>
    </li>

      <li>
    <a href="/link2" rel="link 2">LINK 2</a>
        <span>|</span>
    </li>

      <li><a href="/link3" rel="link 3">LINK 3</a>
    </li>

  </div>

Solution

  • Solution #1: Update your selector to be more specific

    This is the solution I mentioned in my comment above. Assumption is that your Condition's Element Tag or Selector is something like div.relatedCategories. If you change it to specifically target links within it: div.relatedCategories a then this will reference the link that was clicked.

    Solution #2: Use a custom condition and data element

    Let's say for whatever reason(s) you want to keep the original higher level selector: div.relatedCategories.

    Leave it as such, and then under Rule Conditions > Criteria
    choose Data > Custom and then click "Add Criteria".

    In the Custom code box, add the following:

    var target = (event.target) ? event.target : event.srcElement;
    _satellite.setVar('linkTarget',target);
    return true;
    

    This will create a data element called linkTarget which will hold an html element object reference to the clicked link. So then you can use %linkTarget.innerHTML% or alternatively, back up in the Custom code box you can set linkTarget to be target.innerHTML and then reference with %linkTarget%.