Form API - Can't get Textarea value to update

Develop, Build & Integrate APIs & Integrations
1

I am struggling to get the textarea field to update using the forms api and jquery. Basically, I want to take the values from marked checkboxes and add them to the textarea. I made some great progress from a suggestion on a previous post but have hit a roadblock. This is the last piece of the puzzle. Here is my code:

<script type="text/javascript" src="//js.hsforms.net/forms/embed/v2.js" charset="utf-8"></script>
<script>
 hbspt.forms.create({
 portalId: "xxxxxxxx",
 formId: "xxxxxxxxxxxxxxxxxxxxxxx",
 onFormReady: function ($form) {
 // Request Training
 $('.course-checkbox').prop('checked', false).change(function() {
 let selectedValues = [];
 $('.course-checkbox:checked').each(function() {
 selectedValues.push($(this).val()); // Add the value to the array
 	console.log(selectedValues);
 });
 $('#enquiry_details-c9d69fac-d601-4364-8e3f-279879a5dfbb').val(selectedValues.join('\n')); 
 });

 },
 });
</script>

I put the console.log in place so verify that’s it’s grabbing the correct values which is it. I removed the ids for the post. Not sure if I am missing something or doing something wrong. I am sure it’s going to be something simple.

Thanks,

Terry McMillan

2

Hey, @tmcmillan99 :waving_hand: This is a challenging one. I tried a few quick ideas and then asked Claude for help, but came away defeated. Maybe some of our community champion wizards have a suggestion — @dsmarion @Teun @Anton @Indra have you set up anything similar in your recent work?

Thanks for looking! — Jaycee

3

@Jaycee_Lewis Thanks for testing the issue and reaching out to others for assistance. This project hinges on me being able to append the info to the form textarea. Not sure why it’s not working. Is there something about Hubspot forms that would prevent the code from working?

Thanks,

Terry

4

@Jaycee_Lewis What are my options if it looks like I am not going to receive any suggestions from the community? Is this something that I can log a support ticket for? If this functionality ends up not being possible with a Hubspot form then I will need to figure out quickly a different solution to the project.

5

I was able to get some assistance on the Hubspot Developer Slack channel. There were two changes that I needed to make: 1. Toggle the Hubspot form to raw html 2. Add .change() after the join action on the textarea.

$('#enquiry_details-6fa26ee7-f3d1-407c-8e1f-aa6a59b9f49a').val('I am interested in the following training cources: ' + selectedValues.join(',\n')).change();

6

Hey, @tmcmillan99 :waving_hand: Thank you very much for coming back and sharing your solution. I’ll keep this in mind for future troubleshooting :blush: — Jaycee