title: Google Tag Manager tracking drop down menu/list (Web app built in R-Shiny)
body: <p>I have a R Shiny app that I have connected to Google Analytics using Google Tag Manager (R Shiny app means AJAX website). I am currently tracking the standard stuff like PageViews, and have set up a tag to track which Tab a user clicks on (Using Click Element).</p>
  
  <p>In most tabs, I have a drop-down menu/list (can be seen in the picture). When clicking on this list to select/change the input, the click element does not fire. So clicking does not work here. </p>
  
  <p>In the same picture, I have included the source html code. I highlighted what I think is important. The default input is "Age Group (Discrete)." The "option value=" and "selected" changes the input (changed to "Pyramid (Discrete)"). And it also changes in the div class="item" data-value=..." line. </p>
  
  <p>I do not know how to capture when a user changes the input using Google Tag Manager. I am however able to successfully track this if I put this GA code in my JavaScript file. </p>
  
  <pre><code>$(document).on('change', 'select', function(e) {
    ga('send', 'event', 'widget', 'select data', $(e.currentTarget).val());
  });
  </code></pre>
  
  <p>But the above only works if I also have this included:</p>
  
  <pre><code>ga('create', 'UA-######', 'auto');
  ga('send', 'pageview');
  </code></pre>
  
  <p>Which means it is double-counting pageviews (tracking page-views on GTM and the GA code above). </p>
  
  <p>I prefer to track what I want using just GTM. Any help would be appreciated. Let me know if the image is hard to see (May need to zoom in). Thanks</p>
  
  <p><a href="https://i.stack.imgur.com/tmefr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/tmefr.png" alt="drop-down"></a>
  <a href="https://i.stack.imgur.com/vFTEB.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vFTEB.png" alt="sourcecode"></a></p>