Javascript up for grabs: Automatic translation of form placeholders

I attended the great Marketo Summit Session by ​ "Learn the dark side of forms", and I had a talk with a fellow Marketo user ​ about language versioning of forms. I've created an example script for her that, when loaded on a MKTO landing page, will translate the placeholder texts of the form, and thought I'd share it with the rest of you guys. I've two scripts here - one for forms using labels and one for forms using placeholders. (Don't know the difference? Click here for info).

The script comprises of two parts. Part 1 is where you define the language versions of the different form elements. The label names, such as FirstName, must match the ID of the field HTML element. Find it by right clicking the field and choose "inspect element". It's here you enter that 'FirstName' in French is 'Prénom' e.g. When adding new translations, remember to comma separate all translations, but don't put a comma after the last. See script for example.

The second part basically takes care of itself, however it needs input on what language version to show, and this can be very different depending on your LP/token/dynamic content infrastructure in Marketo. Tell me how you work with language versions in your Marketo instance in a comment, and I'll explain how to use the code correctly.

The code can work on your own webpage as well (meaning not on a MKTO hosted LP), but the script listening to the form loading must be changed to do fit this. See See http://developers.marketo.com/javascript-api/forms/ for more info.

To test different language versions however, try switching the language code between "de"/"fr"/"en" to test it:

var language = "de";

If you want to see if the code works, load a Marketo LP with a form with placeholders and paste the code in the console (right click anywhere on the page, find the Console and paste and press return).