[How To] Capture Date/Time In Hidden Form Field

  • 16 August 2017
  • 8 replies
  • 161 views

Userlevel 7
Badge +1
  • Former Community Manager @ Unbounce
  • 831 replies

Form submission date and time is captured automatically by Unbounce. If you scroll over any lead record in the View Leads section of your page, you’ll see the submission date and time appear in the left hand column. On CSV exports, date/time will be the lead column.

However, this doesn’t come through as a field when the lead is emailed. If this is something you’re looking to achieve, we’ve created a quick script that’ll help you out!

With the help of some javascript, you can generate the current date/time and set it to a hidden field on your form.


How to Install in Unbounce

Click Here for Instructions

🚨
This is not an official Unbounce feature. This functionality is based entirely on third party code, and has only been tested in limited applications. Since this isn’t a supported Unbounce feature, our support team will be unable to assist if things go awry. So if you are not comfortable with HTML, Javascript and CSS, please consider consulting an experienced developer.


Step 1.

Create a hidden field. For this example let’s call it ‘Date_Submitted’.

Step 2.

Insert the script below to your javascript box

<script>
// Change the word Date_Submitted in the following line to the name of your hidden field label.
// It has to match exact label, including capitals, underscore, etc...
var inpElm = document.getElementById('Date_Submitted');                                     
var d = new Date();
var pD = d;
window.setTimeout(sD, 5000);
window.setInterval(sD, 30000);
function sD(){
inpElm.value = d;
}
sD();
</script>

Step 3.

Celebrate, 'cause you’re all done!! :gif_master:

Big ups to @Matt_Coady and @Johnny_Opao for helping stitch this together! :clap:



Want to take your Unbounce landing pages + Convertables™ to the next level?
:spinbounce: Check out the Ultimate List of Unbounce Tips, Scripts & Hacks


8 replies

I can’t say thank you enough to @Jess @Matt_Coady and @Johnny_Opao for updating this resource. I found an old community post that had some code in it that was less than perfect. I can say this ABSOLUTELY works.

The use case is primarily with clients that are trying to pull data into salesforce…

Thank you again!
Joe

Hi @Jess @Matt_Coady @Johnny_Opao

I’m fail in see why the field is blank after follow above script,

after form is submitted, both leads records and csv file are show no records, can you help to advice ? Thanks!

Userlevel 3

Just a heads up here for people trying to use this script, the placement should be “Before Body End Tag”. Since we are trying to access the form element, when you add in the page’s head the code runs before the elements are loaded, making this workaround to not work properly.

🙂

Badge +1

Awesome…however I guess this line is redundant
var pD = d;

big shout of applause to the entire team! 🤩
and after i typed this I realize this post is from 2017 🥶 (i m always late to a party)

Thank you @Jess!

May I ask, how can I format the date as dd/mm/yyyy hh:mm:ss ?

Cheers,
Mike

The above script didn’t work for me. I’m trying to pass a date AND timestamp into 1 hidden field in Campaign Monitor using the following format: YYYY/MM/DD hh:mm. But Unbounce separates the date and time into 2 fields. So I added this suggested script as a workaround, but the field didn’t show up in Campaign Monitor.

I added the script into the “javascript” section using the “Before Body End Tag” setting. Then I created a hidden field called, “Date_Submitted” and mapped that field to my date timestamp field in Campaign Monitor. Any suggestions?

I had trouble with the instructions provided when I was trying to send a date field from Unbounce to Salesforce via Zapier. Here are the steps I took with the updated javascript.

Step 1

Create a hidden field, “Date_Submitted”.

Step 2

Insert the script below to your javascript box. The placement should be “Before Body End Tag”.

<script>
let hiddenDateFieldElement = document.getElementById("Date_Submitted");
let hiddenDate = new Date();
function hiddenDateField(){
hiddenDateFieldElement.value = hiddenDate.toString();
}
hiddenDateField();
</script>

The above script resulted in dates being a week ahead of my desired date due to my timezone relative to GMT. So see step 3 if you do not live at 0 GMT. You can probably skip to step 4 if you are at 0 GMT but I didn’t test this theory.

Step 3

Create Zapier integration.

  1. New Form Submission in Unbounce
  2. Date/Time in Formatter by Zapier: Pick desired date/time format
  3. Find Record in Salesforce. If no, create record. If yes, update record.
  4. Create additional records (if required).

Step 4

You’re done! Celebrate!

Userlevel 4
Badge +1

Thanks for sharing this info @Cory_Justus, super helpful! 👏 

Reply