How to auto populate the source url?

Site URL: https://projectsinsider.squarespace.com/

Hi,

I'd like to know if there is a way to prepopulate a hidden form field with a variable input like the referring URL.

For example, a user registers on my website from Project 1 page. I want to capture the URL of this page that they enquired from and have that data entered into my hidden form field URL but without having to include it in the link that I specify.

I'm aware I could enter a link like this https://projectsinsider.com/form?SQF_SOURCE=projectsinsider.com/project_1

but that means I have to customise each link for each page. I'm building out hundreds of blog pages in the next 6 months and that would be slightly more painful to customise each link.

Happy to explore any integrations, codes, or widgets that can help.

Thanks heaps!

If you've got a business / premium plan then you could do this with javascript. Put it in the pages code injection in the Advanced part of the pages settings. If you don't have the business premium plan then I don't think you can do this.

<script>
document.addEventListener("DOMContentLoaded",function() {
  const sourceField = document.querySelector("input[name='SQF_SOURCE']");
  if (sourceField) { sourceField.setAttribute("value",window.location.hostname); };
  const dateField = document.querySelector("input[name='SQF_DATE']");
  if (dateField) { dateField.setAttribute("value", new Date(Date.now()).toISOString()); }
})
</script>

• you can see the names SQF_SOURCE and SQF_DATE in the code, you should obviously change those to match the hidden elements in your form.
• I've used hostname to just give you the domain, but if you wanted the actual page then you could use window.location.href. Anything else search the internet for window.location
• Dates in javascript are notoriously tricky (actually, they're very tricky in pretty much all programming). I've output the ISO string here, I don't know what your support for things like timezones are etc, so it's up to you to work out what you do with that. search the internet for javascript date functions if you want to change it.
• this is based on putting it in the pages header, so it has to add an event listener to make sure the form has been loaded. There's plenty of other ways to do this, you could use jquery, you could also put this in a code block after the form and in that case you'd only need the four lines that find and set the inputs.

I have found @iamdavehart has the right idea, what I found produced the entire URL in the hidden form field for the page that the submission is coming from was the following:

the first    --  ( "value" , window.location.hostname)  -- was not working for me so I changed that to:

("value",window.location.href) 

and that returned the entire page url.

Side note: if you have multiple forms on the same page, I found I had to copy the entire code and change from SQF_SOURCE to something different (example) SQF_URL  ... Copy the entire code from <script> to </script>

<script>
document.addEventListener("DOMContentLoaded",function() {
  const sourceField = document.querySelector("input[name='SQF_SOURCE']");
  if (sourceField) { sourceField.setAttribute("value",window.location.href); };
  const dateField = document.querySelector("input[name='SQF_DATE']");
  if (dateField) { dateField.setAttribute("value", new Date(Date.now()).toISOString()); }
}) 
</script>