Expand my Community achievements bar.

Applications for the 2024 Adobe Target Community Mentorship Program are open! Click to the right to learn more about participating as either an Aspirant, to professionally level up with a new Certification, or as a Mentor, to share your Adobe Target expertise and inspire through your leadership! Submit your application today.
SOLVED

Backbone component functionalities are not working fine in Preview Mode, when target is enabled

Avatar

Level 3

Hi team, 

After enabling the Target in our AEM environment, our Backbone created component functionalities (like Click events...) stopped working. 

Then, in one of your forum replies, it is mentioned to invoke TNT.createGlobalMbox() method after our backbone file.

URLhttp://help-forums.adobe.com/content/adobeforums/en/target-forum/adobe-target.topic.html/forum__r90w...

We've included the below code at the bottom of our page:

$(document).ready(function(){
         TNT.createGlobalMbox();
});

 

Issue:

  • Our Backbone components are working occasionally. Sometimes, it is working fine. Sometimes, it is not working.
  • The same page, when target mode is disabled, then our components are working fine. 
  • The components are rendered correctly, but events are not working fine. 

Please help to resolve this issue, as this issue is blocking our work.

1 Accepted Solution

Avatar

Correct answer by
Employee Advisor

Hi Shikha,

It sounds like you have a Single Page Application, hence the use of Backbone.  Single Page Applications are much more complex--mostly because of the flicker-handling needed as per Parit's reply.  We developed an new library with SPAs in mind called at.js and this is what we recommend for SPA implementations (https://marketing.adobe.com/resources/help/en_US/target/ov2/c_target-atjs-implementation.html).  Please note that the TNT.createGlobalMbox() function is not part of at.js and mbox calls on things like view changes in your backbone app will need to be called differently.  Again, SPA implementations are a little bit trickier and I echo Parit's suggestion of working closely with your Adobe Target consultant on this project.

Daniel

View solution in original post

2 Replies

Avatar

Level 10

 Hi Shikha,

You are creating the global mbox at the bottom of the page using their own custom code. I don't think that's the best option. You will get flickering because of this

 Also, it is not clear what you mean by 'backbone'. Would advice you to reach out to your point of contact in Adobe Target consulting.

Thanks & Regards

Parit Mittal

Avatar

Correct answer by
Employee Advisor

Hi Shikha,

It sounds like you have a Single Page Application, hence the use of Backbone.  Single Page Applications are much more complex--mostly because of the flicker-handling needed as per Parit's reply.  We developed an new library with SPAs in mind called at.js and this is what we recommend for SPA implementations (https://marketing.adobe.com/resources/help/en_US/target/ov2/c_target-atjs-implementation.html).  Please note that the TNT.createGlobalMbox() function is not part of at.js and mbox calls on things like view changes in your backbone app will need to be called differently.  Again, SPA implementations are a little bit trickier and I echo Parit's suggestion of working closely with your Adobe Target consultant on this project.

Daniel