Skip to main content

I have several form fields that use simple drop downs. My server is looking for responses that are different from than say plain text from the drop downs. I need to be able to have my (for example) values be 0-5 for the 5 possible selections - not the plain text in the selector. Possible?

Hi Chris - It’s definitely feasible with a little Javascript that looks for your existing drop down values and changes them to an assigned number. One drawback would be that rewriting the values on submission means that your Unbounce lead database would show the rewritten number value and not the text values that you set. So, you’ll definitely want to keep that in mind.


Mark from our Technical Team has come up with a script that does the rewrite:


<script>

(function(){

// The dropdown's ID (without #)
var id = 'country';

// Map of old to new values
var values = {
'Australia': 'AU',
'Canada': 'CA',
'United States': 'US',
'United Kingdom': 'UK'
};

// No need to change anything from here on
Object.keys(values).forEach(function(oldValue) {
document.querySelector('select#' + id + ' optiontvalue="' + oldValue + '"]').value = valuesloldValue];
});

})();

</script>

You’ll just need to add that to the Javascripts panel on your page (you can find more on that http://support.unbounce.com/entries/513757-Using-Custom-JavaScript-and-CSS-on-Your-Landing-Page](<a href=)">here --the placement for this script doesn’t matter, since it’s set to fire after the page has loaded, regardless)


You’ll need to adjust:


var id = 'country';

So that country is replaced with your drop down’s field name.


And then adjust:


var values = {   
'Australia': 'AU',
'Canada': 'CA',
'United States': 'US',
'United Kingdom': 'UK'
};

So that each left hand country name is replaced with your own drop down values and the right hand abbreviations are changed to be the corresponding number values.


This appears to be working. Is there a similar javascript solution to change the variable id for a plain text field as well? So that if in the Unbounce page the variable is named first_name but my Post page is expecting propery_owner_first_name I can change it?


This is a 2 page form and this field appears in the first page so the modified variable is being passed along to the next unbounce page.


Hello Chris,


Technically, this could be done using jQuery in a similar way. However, we don’t recommend changing the names of fields themselves. That’s because doing so will break any validation that you’ve added in the form builder and prevent field mapping (for webhooks and third party integrations) from working.


If you’re only sending data from one Unbounce page to another in a multi-step form, this shouldn’t be an issue. For example, if the field is called first_name on the first page, all you need to do is add a hidden field to the second, also called first_name.


However, if you then want to post this data to another server, I can see the issue. At this point you may wish to look into Webhooks (http://support.unbounce.com/entries/3…), because they support field mapping, which would allow you to send first_name as propery_owner_first_name.


Hey thanks for the post, does this still work? I am not sure if I’m making a mistake but just wanted to make sure this still works in 2019. Thank you


I’m trying to accomplish exactly what is laid out here, but the code does not seem to be working. Can someone tell me if there should be changes made to the above code in 2022. Need this ASAP so if anyone knows if would be greatly appreciated.


There is another way to do it in zapier or Make with a lookup table. The look up table can be done inside zapier / make or if you have a lot of value you can do it with a Google sheet step


Thanks for your reply on this @julien_level👏🏻 Also tagging @Quinn_Omori in case he has anything to add RE: the original code posted back in 2014.


 


Hey ​@Chris_Minott!
 

🚀 We have a brand new, complete solution for adding Country Codes and Flags to Unbounce!

🆓 FREE Version:


💎 PRO Powerful Version:
👉 https://www.grooic.com/cfu-unbounce

 

👀 Check Out the Live Preview Here:

🌐 https://www.grooic.com/cfu-preview/

 

🤝 If you have any questions or need support, feel free to reach out to us on WhatsApp: 💬 +1 917 900 3111

Thanks,


Reply