3 Replies Latest reply on May 29, 2017 2:09 AM by Maciek La

    How do you have the API respond to events and pass only one value?

    Stephen Hellyar



      I just need the API to pass the name of the selected mark so that I can complete this sentence in my TWIG-HTML.


      {{ entry.name }}  -- where "name" is the value of the Product Name dimension selected in Tableau. 



      I used the Respond to Events KB article here to get the basic functionality of reporting the selected marks.   But, I only need the one value for the field name (aka the dimension) "Program Name".   This is the value I want to pass to "name" in {{ entry.name }}, which will allow me to pull up additional information outside of Tableau for the selected mark. 


      Here's the code from the tutorial that I used (and copy/paste created a lot of extra lines that don't exist in the original)  Of course I swiped out the default url for my own. 

          <script type="text/javascript">
              var viz;
              function initViz() {
                  var containerDiv = document.getElementById("vizContainer"),
                      url = "http://10ax.online.tableau.com/t/i2insights10/views/Budget18-OPA1-Test/Dashboard1",
                      options = {
                          "Academic Year": "",
                          hideTabs: true,
                          onFirstInteractive: function () {
                  viz = new tableau.Viz(containerDiv, url, options);
              function listenToMarksSelection() {
                  viz.addEventListener(tableau.TableauEventName.MARKS_SELECTION, onMarksSelection);
              function onMarksSelection(marksEvent) {
                  return marksEvent.getMarksAsync().then(reportSelectedMarks);
              function reportSelectedMarks(marks) {
                  var html = ""; 
                  for (var markIndex = 0; markIndex < marks.length; markIndex++) {
                      var pairs = marks[markIndex].getPairs();
                      html += "<b>Mark " + markIndex + ":</b><ul>";
                      for (var pairIndex = 0; pairIndex < pairs.length; pairIndex++) {
                          var pair = pairs[pairIndex];
                          html += "<li><b>Field Name:</b> " + pair.fieldName;
                          html += "<br/><b>Value:</b> " + pair.formattedValue + "</li>";
                      html += "</ul>";
                  var infoDiv = document.getElementById('markDetails');
                  infoDiv.innerHTML = html;