MktoForms2: Override Field Order | Community
Skip to main content
Kelly_Sheetz
Level 2
September 8, 2017
Question

MktoForms2: Override Field Order

  • September 8, 2017
  • 2 replies
  • 6464 views

Hi Stanford,

This is in reference to this thread: Reposition Fields in a Marketo Form

How does your code work with progressive profiling? Specifically, in reference to this part of the js:

var fieldOrder = ["FirstName", "ArchiveMarketoLastDT__c", "Email", "LastName"];

For example, we reveal 6 progressive profiling fields at a time and therefore have no way of knowing which fields will be exposed per form fill for a particular lead. Do I just order all possible fields, with the ones I want at the end?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

2 replies

SanfordWhiteman
Level 10
September 8, 2017

Do I just order all possible fields, with the ones I want at the end?

Yes. If a field doesn't exist on the form, it's skipped automatically.

Kelly_Sheetz
Level 2
September 8, 2017

Thanks!

I am still not able to get the zOPComplianceOptin field to move to the bottom. This field has a visibility rule set for when Country = Canada

Here is what I used via your code:

HTML:

<form id="mktoForm_9783" class="mktoForm"></form>

<script id="mktoForms2Lib" src="//app-sj06.marketo.com/js/forms2/js/forms2.min.js"></script>

<script id="teknklFormsPlus-0.2.1-tag" src="//codepen.io/figureone/pen/85e4921f8206e9bb73ac1829c6b0d05f.js"></script>

<script id="teknklFormsPlus-0.2.1-reorder" src="//codepen.io/figureone/pen/cd04ce9dd050fd464db8ea917224870f.js"></script>

JS:

var instanceURL = '//app-sj06.marketo.com',

  munchkinId = '112-TZM-766',

  formId = 9783;

MktoForms2.loadForm(instanceURL, munchkinId, formId);

MktoForms2.whenReady(function(form) {

  /* Config section: set up an array of the fields you want to move + their final order */

  var fieldOrder = ["Email", "FirstName", "LastName", "Company", "zOPprogressiveprofilingjrole", "zOPprogressiveprofilingpnum","zOPprogressiveprofilingcntry", "zOPprogressiveprofilingpcode", "zOPprogressiveprofilingind", "zOPprogressiveprofilingjtitle", "zOPprogressiveprofilingausag", "zOPprogressiveprofilingucase", "zOPprogressiveprofilingsprov", "zOPComplianceOptin"];

  /* ---- NO NEED TO EDIT BELOW THIS LINE! ---- */

  FormsPlus.reorderFields(form,fieldOrder);

});

SanfordWhiteman
Level 10
September 8, 2017

If you have a VR use whenRendered, not whenReady.

gkrajeski
Level 10
February 4, 2020

@SanfordWhiteman I'm hoping you can help address an issue I am seeing when using the Override Field Order method you outlined here: https://codepen.io/figureone/pen/ZoVeRy

 

When I set this up for my fields, the form works great except when it is prepopulated.

 

Have you seen this or addressed it previously? It appears that when prefill occurs that the identifier for my rich text field I am trying to force below the submit button does not appear in the DOM. 

 

This is my order array: 

var fieldOrder = [
submitButtonRow,
"HtmlText_2020-01-03T18" // richtext
];

SanfordWhiteman
Level 10
February 4, 2020

Pre-Fill wouldn't affect an ID inside the Rich Text -- unless Pre-Fill also triggers Visibility Rules.