Encoding/Decoding URL Querystring for Non-English Characters

[Amy_Lepre]

Hi - Hoping someone from the Marketo Community can help me with this since Marketo Support has said they won’t offer assistance due to custom code being used on our landing page. 

I have an email that gets sent to our distribution partners with a lead’s information and activity. This email contains a dynamically generated link to a Marketo landing page which contains a form. The purpose of the landing page is for the partner to provide us feedback on the lead we have given them. We do not want the partners to update any of the lead’s information we already have in the system, but we want to display the lead’s information on the form so they can be sure they are leaving feedback for the appropriate person. 

The link in the mail is built like such:

http://oursite.com/DistributionLeadsFeedbackLP.html?FirstName={{lead.First Name}}&LastName={{lead.Last Name}}&Company={{company.Company Name}}&Country={{lead.Country}}&Email={{lead.Email Address}}&Compiled_Lead_Feedback__c={{lead.Compiled Lead Feedback}}

So on the landing page we have a form that is actually built using Javascript so we can make most of the fields read-only while also populating them from the querystring in the URL. 

Here is the code I’m using to get the field values from the querystring:

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

<script src="/js/public/jQueryString-2.0.2-Min.js" type="text/javascript" ></script>

<script>

  // to set cookies.  Uses noConflict just in case

var $jQ = jQuery.noConflict();

var pEmail = $jQ.getQueryString({ ID: "Email" });

var pFirstName = $jQ.getQueryString({ ID: "FirstName" });

var pLastName = $jQ.getQueryString({ ID: "LastName" });

var pCompany = $jQ.getQueryString({ ID: "Company" });

var pCountry = $jQ.getQueryString({ ID: "Country" });

var pCompiled_Lead_Feedback__c = $jQ.getQueryString({ ID: "Compiled_Lead_Feedback__c" });

var p_mkt_trk = $jQ.getQueryString({ ID: "_mkt_trk" });

pFirstName=pFirstName.replace(/%20/g," ");

pLastName=pLastName.replace(/%20/g," ");

pCompany=pCompany.replace(/%20/g," ");

pCountry=pCountry.replace(/%20/g," ");

pCompiled_Lead_Feedback__c=pCompiled_Lead_Feedback__c.replace(/%20/g," ");

document.getElementById("Email").setAttribute("value", pEmail);

document.getElementById("FirstName").setAttribute("value", pFirstName);

document.getElementById("LastName").setAttribute("value", pLastName);

document.getElementById("Company").setAttribute("value", pCompany);

document.getElementById("Country").setAttribute("value", pCountry);

document.getElementById("Compiled_Lead_Feedback__c").setAttribute("value", pCompiled_Lead_Feedback__c);

document.getElementById("Compiled_Lead_Feedback__c").value = pCompiled_Lead_Feedback__c;

document.getElementById("_mkt_trk").setAttribute("value", p_mkt_trk);

</script>

Everything works well as long as the lead’s information does not contain any non-English characters. Here is what occurs when we run into that issue, though:

The URL in the browser actually displays properly, for example:

http://oursite.com/DistributionLeadsFeedbackLP.html?FirstName=Test%20AP%20汉字&LastName=Characters%20形声字&Company=Southco%20%20轉注字%20äöüß&Country=&Email=abc@123.com&Compiled_Lead_Feedback__c=

However, on the form, the values get encoded to look like this:

First Name: Test AP %E6%B1%89%E5%AD%97

Last Name: Characters %E5%BD%A2%E5%A3%B0%E5%AD%97

Company: Southco  %E8%BD%89%E6%B3%A8%E5%AD%97 %C3%A4%C3%B6%C3%BC%C3%9F

I’m assuming I will need to add some more Javascript to encode/decode (??) the querystring before passing the values to the form fields, but I have been unsuccessful in my attempts to do so. 

Any ideas/solutions out there? I would greatly appreciate it, as our database is quickly getting dirtied up with bad data. That’s my next task: figuring out how to decode all of the values that are in Marketo now back into the proper characters.  

[Kenny_Elkington · Accepted solution]

Hi Amy,

It should be sufficient to use the native decodeURIComponent function on the strings which you're grabbing from the querystring.  Like this for each of the variables:

var pEmail = decodeURIComponent($jQ.getQueryString({ ID: "Email" }));

This should return the decoded string instead of the percentcoded characters and input them properly into the form for submission.

[Amy_Lepre]

Kenny - thank you so much! That works perfectly.

Now to fix all the entries in the system that got screwed up with the percentencoded values... 🙂