File Click Capture | XM Community
Skip to main content
Solved

File Click Capture


Forum|alt.badge.img+3

I am trying to capture whether or not a file is clicked on in Qualtrics. The embedded data shows up blank no matter what.  I’m using the following code.  I’ve also tried removing the JS from “setEmbeddedData.” I’m not using simple layout. 

 

Qualtrics.SurveyEngine.addOnload(function() {
    // Get the link element by its ID for File 1
    var file1Link = document.getElementById('H1');

    // Add a click event listener to the link for File 1
    file1Link.addEventListener('click', function() {
        // Set the embedded data field to indicate File 1 was opened
        Qualtrics.SurveyEngine.setJSEmbeddedData('H1N', 1);
    });

    // Get the link element by its ID for File 2
    var file2Link = document.getElementById('H2');

    // Add a click event listener to the link for File 2
    file2Link.addEventListener('click', function() {
        // Set the embedded data field to indicate File 2 was opened
        Qualtrics.SurveyEngine.setJSEmbeddedData('H2N', 1);
    });

     // Get the link element by its ID for File 3
    var file3Link = document.getElementById('H3');

    // Add a click event listener to the link for File 2
    file3Link.addEventListener('click', function() {
        // Set the embedded data field to indicate File 2 was opened
        Qualtrics.SurveyEngine.setJSEmbeddedData('H3N', 1);
    });
});

 

Any help is greatly appreciated! Thank you! 

Best answer by Deepak

Try below code, you can change the embedded data name
 

Qualtrics.SurveyEngine.addOnload(function() {

    var fileLinks = document.querySelectorAll('a[href^="https://[brandname].ca1.qualtrics.com/CP/File.php?F="]');


    fileLinks.forEach(function(link) {
        link.addEventListener('click', function() {

            var fileId = link.getAttribute('href').split('=')[1];


            console.log("File clicked: ", fileId);


            Qualtrics.SurveyEngine.setEmbeddedData(fileId + 'N', 1);
        });
    });
});

 

View original

5 replies

Deepak
QPN Level 8 ●●●●●●●●
Forum|alt.badge.img+44
  • 1553 replies
  • Answer
  • April 12, 2024

Try below code, you can change the embedded data name
 

Qualtrics.SurveyEngine.addOnload(function() {

    var fileLinks = document.querySelectorAll('a[href^="https://[brandname].ca1.qualtrics.com/CP/File.php?F="]');


    fileLinks.forEach(function(link) {
        link.addEventListener('click', function() {

            var fileId = link.getAttribute('href').split('=')[1];


            console.log("File clicked: ", fileId);


            Qualtrics.SurveyEngine.setEmbeddedData(fileId + 'N', 1);
        });
    });
});

 


Forum|alt.badge.img+3
  • Author
  • Level 2 ●●
  • 14 replies
  • April 12, 2024

This worked great for one file. Thank you very much! However, I can only get it to work for 1 file. When I tried to modify for multiple files, it still only captured the first. 

 

Here is what I changed: 

 

Qualtrics.SurveyEngine.addOnload(function() {

    function trackFileClick(link, embeddedVariable) {
        link.addEventListener('click', function(event) {
            var fileId = link.getAttribute('href').split('=')[1];
            console.log("File clicked: ", fileId);
            Qualtrics.SurveyEngine.setEmbeddedData(embeddedVariable, 1);
        });
    }

    // File 1
    var fileLinks1 = document.querySelectorAll('a[href^="https://wright.ca1.qualtrics.com/CP/File.php?F=F_1"]');
    fileLinks1.forEach(function(link) {
        trackFileClick(link, 'N1');
    });

    // File 2
    var fileLinks2 = document.querySelectorAll('a[href^="wright.ca1.qualtrics.com/CP/File.php?F=F_6L3ezPl6mEhAyi2"]');
    fileLinks2.forEach(function(link) {
        trackFileClick(link, 'N2');
    });

    // File 3
    var fileLinks3 = document.querySelectorAll('a[href^="wright.ca1.qualtrics.com/CP/File.php?F=F_50fibe2qPoloTtQ"]');
    fileLinks3.forEach(function(link) {
        trackFileClick(link, 'N3');
    });

    // File 4
    var fileLinks4 = document.querySelectorAll('a[href^="wright.ca1.qualtrics.com/CP/File.php?F=F_bgfCTggTxM1uMvQ"]');
    fileLinks4.forEach(function(link) {
        trackFileClick(link, 'N3');
    });

});

 

Do you see any errors? I am not a programmer so I really appreciate it! 


Deepak
QPN Level 8 ●●●●●●●●
Forum|alt.badge.img+44
  • 1553 replies
  • April 12, 2024

@AnnaM89 

Qualtrics.SurveyEngine.addOnload(function() {

    function trackFileClick(link, embeddedVariable) {
        link.addEventListener('click', function(event) {
            var fileId = link.getAttribute('href').split('=')[1];
            console.log("File clicked: ", fileId);
            Qualtrics.SurveyEngine.setEmbeddedData(embeddedVariable, 1);
        });
    }

    // File 1
    var fileLinks1 = document.querySelectorAll('a[href^="https://wright.ca1.qualtrics.com/CP/File.php?F=F_1"]');
    fileLinks1.forEach(function(link) {
        trackFileClick(link, 'N1');
    });

    // File 2
    var fileLinks2 = document.querySelectorAll('a[href^="wright.ca1.qualtrics.com/CP/File.php?F=F_6L3ezPl6mEhAyi2"]');
    fileLinks2.forEach(function(link) {
        trackFileClick(link, 'N2');
    });

    // File 3
    var fileLinks3 = document.querySelectorAll('a[href^="wright.ca1.qualtrics.com/CP/File.php?F=F_50fibe2qPoloTtQ"]');
    fileLinks3.forEach(function(link) {
        trackFileClick(link, 'N3');
    });

    // File 4
    var fileLinks4 = document.querySelectorAll('a[href^="wright.ca1.qualtrics.com/CP/File.php?F=F_bgfCTggTxM1uMvQ"]');
    fileLinks4.forEach(function(link) {
        trackFileClick(link, 'N4');
    });

});

You are setting the same embedded data variable ('N3') for both File 3 and File 4. If you intend to track them separately, you should use different embedded data variables.


Forum|alt.badge.img+3
  • Author
  • Level 2 ●●
  • 14 replies
  • April 12, 2024

Thank you! Fixed. I was also missing the https:// lol 🙄

 

This worked beautifully. Can’t thank you enough! 


Deepak
QPN Level 8 ●●●●●●●●
Forum|alt.badge.img+44
  • 1553 replies
  • April 12, 2024

Glad it worked!


Leave a Reply