Q: Contact Form 7 on_sent_ok not working within popup lightbox Hope you guys can help, I've been scratching my head for a couple of hours and not getting anywhere.
I've got three different forms all generated using Contact Form 7 on a Wordpress website.
I've successfully set-up working Goals in Google Analyics for two of them (tested and all working well), however the third form is sat within a lightbox (jingle.js) and the on_sent_ok: function just doesn't work.
I'm presuming it's some sort of javascript conflict, but it's beyond my knowledge and I'm struggling to figure it out.
Happy to post code snippets if needed.
Additional settings code in Contact Form 7
on_sent_ok: "ga('send', 'event', 'Cruise', 'sent');"

Analytics
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-70825582-1', 'auto');
  ga('send', 'pageview');

</script>

Then here's the actual html off the page
<div class="tingle-demo tingle-demo-tiny" style="display:none;z-index:999999999999;">
    <div class="enquiry">
        <h2 class="h-blue">Your cruise enquiry</h2>
        <div role="form" class="wpcf7" id="wpcf7-f6127-o1" lang="en-US" dir="ltr">
<div class="screen-reader-response"></div>
<form action="/experience-it-cruise/princess-12nt-asia-adventure/#wpcf7-f6127-o1" method="post" class="wpcf7-form" novalidate="novalidate">
<div style="display: none;">
<input type="hidden" name="_wpcf7" value="6127" />
<input type="hidden" name="_wpcf7_version" value="4.4.2" />
<input type="hidden" name="_wpcf7_locale" value="en_US" />
<input type="hidden" name="_wpcf7_unit_tag" value="wpcf7-f6127-o1" />
<input type="hidden" name="_wpnonce" value="dd2dd60e8a" />
</div>
<p>* Required field</p>
<div class="enquiry-left fl"><span class="wpcf7-form-control-wrap first-name"><input type="text" name="first-name" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" placeholder="First name*" /></span><span class="wpcf7-form-control-wrap username-wrap" style="display:none !important; visibility:hidden !important;"><input class="wpcf7-form-control wpcf7-text"  type="text" name="username" value="" size="40" tabindex="-1" /><span class="hp-message">Please leave this field empty.</span></span><br />
<span class="wpcf7-form-control-wrap email"><input type="email" name="email" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" aria-required="true" aria-invalid="false" placeholder="Email*" /></span>
<p class="no-p">Cabin type</p>
<p><span class="wpcf7-form-control-wrap cabin-type"><select name="cabin-type" class="wpcf7-form-control wpcf7-select wpcf7-validates-as-required" aria-required="true" aria-invalid="false"><option value="Inside">Inside</option><option value="Outside">Outside</option><option value="Ocean view">Ocean view</option><option value="Balcony">Balcony</option><option value="Suite">Suite</option></select></span></p></div>
<div class="enquiry-right fr"><span class="wpcf7-form-control-wrap surname"><input type="text" name="surname" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" placeholder="Surname*" /></span><br />
<span class="wpcf7-form-control-wrap tel"><input type="tel" name="tel" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-tel wpcf7-validates-as-required wpcf7-validates-as-tel" aria-required="true" aria-invalid="false" placeholder="Telephone*" /></span>
<p class="no-p">Preferred time for a call back</p>
<p><span class="wpcf7-form-control-wrap preferred-time"><select name="preferred-time" class="wpcf7-form-control wpcf7-select wpcf7-validates-as-required" aria-required="true" aria-invalid="false"><option value="9am - 11am">9am - 11am</option><option value="11am - 1pm">11am - 1pm</option><option value="1pm - 3pm">1pm - 3pm</option><option value="3pm - 6pm">3pm - 6pm</option><option value="After 6pm">After 6pm</option></select></span></p></div>
<div class="spacer"></div>
<p><input type="submit" value="Submit" class="wpcf7-form-control wpcf7-submit" /></p>
<div class="wpcf7-response-output wpcf7-display-none"></div></form></div>   </div>
</div>


<script type="text/javascript">

var modalTiny = new tingle.modal({
    onClose: function() {
        console.log('close tiny modal');
    }
});

modalTiny.init();

var btn = document.querySelector('.js-tingle-tiny');
btn.addEventListener('click', function(){
    modalTiny.setContent(document.querySelector('.tingle-demo-tiny').innerHTML);
    modalTiny.open();
});

