JQM & SPA support? | Community
Skip to main content
sunyzc
sunyzc
Level 2
October 16, 2015
Solved

JQM & SPA support?

  • October 16, 2015
  • 10 replies
  • 3507 views

Hi all,

 

1. Does Omniture support jQueryMobile and Single Page Application, and how to do it?

I already have omniture and implemented the trackAction, trackState, and tracktime in iOS native app.

For web SPA, I can only do the trackAction, but to track state, In theory I should put some javascript code snippet on each apge I want to track, but there is only one page for the whole web app. How to do it?

 

2. Sometimes the request for trackAction will be canceled, and I can't get the specific reasons(This issue has been updated but still haven't got an solution).

We have a link like below:

<a href="mailto:test@gmail.com&subject=test" onClick="var s=s_gi('wfbmobileappdev'); s.linkTrackVars='contextData.wfi.shareType,contextData.wfi.shareEvent'; s.contextData['wfi.shareType'] = 'Test'; s.contextData['wfi.shareEvent'] = '1'; s.tl(this,'o','Sharing Action')">Test</a>

we invoke the email client by using the syntax href="mailto:...", but this will cause to cancel to send the trackAction data and we haven't known the specific reasons. You can find there are 2 request when clicking the menu item 'Article Feedback', the first request is used to send data to omniture server but it's canceled:

[img]2014-02-12_142618.png[/img]

Once the request is canceled, it will not send any request again even we do anything.

But if I modify the href="gmmmailto:..." into href="#" for testing, there will be only the measurement request and the Status is 200(OK).

[img]2014-02-12_143422.png[/img]

 

[update-02/20/2014]

Thank Alexis Cazes, I've got an progress for the 2nd issue. There are 2 reasons:

1. I don't know why there are different between putting the functional code into onClick attribute and encapsulating a new method. It can't work by putting the code into OnClick attribute, but work well by encapsulating a new method.

2. I set some attributes(s.trackDownloadLinks, s.trackExternalLinks, s.trackInlineStats) false to prevent the default track link before(To know why to do this, please refer the 3rd issue). So if I reset these attributes true, and the image request will be sent successfully, but it will send request when I click any link and this is not what I want to see. So I get a new problem below:

 

3. How to  prevent the default click event monitor in AppMeasurement.js?

When I include the AppMeasurement.js & VisitorAPI.js into the web app, no matter what link to click, it still send an image request to omniture server and this is not what I want to see, I just want track only one of them by manual. I thought the solution is to set some attributes(s.trackDownloadLinks, s.trackExternalLinks, s.trackInlineStats) false. But If I do this, it will re-back to the 2nd issue...

PS: I've modified these 2 files according to the JavaScript Implementation Steps.

 

[update-03/04/2014]

Thank André, I've got the solution to prevent the default click event monitor according to your advice. I'm using s.linkInternalFilters="javascript:,http" to prevent all the click event, document.domain is not enough in our case, and it will also prevent the event for sending email.

So the issue 2# and 3# have been fixed.

Thanks Alexis Cazes and André again.

 

