Multilingual Form Assembly Forms with Prefill

Owned by Jodie Miners
Last updated: Feb 17, 2016

Business Case:

I have a profile form that I want my client's Chinese customers to update. I want the profile form to be fully in Chinese, but the picklist values that are saved back to Salesforce, that we use for reporting, to be in English. It is fine for their name to be in Chinese, as that is stored in the First Name Local and Last Name Local fields, and what we used to address the Chinese customers on emails to them. 

I want to prefill the form to show the values they have already entered in the previous profile update. 

Overall, this does work, and works nicely. Just beware of the issues I ran into below, and learn from my mistakes so you don't have to make them yourself!

 

Here is what I have... 

Salesforce Field

Inline images 6

Form Assembly Prefill Connector

Inline images 7

Form Assembly Form with Prefill 

Inline images 5

Now we can see here that the Form Assembly prefil must be reading the value from "Correspond to these Salesforce options:" and then selecting that option on the prefill, but then displaying the Chinese translated value as set in "These form choices:"

So this looks like it works, and works well. Then when I set up my save back to Salesforce I will take translate the selected value back to English to send the English value back to Salesforce.

This is all how I expect it to work.

 

However, not so fast...

Let's take this simple field - Gender.

 On the same record and same form, I have set it up the same way. 

Salesforce Field

(Oh and I am not going to start a discussion around the use of binary gender in databases at this point in time, OK?!)

Form Assembly Prefill Connector

Form Assembly Form with Prefill

Why oh why does this one not work? It is set up in exactly the same way as the question above. 

Form Assembly should be reading Male from Salesforce matching it to the value Male in "Correspond to these Salesforce options:" then setting that value as selected and displaying the translated symbol / Male value on the screen. 

 

 

OK, so let's take an example that is NOT Chinese but works exactly the same way. 

In this English-only example of the form, the fields in my picklist in Salesforce are not nicely worded - so I put in the "ugly" values from Salesforce in the "Correspond to..." field and put the nice values in the "These form choices:" section. 

This works perfectly too. 

But the exact same question set up in exactly the same way but putting Chinese values into the "These form choices:" section does not work. 

HMMM! Interesting - why does Ultrasound look different? That is weird. Hmmm, I think I have uncovered the problem... let me check.... 

The HTML for Ultrasound is 

<label class="label postField" id="tfa_19-L" for="tfa_19">
<span class="onechoice"><span style="font-size:
10.0pt;font-family:&quot;MS Gothic&quot;;mso-bidi-font-family:&quot;MS Gothic&quot;;color:black;
mso-ansi-language:EN-AU;mso-fareast-language:EN-US;mso-bidi-language:AR-SA" lang="EN-US">超声部</span></span>&nbsp;
/&nbsp;<span style="font-size: 14.688px; line-height: 22.032px;">Ultrasound Dept.</span></label>

 

The HTML for other Surgery is 

<span class="oneChoice"><input type="checkbox" value="tfa_1091" class="" checked="" id="tfa_1091" name="tfa_1091"><label class="label postField" id="tfa_1091-L" for="tfa_1091">Other Surgery</label></span> 

Does that give us a hint??? Of course it does! 

  • So I take the text 
  • Paste it into Google Translate which seems to format the Chinese characters nicely, and strips out all the HTML, check that the word make sense, then paste that back into Form Assembly 
  • 超声部  / Ultrasound Dept.
  • I then delete that field from the Prefill Mapping and create it again. 
  • YAY it works!

So, what was the answer? 

  • The prefill is mapping the exact text from Salesforce "Ultrasound Dept." to the option in on the prefill mapping that says "Ultrasound Dept." in the "Correspond to..." side. 
  • It then looks for the value in the "These form choices" side and tries to find that in the HTML that is produced by the form - in this case it was trying to find "超声部  / Ultrasound Dept."
  • It could not find that between the <label></label> tags because the label says in HTML language "<span class="onechoice"><span style="font-size: 10.0pt;font-family:&quot;MS Gothic&quot;;mso-bidi-font-family:&quot;MS Gothic&quot;;color:black; mso-ansi-language:EN-AU;mso-fareast-language:EN-US;mso-bidi-language:AR-SA" lang="EN-US">超声部</span></span>&nbsp; /&nbsp;<span style="font-size: 14.688px; line-height: 22.032px;">Ultrasound Dept.</span>"
  • And that is never going to match in anyone's language. 

NOW to go and replace EVERY chinese value in every selection in my Form Assembly Form and get this form working!