Skip navigation
All Places > Support > Documents
Log in to create and rate content, and to follow, bookmark, and share content with other members.

Dynamic State and Province for US and Canada in forms

Document created by 08b21bd4b65c4441fd72920f489da6afa097beae on Jan 2, 2015Last modified by b314881cf2c6f34ff6c1ea07c3f07a199f877a57 on Sep 27, 2017
Version 5Show Document
  • View in full screen mode

Note: Marketo Technical Support is not set up to assist with troubleshooting custom JavaScript. If you need to modify JavaScript, please ensure that you have access to an experienced JavaScript developer.

 

These instructions show you how to dynamically show the State field and make it required when a user selects United States or Canada as the country in a form.

 

Note: This solution will not work with progressive profiling enabled. We will work to improve it in the future

 

To use this, you'll need a form that has both State and Country field like this. You can use a form that already has those fields, add them to an existing form, or create a new form and add those fields:

 

rtaImage.png

Click on the Country field and change the following in the Field Specific section for this field:

 

  1. Download the attached Zip file. Open "basicCountries.rtf"
  2. Change its Type to a Select box
  3. Check the Is Required box
  4. Copy the contents of basicCountries.rtf and paste into the Value List field:

Note: This will submit abbreviated state and country names for US states and Canadian provinces. If you want support for Australia too, the values and javascript you need are later in this article. Also if you want the full country and state names to be submitted, the values and javascript you need is also later in this article.

When done, it will look like this:

rtaImage (1).png

Now click on the State field. Change the following in the Field Specific section for this field:

 

  1. Download the attached Zip file. Open "basicStates.rtf"
  2. Change its Input Type to Select (which is the default for this field)
  3. Check the Is Required box
  4. Paste the contents of basicStates.rtf into the Value List field:

 

When done, it will look like this:

rtaImage (2).png

Your form edits are now complete. Go to a landing page with that form (or add that form to a landing page). Then drag in a Custom HTML box and paste in the following code:

 

<script type="text/javascript" src="/js/public/jquery-latest.min.js"></script>
<script type="text/javascript" src="/js/public/stateCountry.js"></script>

 

Approve and view the landing page. Your form will look like this, below. Test it by changing the Country to United States or Canada, the State field will appear automatically. When you change to any other country, the State field will disappear:

rtaImage (3).png

 

Australian provinces

 

If you need Australian provinces as well, use the contents of basicStatesPlusAustralia.rtf for the values in the State field.

Then download the attached zip file, extract "stateCountryPlusAustralia.js", upload it to your Marketo account, and include this Javascript instead of the code presented earlier:

<script type="text/javascript" src="/js/public/jquery-latest.min.js"></script>
<script type="text/javascript" src="[url to your uploaded JS file]"></script>

Full country and state names

If you want to submit the full name of the country instead of the abbreviated version, use the following lists of states and countries as well as the javascript below, provided by Ryan Vong.

 

Download the attached Zip file, extract "fullStateCountry.js", upload it to Marketo, and include this Javascript in your landing pages instead of the code presented above:

 

<script type="text/javascript" src="/js/public/jquery-latest.min.js"></script>
<script type="text/javascript" src="[url to your uploaded JS file]"></script>

Also in the Zip file, use the "states.rft" list for the values of the state field and the "countries.rtf" file for the country values in your forms.

Attachments

Outcomes