{"id":1590,"date":"2014-11-09T22:00:54","date_gmt":"2014-11-09T20:00:54","guid":{"rendered":"https:\/\/webanalyst.ro\/?p=1590"},"modified":"2017-07-10T15:36:41","modified_gmt":"2017-07-10T12:36:41","slug":"probleme-cu-auto-event-listeners","status":"publish","type":"post","link":"https:\/\/webanalyst.ro\/blog\/2014\/probleme-cu-auto-event-listeners\/","title":{"rendered":"Probleme cu auto-event listeners?"},"content":{"rendered":"<p>Scriam \u00een <a href=\"https:\/\/webanalyst.ro\/blog\/2014\/gtm\/\" target=\"_blank\" rel=\"noopener\">articolul<\/a> despre Google Tag Manager c\u0103 este un produs t\u00e2n\u0103r de la care \u00eenc\u0103 se a\u0219teapt\u0103 diverse func\u021bionalit\u0103\u021bi. \u00centre timp, Google a dat drumul la versiunea beta pentru GTM 2.0. Mai multe despre aceasta voi scrie \u00eentr-un articol separat c\u00e2nd va fi o versiune final\u0103, lucru care este a\u0219teptat s\u0103 se \u00eent\u00e2mple la \u00eenceputul lui 2015.<\/p>\n<p>Una dintre func\u021bionalit\u0103\u021bile principale din GTM este auto-event trackingul. Din versiunea 2.0, nu va mai fi nevoie de un tag separat pentru auto-event listeners \u0219i nu va mai trebui s\u0103 specific\u0103m c\u0103 event-ul este un click, deci lucrurile se \u00eembun\u0103t\u0103\u021besc. Dar indiferent de versiune, sunt des\u00a0\u00eent\u00e2lnite cazurile \u00een care auto-event tracking-ul nu\u00a0transmite date. Acest articol vine cu o rezolvare punctual\u0103 la una dintre principalele probleme \u00een lucrul cu GTM.<\/p>\n<h2>Cum func\u021bioneaz\u0103<\/h2>\n<p>Pentru a nu fi pus c\u00e2te un listener \u00een fiecare loc din pagin\u0103 pe care se poate da click, se pune unul singur \u00eentr-un document, iar event-ul este propagat p\u00e2n\u0103 la acesta. Concret, dac\u0103 listener-ul este la \u00eenceputul tag-ului &lt;body&gt;, iar event-ul are loc cu c\u00e2teva tag-uri mai jos \u00een document, el se propag\u0103 \u00een sus p\u00e2n\u0103 ajunge la listener. De aici intervin \u0219i problemele, pentru c\u0103 propagarea poate fi \u00eentrerupt\u0103 \u00een orice moment. jQuery este cea mai popular\u0103 libr\u0103rie de JavaScript, iar aceasta <strong>nu permite propagarea event-ului<\/strong>. Problema este des \u00eent\u00e2lnit\u0103 la dynamic HTML.<!--more--><\/p>\n<h2>Ce putem face<\/h2>\n<p>Varianta simpl\u0103 este s\u0103 \u00eei spunem programatorului web s\u0103 permit\u0103 propagarea event-ului, iar el va \u0219ti ce trebuie s\u0103 fac\u0103 \ud83d\ude42<\/p>\n<p>Pentru cine e interesat de detalii, ceea ce opre\u0219te propagarea este o linie de cod de genul:<\/p>\n<blockquote><p>e.stopPropagation();<\/p><\/blockquote>\n<p>\u00cen cadrul <em>function(e)<\/em>,\u00a0ea ar trebui \u00eenlocuit\u0103 cu:<\/p>\n<blockquote><p>e.preventDefault();<\/p><\/blockquote>\n<h2>Ce urmeaz\u0103 pentru GTM<\/h2>\n<p>GTM 2.0 schimb\u0103 multe dintre lucrurile cu care ne obi\u0219nuisem \u00een prima versiune, inclusiv terminologia, interfa\u021ba \u0219i modul de lucru, de aceea cred c\u0103 aceast\u0103 versiune merit\u0103 cel pu\u021bin un articol separat. O parte dintre probleme sunt rezolvate \u00een noua versiune. Altele, \u00eenc\u0103 sunt a\u0219teptate. \u00cen ultima categorie intr\u0103 sistemul de dependen\u021b\u0103 de taguri, taguri sincrone, data layer care s\u0103 poat\u0103 fi accesat \u0219i de al\u021bi furnizori sau directoare. E posibil ca unele dintre acestea s\u0103 apar\u0103 \u00een produs p\u00e2n\u0103 c\u00e2nd GTM 2.0 va fi gata.\u00a0Cert este c\u0103 GTM este un produs din ce \u00een ce mai interesant, c\u0103ruia o s\u0103 \u00eei urm\u0103resc cu interes evolu\u021bia.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Scriam \u00een articolul despre Google Tag Manager c\u0103 este un produs t\u00e2n\u0103r de la care \u00eenc\u0103 se a\u0219teapt\u0103 diverse func\u021bionalit\u0103\u021bi. \u00centre timp, Google a dat drumul la versiunea beta pentru GTM 2.0. Mai multe despre aceasta voi scrie \u00eentr-un articol separat c\u00e2nd va fi o versiune final\u0103, lucru care este a\u0219teptat s\u0103 se \u00eent\u00e2mple la [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1597,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[730,12],"tags":[731,106,717,718,719,485],"class_list":["post-1590","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-google-tag-manager-2","category-technical","tag-event-listener","tag-event-tracking","tag-google-tag-manager","tag-gtm","tag-tag-management","tag-tag-manager"],"_links":{"self":[{"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/posts\/1590","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/comments?post=1590"}],"version-history":[{"count":11,"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/posts\/1590\/revisions"}],"predecessor-version":[{"id":1992,"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/posts\/1590\/revisions\/1992"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/media\/1597"}],"wp:attachment":[{"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/media?parent=1590"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/categories?post=1590"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webanalyst.ro\/blog\/wp-json\/wp\/v2\/tags?post=1590"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}