# Update Hidden Fields with Javascript on Page

**URL:** <https://community.hubspot.com/t/update-hidden-fields-with-javascript-on-page/74067>\
**Category:** CMS Development\
**Tags:** forms, contacts\
**Created:** [January 30, 2023, 8:52pm UTC](https://community.hubspot.com/t/update-hidden-fields-with-javascript-on-page/74067 "2023-01-30T20:52:19Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![TRowley](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/trowley/32/192795_2.png) [@TRowley](https://community.hubspot.com/u/TRowley)\
**Post date:** [January 30, 2023, 8:52pm UTC](https://community.hubspot.com/t/update-hidden-fields-with-javascript-on-page/74067/1 "2023-01-30T20:52:19Z")

</div>

I am currently trying to update two hidden fields using Javascript. The two hidden fields utilize the name property, so I am using the getElementByName selector. I can get it to see the fields, and based on the console, it reports the value back as I’ve set it. However, when I look at the fields on Hubspot, none of the data comes through. Here is a breakdown of the script I wrote.

=====

document.addEventListener(“DOMContentLoaded”, function(event){

function productOfInterest(){

const productOfInterest = “Product of Interest”;

document.getElementsByName(“mkt\_product\_interest”).value = productOfInterest;

};

function sfCampaign(){

const sfCampaign = “SF Campaign Name”;

document.getElementsByName(“form\_sf\_campaign”).value = sfCampaign;

}

sfCampaign();

productOfInterest();

});

---

<div class="post-metadata">

**Author:** ![Jaycee\_Lewis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jaycee_lewis/32/61352_2.png) [@Jaycee\_Lewis](https://community.hubspot.com/u/Jaycee_Lewis)\
**Post date:** [January 31, 2023, 7:51pm UTC](https://community.hubspot.com/t/update-hidden-fields-with-javascript-on-page/74067/2 "2023-01-31T19:51:53Z")

</div>

Hi, @TRowley 👋 Thanks for reaching out. Hey, @Anton @MatthiasWeber do you have any tips you can share with, @TRowley? I have a feeling we’ll need more context to get specific solutions, and any troubleshooting suggestions you can provide are greatly appreciated.

Thank you! — Jaycee

---

<div class="post-metadata">

**Author:** ![MatthiasWeber](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/matthiasweber/32/27498_2.png) [@MatthiasWeber](https://community.hubspot.com/u/MatthiasWeber)\
**Post date:** [February 1, 2023, 6:57am UTC](https://community.hubspot.com/t/update-hidden-fields-with-javascript-on-page/74067/3 "2023-02-01T06:57:36Z")

</div>

Hi Hi ,

I fear that the hubspot-logic ignores hidden fields (for many reasons 😉 - for example honeypot-fields, …).

My tip would be: unhidde them for testing and have a look if the values are available then in hubspot.

|   
[  
 ![]()  
](https://www.linkedin.com/in/matthias-weber-816410114/) |   
  
**Gemeinsam für digitales Unternehmenswachstum! Wir glauben an [Human Centric,](https://die-digital-weber.de/der-digital-weber-blog/human-centric-growth-mindset)[Online-Marketing mit Inbound und](https://die-digital-weber.de/der-digital-weber-blog/inbound)[Digitale Geschäftsprozesse.  
](https://die-digital-weber.de/der-digital-weber-blog/mobile-working)**Sie wollen mit Ihrem Unternehmen weiter kommen? Mit den [Digital-Webern wird der Weg einfacher!](https://die-digital-weber.de/services/einkaufsberatung)    
[  
 ![]()  
](https://meetings.hubspot.com/matthias-weber/30-minuten-gesprach-mit-matthias-weber) |

[@Jaycee\_Lewis](https://community.hubspot.com/t5/user/viewprofilepage/user-id/127074)

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [February 1, 2023, 12:43pm UTC](https://community.hubspot.com/t/update-hidden-fields-with-javascript-on-page/74067/4 "2023-02-01T12:43:31Z")

</div>

Hi @TRowley,

since forms are rendered with Hubl(server-side) and JS is loaded on client-side you can’t really control forms with JS by default. BUT you can create a custom module with a form function and a modified embed code from any form - doesn’t really matter and modify the form load by adding your script with _onBeforeFormInit. Here’s the [documentation](https://legacydocs.hubspot.com/docs/methods/forms/advanced_form_options) about modifying forms._

_a custom module code could look like this_

```lia-code-sample
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js"></script>
<script>
 hbspt.forms.create({
 region: "na1",
 portalId: "{{ hub_id }}",
 formId: "{{ module.form_field.form_id }}",
 onBeforeFormInit: {
{# YOUR SCRIPT #}
}
 });
</script>

```

best,

Anton

---

<div class="post-metadata">

**Author:** ![SRalston05](https://avatars.discourse-cdn.com/v4/letter/s/8e8cbc/32.png) [@SRalston05](https://community.hubspot.com/u/SRalston05)\
**Post date:** [March 23, 2023, 11:11pm UTC](https://community.hubspot.com/t/update-hidden-fields-with-javascript-on-page/74067/5 "2023-03-23T23:11:47Z")

</div>

This touches on something I’ll need to do, but as a complete Hubspot neophyte I need to ask first, how do I even get Javascript onto the page where the form is?

Steve