Hi @CP
Let's look at a worked example.
Imagine in our body we had this
<input type='button' id='b1' value='b1'/> <input type='button' id='b2' value='b2'/>
And we set up two onHandler extensions, one for each button, like this;
What this handler does is say "When the DOM loads, attach an event handler to anything on the page with a jQuery selector of "#b1". This means anything with an id of "b1". When this HTML element on the page is clicked (because we chose click in the "Trigger On" drop down), call Tealium's link event (because we chose "link" in the Tracking Event drop down), and pass the following data layer to that link event; { source : b1, data : d1 }
It's important to realise that the link event will not be called until the matching HTML element is clicked, not just because the DOM is ready.
I will come back to the condition at the end of this post, as it will confuse matters now.
The other handler is the same, except that it has a selector of #b2 and passes b2 and d2 instead in the link event call.
Now imagine I set up two tags. Again, I will only show the first one, as the second one is analagous;
The load rule for this tag says that it will only load if "source" is "b1". This might be from either the data layer on the page when the page initially loads, or it might be from the link event like we just added in the DOM ready extension. However, just because it may have been present in the data layer on the page doesn't mean it will be present again in the link event unless we took steps to add it there, as I explain further below. This is good, as it means the two are isolated.
The data mapping for this tag says to pass some data. Again, this might be from either the page data layer or from the link event.
If we add a second analagous tag, then overall what we see on the page is that when button b1 is clicked, the tag for b1 is loaded, if it's not already loaded, and it's fired. The same for button b2 and tag b2. If the button is clicked again, the tag is already loaded, but it's fired again.
There are a couple of notes;
1. The above assumes later utag versions. See the link I previously posted. Nowadays, tags will be loaded if needed by the onHandler event (e.g. the link call). Also, nowadays, during the link call, the tag will only have access to the data that you pass in the link call, and not to the main data layer on the page. However, if you need the latter as well, you can add extensions to the tag to get that.
2. Your other question was about
u.ev = {"view" : 1};
Not all tags out of the box respond to both link and view events. If your tag's code template has a link like the above, it means that it will ignore a link event and only respond to a view event. Our example above would not have worked for this kind of tag, since we were using a link event in the DOM ready extension. u.ev is an array of events that the tag supports. It will look like this for a tag that supports both view and link;
u.ev = {"view" : 1, "link" : 1};
If we wanted to make this work for a tag that only supported a view event, we might choose to change the DOM ready extension to call a view event instead, or we might choose to edit the tag template and add support for the link event. The former would be easier, but bear in mind that you might end up firing other tags that you didn't mean to.
3. The condition
Just to show that it's possible, I added a condition above. This example condition means "only run this DOM ready event that attaches the event handler, if the q1 URL query parameter is present with a value of 1". In other words, you can suppress the DOM ready extension itself if it doesn't match some condition, similar to load rules on a tag. This allows you more control still, but you don't have to use a condition.
... View more