Utilizing cookie data in a form id

I have a custom module that creates a cookie on my website when someone visits a loan officer’s page. Stemming from that cookie there is a dynamic floating footer that pulls information from HubDB about the loan officer and displays the information in the footer.

I have an external form I’m embedding throughout the website on different pages that needs to utilize the cookie information to link to a particular column in a loan officer’s HubDB row. We’ve successfully done this in the past but only on pages that are completely built off of a loan officer’s table row and not from cookie information.

For example this is what the form looks like when used on a page that is built completely around a loan officer’s table row information:

<div class=“lead-capture”>
<div class=“form-embed” data-form-id=“E1234” data-user-id=“{{ tableRow[0].officer_id }}”>
</div>
<script async src=“//myexternalwebsite.com/formembed/embedform.js”></script>
</div>

I need to swap out “{{ tableRow[0].officer_id }}” for something referencing the cookie that will link to the column in HubDB similarly.

Does this sound like something that is possible to do between modules? Please let me know if more clarification is needed. It’s hard to be sufficiently clear on this. Thank you for any wisdom!

Hi!
I suppose you could use {{request.cookies}} (HubL variables - HubSpot docs) to get the cookie you need.

Use {{request.cookies|pprint}} to check what cookies are set.
Keep in mind that using this variable will disable page caching, but it is the only way to retrieve the cookie without using JavaScript.
If you want a JavaScript solution, let me know!

I don’t think we’d want to disable page caching, although I will give this a try either way.

How would I go about doing this using JavaScript?

Thank you for your help!

Hi @DevM
We use the js-cookie npm package for this. Your script could look something like this:

import Cookies from 'js-cookie'

const officerInfo = Cookies.get('officerInfo')
const container = document.querySelector('form-embed')

if (officerInfo) {
 container.dataset['user-id'] = officerInfo.crm_id
}

I have some questions on this but have sent you a direct message. Thanks!