It is quite common with Sitecore's Web Forms for Marketers module to need hidden fields on the form. For example, you may need to pass data from Sitecore to an external system, such as CRM. Maybe you want to associate a form submission to a campaign in CRM, or pass on a Topic value into a CRM lead, such is the example below.
To accomplish this use the following steps:
- Code the hidden fields with different CSS styles than the other, normal fields (Figure 1)
- Pass the hidden form values into your form actions (Figure 3)
document.addEventListener("DOMContentLoaded", theDomHasLoaded, false);
The code above executes a function after the page has loaded. This event listener could be handled via a jQuery ready method, however, jQuery typically isn't initiated until after the end of the page so I used the DOM directly. After the page has loaded we use jQuery to simply hide the hidden classes associated to the specified CSS style. Simple! NOTE: you will need to swap out "thirdAvailableWidth" with the style you choose if you choose something other than "one third" as I did.