Could anyone can help me to resolve the first issue? Thanks very much.

 

 

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Best answer by sunyzc

    Thank André,

    I've got the solution to prevent the default click event monitor according to your advice. I'm using s.linkInternalFilters="javascript:,http" to prevent all the click event, and document.domain is not enough in our case.

    10 replies

    Alexis_Cazes_
    Alexis_Cazes_
    Level 10
    October 16, 2015

    Hi,

     

    Are you using the legacy javascript (H. version of the code) or the new Appmeasurement library ? 

    The image request might be failing because the image request does not have enough time to be sent before the next page or pop up window is opened.

    Either use a timer to wait 500 ms before opening the new window or use the code here : https://microsite.omniture.com/t2/help/en_US/sc/implement/index.html#The_stl_Function__Link_Tracking

    For the timer you might want to do the following:

    1.prevent default

    2.send adobe image request

    3.wait 500 ms (I usually use 700ms)

    4.Open or do action

     

    Best regards.

     

    Alexis Cazes

    A
    Adobe Employee
    anurbanAdobe Employee
    Adobe Employee
    October 16, 2015

    Hi,

    you may check our internal url filters variable.

    I tend to use s.linkInternalFilters="javascript:,"+document.domain

    If this variable does not contain your current domain there will be an extra onClick event handler.

    If this does not work - start putting console.log()'s into the function s_doPlugins.

    Good luck!

    André

      sunyzc
      sunyzcAuthorAccepted solution
      Level 2
      October 16, 2015

      Thank André,

      I've got the solution to prevent the default click event monitor according to your advice. I'm using s.linkInternalFilters="javascript:,http" to prevent all the click event, and document.domain is not enough in our case.

      sunyzc
      sunyzcAuthor
      Level 2
      October 16, 2015

      Thanks Alexis Cazes,

          I'm using the new Appmeasurement library(1.2.2), 

          For the timer, Although it's an effective solution, I think it shouldn't implemente the analytics by sacrificing the UX.

          For the either way, is there anything difference between my code and that?

      Anyway, thank your suggestion.

      Alexis_Cazes_
      Alexis_Cazes_
      Level 10
      October 16, 2015

      Try the following :

       

      <a href="mailto:test@gmail.com&subject=test" onClick="var s=s_gi('wfbmobileappdev'); s.linkTrackVars='contextData.wfi.shareType,contextData.wfi.shareEvent'; s.contextData['wfi.shareType'] = 'Test'; s.contextData['wfi.shareEvent'] = '1'; s.tl(this,'o','Sharing Action',null,'navigate');return false">Test</a>

      Let me know if it works

      sunyzc
      sunyzcAuthor
      Level 2
      October 16, 2015

      Thanks Alexis Cazes,

          I've modified the tag a according your code, but it seems like there are no any change and still be canceled. Even I put the "alert(1)" after the method s.tl(), then to click the link and it pupop an alert as expected, the status is still pending untill I click the OK button on the alert dialog.

      Alexis_Cazes_
      Alexis_Cazes_
      Level 10
      October 16, 2015

      I tested the code a bit more and was able to make it work by doing the following :

      In the html page I put : 

      <a href="mailto:test@gmail.com&subject=test" onClick="trackClickInteraction('Sharing Action')">Test</a>

      And in the Appmeasurement.js file I put the following function just below the s_doPlugins() function :

      function trackClickInteraction(name){
      var s=s_gi('wfbmobileappdev'); 
      s.linkTrackVars='contextData.wfi.shareType,contextData.wfi.shareEvent'; 
      s.contextData['wfi.shareType'] = 'Test'; s.contextData['wfi.shareEvent'] = '1'; 
      s.tl(true,'o',name,null,'navigate');
      }

      The image request is sent successfully.

      Please let me know if it works.

        sunyzc
        sunyzcAuthor
        Level 2
        October 16, 2015

        Thank Alexis Cazes very much,

        I find there is no difference between yours and mine. I also tried your code and the image request is still canceled, unless I put "#" on the href attribute.

        I've found why it's canceled but still can't get the solution. Because I set some attributes(s.trackDownloadLinks, s.trackExternalLinks, s.trackInlineStats) false to prevent the default track link. So if I reset these attributes true, and the image request will be sent successfully, but it will send request when I click any link and this is not what I want to see. So I get a new problem...

        Besides, I don't know why there are different between putting the functional code into onClick attribute and encapsulating a new method. It can't work by putting the code into OnClick attribute, but work well by encapsulating a new method. Anyway, I've known what's the cause for the 2nd issue.

        Alexis_Cazes_
        Alexis_Cazes_
        Level 10
        October 16, 2015

        You could also try the following :

        <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script language="JavaScript" type="text/javascript" src="VisitorAPI.js"></script>             <script language="JavaScript" type="text/javascript" src="AppMeasurement.js"></script>     <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>     <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script> </head> <body> <script> $(document).ready(function(){ $("a").click(function(event) { event.preventDefault(); var s=s_gi('edirocks'); s.linkTrackVars='contextData.wfi.shareType,contextData.wfi.shareEvent'; s.contextData['wfi.shareType'] = 'Test'; s.contextData['wfi.shareEvent'] = '1'; s.tl(true,'o',name,null,'navigate'); var value = $(this).attr("href"); setTimeout(function(){window.location=value},700);         }); }); </script> <script language="JavaScript" type="text/javascript"><!-- /* Get the AppMeasurement instance */ /*var s=s_gi("INSERT-RSID-HERE")*/ /* You may give each page an identifying name, server, and channel on the next lines. */ s.pageName="New appmeasurement test" var s_code=s.t();if(s_code)document.write(s_code)//--></script> <a href="mailto:test@gmail.com&subject=test">Test</a> </body> </html>
        sunyzc
        sunyzcAuthor
        Level 2
        October 16, 2015

        Yes, It's a available solution and it will delay 700ms.

        But,

        1. It will sacrifice a little UX.
        2. If the network is not well, 700ms is not enough and still be canceled. Once canceled, it won't request any more when I click next time.

        Thank you.

        Terms & ConditionsAccessibility statement

        Loading footer...