javascript - Fire iframe and submit form on the same button press -
spend few hours on 1 , couldn't find solution here goes:
i having tracking pixel in iframe. on button click want firstly fire tracking pixel , submit form. have page in middle fire pixel , pass form in project have no access backend , cannot make intermediate page. have tried add onclick='firepixel()' button assuming submit form , load iframe not. have tried create 2nd function , add callback in way: onclick(firepixel(submitform)) having submitform callback - no luck.
p.s have tried have button outside of form (as seen below) inside form - no luck.
not sure what's best practice here? don't mind if iframe being fired in background - user never seeing - it's tracking pixel.
please find code (which not work) below:
<iframe id='conversioniframe' data-src="testframe.html" src="about:blank" width='100px' height="100px"> <div class='panel clearfix'> <form id="options-go-to-insurer" action="/life/buy/" method="post"> <!-- form stuff --> </form> <button id="conversionbutton" class="button primary expand apply-button" onclick="conversionfunction(submitform())"><b>apply now</b></button> </div> <!-- stop --> <script> function conversionfunction(callback) { var iframe = $("#conversioniframe"); iframe.attr("src", iframe.data("src")); callback(); } function submitform() { document.getelementbyid("options-go-to-insurer").submit(); } </script>
note type="button"
mandatory not submit form
if page , iframe code same domain, return
<script>parent.document.getelementbyid("options-go-to-insurer").submit()</script>
from testiframe.html
if not, try
$(function() { $("#conversionbutton").on("click", function() { // when button clicked var $tracker = $("#conversioniframe"); $tracker.attr("src", $tracker.data("src")); // load page }); $("#conversioniframe").on("load", function() { // when page has loaded $("#options-go-to-insurer").submit(); // submit form }); });
<iframe id='conversioniframe' data-src="testframe.html" src="about:blank" width='100px' height="100px"> <div class='panel clearfix'> <form id="options-go-to-insurer" action="/life/buy/" method="post"> <!-- form stuff --> </form> <button type="button" id="conversionbutton" class="button primary expand apply-button"><b>apply now</b> </button> </div>
Comments
Post a Comment