Which web page was my Dynamics 365 Marketing form submitted from?

Dynamics 365 Marketing forms can be hosted on landing pages on your Power Apps portals feature that runs on your Dynamics 365 Marketing instance. Alternatively you can also create or embed forms on your own external website that submit values back to Dynamics 365 Marketing.

This post will focus on embedded marketing forms. Specifically on how to use the same form on multiple pages in your website, and being able to know which web page the form was submitted from. For example you have a general enquiry form which is a request for more details, you embed this on multiple pages about various services you offer. It is valuable to know which service the enquiry is about, without relying on the customers message to tell you or having to create different forms for each page with a hidden field set to a default value. Yes it works but jeez that is messy!

UPDATE 27/02/2022 this post is completely useless, there is already a field on the marketing form submission called msdyncrm_pageurl that is automatically populated. Yay for you, but embarrassing for me!

NOTE: you will need to ensure the website (domain) where you are embedding the form is authenticated otherwise you might hit some trouble later on.

Create an embedded form

Create the form as usual for a marketing form, its the same process to begin whether its embedded or hosted on a Marketing Page. Make sure you add a hidden field called ‘Website URL’ which will capture a text value. When your design is complete - go live. Once live switch the the ‘Form Hosting’ tab

Create a new ‘Form Page’ (naming it something useful is highly recommended but entirely optional), then Save & Close

Open the ‘Form Page’ record, ensure the ‘External Hosting Format’ is ‘I want to host it as a script’. Copy that text into a notepad. This is _YOUR_FORM_HOSTING_SCRIPT_. This could be pasted directly into your web page and hosted with no issues, but the website URL field would remain blank on submission, that magic bit is next.

Find the form field ID

First we need to find the ID of the marketing field we want to set the value of. Open your marketing form and switch to Edit mode. Open the HTML tab

Now we need to find the ID of the field we want to populate by searching for the field name (ctrl+f). The ID will be within the <label></label> tags inside the for=”” copy that onto your notepad where you have the form embed snippet, this is _YOUR_FIELD_ID_ e.g. 2d77477c-744a-ec14-8c60-22224811c1a2

Populate Website URL on form submit

Now we ‘simply’ combine the form hosting script with the form field ID and a sprinkle of JavaScript. Replace the_YOUR_FORM_HOSTING_SCRIPT_ and _YOUR_FIELD_ID_ with the relevant values. Drop that into your website where you want the form and hello website URL in the form submission!

_YOUR_FORM_HOSTING_SCRIPT_

<div style="display:none">
<script>
MsCrmMkt.MsCrmFormLoader.on("afterFormLoad", 
function() {
  document.getElementById("_YOUR_FIELD_ID_").value = window.location.href;
});
</script></div>

Full credits to my intelligent developer friend George Doubinski for showing me how on earth to do this, apparently these docs make sense to developers? It’s wizardry to me. Obviously you can do heaps more than just pass back a website URL but that is enough for one day!

Links
Official Microsoft instructions here on a simple embedded form scenario -> https://docs.microsoft.com/en-us/dynamics365/marketing/embed-forms#create-an-embedded-form
Further JavaScript for embedded form extensibility options documentation -> https://docs.microsoft.com/en-us/dynamics365/marketing/developer/marketing-form-client-side-extensibility