Thank You message not appearing in after Form submission in iFrame

[Anonymous]

I've crated a landing page with a Form inside of it.

I am showing the landing page+form via an iFrame in a popup .

The form shows up correctly and submits properly, but the Thank You message is never shown (still has the visibility=true inline style).

I have 3 layers on my landing page.

1. Header Graphic

2. Form

3. Thank You Message code:

<script src="//app-ab13.marketo.com/js/forms2/js/forms2.min.js" type="text/javascript"></script>

<script>

MktoForms2.whenReady(function (form){

//Add an onSuccess handler

  form.onSuccess(function(values, followUpUrl){

   //get the form's jQuery element and hide it

   form.getFormElem().hide();

   document.getElementById('confirmform').style.visibility = 'visible';

   //return false to prevent the submission handler from taking the lead to the follow up url.

   return false;

});

});

</script>

<div id="confirmform" style="visibility:hidden;"><p><strong>Thank you. Check your email for details on your request.</strong></p></div>

Any clue as to why the Thank You message never appears?

[SanfordWhiteman]

Please post a link to your LP.

[Anonymous]

The code should work, so what about some troubleshooting like:

1. Are you sure it is the only div with that ID? You cannot repeat IDs on HTML elements, so just making sure.
2. Is the <div id="confirmform"> inside the LP you created? JavaScript cannot trigger for elements outside the iFrame
3. Have you tried adding that code to the Embed snipped code:

<form id="mktoForm_xxxx"></form>
<script>
MktoForms2.loadForm("//xxx.marketo.com", "xxxx", "xxxx" , function( form ){
                    form.onSuccess(function() {
                  document.getElementById('confirmform').style.visibility = 'visible';
                     document.getElementById('mktoForm_xxxx').style.visibility = 'hidden';
                        return false;
                    });
            });
</script>
<div id="confirmform" style="visibility:hidden;"><p><strong>Thank you. Check your email for details on your request.</strong></p></div>

[Joe_Barrett]

This question seems "unanswered" still, but you provided an excellent script that works for pages with 2 or more forms on the same page. Thanks! But I prefer,

 .style.display = 'none'; 

to clear up the space that was used by the form.