Pass a value from one form to another via querystring

The problem

I have a form in a footer than asks users to enter their email address to allow them to sign up to a newsletter. This form needs to pass this email address to another page within the website which will have an Umbraco Form on it. 

The Umbraco Form will have an email field on it and the email address that the user entered on the original form should be prepopulated. 

The solution

The form that takes the initial email address is a simple form which looks like this: 

 <form class="signup-form" action="@Model.SubscriptionLink.Url">
                        <div class="field_wrap __text">
                            <div class="label_wrap sronly">
                                <label for="inputEmailRequired">
                                    Email
                                </label>
                            </div>
                            <div class="input_wrap">
                                <input type="text" name="email" id="inputEmailRequired" value="" class="" required=""
                                   aria-required="true" placeholder="Email">
                            </div>
                        </div>
                       
                        <div class="submit_wrap">
                            <button type="submit" class="button __white __outline __icon">@Umbraco.GetDictionaryValue("Subscription.Subscribe", "Subscribe")</button>
                        </div>
                    </form>

The form has a couple of CMS'd parts, for example, the action takes the URL from a Url Picker in the backoffice - this is the page that will have the Umbraco Form on it and I have also used a Dictionary value for the subscribe button but other than that, it's a pretty straight forward form. 

What happens when the user clicks subscribe is that the URL will add a querystring to the end of the url, so it will look like this : 

https://mywebsiteaddress.com/myPageWithAFormOnIt/?email=my@email.com

Now, how do I get the querystring value of my@email.com in to the Umbraco Form? Well, this is where a quick Google helped and it brought up a video by Paul Seal

On the form, I need to have a field that will accept this value, so a textstring is perfect for this and I then set a default value on that textstring to [@email] 

You need to remember the square brackets and the value should match the name of the querystring. 
When the first form now redirects to the page with the form on it, the form reads the querystring and enters the email address in to the email field on my form. 

Published on: 22 February 2023