Hidden input values sometimes pass through to HubSpot, sometimes they don't

[callumflint]

I am using the onFormReady attribute to dynamically populate two hidden fields that I have added to a HubSpot form. Everything seems to be working, with the fields correctly showing the values after the page is loaded. However when the form is submitted to HubSpot, it sometimes passes the values through, but sometimes it doesn't. Can someone confirm I am using the attribute in the right way?

<script> hbspt.forms.create({
	css: '',
	portalId: '12345',
	formId: '12345-67890-12345-67890',
	target: '.hubspot-form',
	onFormReady: function($form) {
		var $resourceName = $('[name="hidden_knowledge_resource_name"]');
		var $businessUnitName = $('[name="hidden_knowledge_business_unit"]');
		$resourceName.val('<?= htmlentities(the_title(), ENT_QUOTES) ?>');
		$businessUnitName.val('<?= htmlentities(preg_replace(' / Analytical Services / ', '
			Sciences ', $businessUnits), ENT_QUOTES) ?>');
		$('.hubspot-form-kc .hs-submit .hs-button').attr('class', '<?php echo strtolower(str_replace('', ' - ', get_field('article_type '))); ?>');
		$('.hiddenPDF').hide();
	}
});
</script>

[jackcoldrick]

Hey Callum,

I'm not sure why it's working sometimes and not others. Typically there isn't anything wrong with echoing PHP within Javascript. However looking at your code it seems that you're pulling the title of the post using "the_title()" function. I wonder if you could either pull the title of the page directly using JQuery? or use JQuery to pull the title of the post if it exists within a H1 tag or within another location on the page removing the need to depend on PHP.

I hope this helps,
Jack