Form reply, in-page w/html etc.

[Charles_Sander1]

We've used a simple javascript on our landing pages that, if turned on, keeps a user on the landing page and displays a message.

The message itself is just a mktoString metatag in the landing page template, so that we can change the message.

We've run into a few occasions, where we wanted more than just a message - html, a link. a way to reload the page. But I don't believe those are feasible using just a mktoString Token, which I don't believe can accept html, and wouldn't be efficient if it could I suspect.

Any suggestions? How have other people solved this problem?

For reference, if relevant. the javascript:

<script>

if (${formsendrule}) {

MktoForms2.whenReady(function (form){

  form.onSuccess(function(values, followUpUrl){

    form.getFormElem().hide();

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

     return false;

  });

});

};

</script>

Metatag:

<meta class="mktoString" id="formmessage" mktoName="Form fill reply" default="Thank you! We will be in touch soon.">

Metatag location:

<div id="confirmform" style="visibility:hidden;z-index:15;width:100%;height:100%;margin-top:10px;padding:10px;"><p><strong>${formmessage}</strong></p></div>

[Charles_Sander1 · Accepted solution]

hmmm. this might have been the simplest oversight ever.. Forgot there was an attribute: allowHtml="true"

Gonna try that, and see if it solves my needs.

[Gerard_Donnell4]

This might work, its what I do. In the MarketoThankYou div you can add whatever you want.

<script src="//app-xxxx.marketo.com/js/forms2/js/forms2.js"></script>

  <form id="mktoForm_1234"></form>

  <script>MktoForms2.loadForm("//app-xxxxx.marketo.com", "313-HPA-913", 1234, function(form){

  //Add an onSuccess handler

  form.onSuccess(function(values, followUpUrl){

  dataLayer.push(

  {event: 'mktoLead'}

  );

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

  form.getFormElem().hide();

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

  $("#MarketoThankYou").show();

  return false;

  });

  });</script>

  <div id="MarketoThankYou" style="display: none;">

  <p>Thank you. Your message has been received. Someone will contact you shortly.</p>

  </div>

[Gerard_Donnell4]

Just to confirm what this does is when a lead fills in a form it hides the form and shows the contents of the div.

[Charles_Sander1]

Yeah - looks essentially like it's doing the same as what we used, except I filled that hidden div with a token, so the team could edit it in the guided landing page. Seems I've solved my problem though. After I added allowHtml="true" to the metatag for my mktoString in my template, I was able to most of what I needed.