ajaxing hubspot

#set ($portlet_bean_locator = $portal.getClass().forName('com.liferay.portal.kernel.bean.PortletBeanLocatorUtil'))
#set ($hs_contact_local_service = $portlet_bean_locator.locate("hubspot-portlet", "com.liferay.hubspot.service.HSContactLocalService.velocity"))

#set ($hsutk = "$request.attributes.OSB_HUBSPOT_UTK")

#set ($hs_contact = $hs_contact_local_service.fetchHSContactByUserToken($hsutk))
#set ($hs_contact_object = $hs_contact.getHSContactJSONObject().getJSONObject("properties"))

#set ($hs_form_local_service = $portlet_bean_locator.locate("hubspot-portlet", "com.liferay.hubspot.service.HSFormLocalService.velocity"))

#set ($hs_form = $hs_form_local_service.getHSFormByGUID($hs_form_id.data))

#set ($hs_redirect = $hs_form.getRedirect())
#set ($hs_campaign_id = $hs_form.getLeadNurturingCampaignId())

#set ($hs_form_fields = $hs_form.getHSFormJSONObject().getJSONArray("fields"))

<div class="hbspt-form">
	<form action="https://forms.hubspot.com/uploads/form/v2/xxxxxx/$hs_form_id.data" id="hsForm" method="POST">
		#set ($field_count = 0)
		#set ($start = 0)
		#set ($end = $hs_form_fields.length() - 1)
		#set ($range = [$start..$end])

		#foreach ($i in $range)
			#if ($field_count >= $getterUtil.getInteger($number_of_fields.data))
				#break
			#end

			#set ($item = $hs_form_fields.getJSONObject($i))

			#set ($label_text = "")

			#foreach ($name in $field_name.siblings)
				#if ($name.data == $item.getString('name'))
					#set ($label_text = $name.label.data)

					#break
				#end
			#end

			#if ($label_text == "")
				#set ($label_text = $item.getString("label"))
			#end

			#set ($btn_text = $submit_text.data)

			#if ($btn_text == "")
				#set ($btn_text = $hs_form.getSubmitText())
			#end

			#set ($hs_value = "")

			#if ($hs_contact_object.getJSONObject("$item.getString('name')"))
				#set ($hs_value = $hs_contact_object.getJSONObject("$item.getString('name')").getString("value"))
			#end

			#set ($field_css_class = "form-field")
			#set ($hidden = $getterUtil.getBoolean($item.getString("hidden")))
			#set ($hs_smart_field = $getterUtil.getBoolean($item.getString("isSmartField")))

			#if ($hidden || ($hs_smart_field && ($hs_value != "")))
				#set ($field_css_class = "$field_css_class aui-helper-hidden")
			#else
				#set ($field_count = $field_count + 1)
			#end

			#if ($item.getString("required") == "true")
				#set ($field_css_class = "$field_css_class required")
			#end

			<div class="$field_css_class" id="article${reserved-article-id.data}field$i">
				#if ($label_text != "" && ($item.getString('fieldType') != "richtext") && ($item.getString('fieldType') != "booleancheckbox"))
					<label for="$item.getString('name')">$label_text</label>
				#end

				#if ($item.getString('hidden') == "true")
					#set ($value = $item.getString('defaultValue'))

					#if ($value == "")
						#set ($value = $item.getJSONArray('selectedOptions').toString())
						#set ($value = $value.replace("[", ""))
						#set ($value = $value.replace("]", ""))
						#set ($value = $value.replace('"', ''))
					#end

					<input type="hidden" name="$item.getString('name')" value="$value"/>
				#elseif ($item.getString('fieldType') == "select")
					#set($options_start = 0)
					#set($options_end = $item.getJSONArray('options').length() - 1)
					#set($options_range = [$start..$options_end])
					#set ($options = $portal.getClass().forName("java.util.TreeMap").newInstance())

					#foreach ($i in $options_range)
						#set ($option = $item.getJSONArray('options').getJSONObject($i))
						#set ($order = $option.getInt('displayOrder') + 1000)
						#set ($VOID = $options.put("$order", $option))
					#end

					<select id="${item.getString('name')}-$reserved-article-id.data" name="$item.getString('name')">
						#foreach ($option in $options)
							<option value="$option.getString('value')">$option.getString('label')</option>
						#end
					</select>
				#elseif ($item.getString('fieldType') == "richtext")
					<span>$item.getString('defaultValue')</span>
				#elseif ($item.getString('fieldType') == "textarea")
					<textarea id="${item.getString('name')}-$reserved-article-id.data" name="$item.getString('name')"></textarea>
				#elseif ($item.getString('fieldType') == "booleancheckbox")
					<input id="${item.getString('name')}-$reserved-article-id.data" name="$item.getString('name')" type="checkbox" />
				#else
					<input
						id="${item.getString('name')}-$reserved-article-id.data"
						name="$item.getString('name')"

						#if ($item.getString("name") == "email")
							type="email"
						#else
							type="$item.getString('fieldType')"
						#end

						#if ($item.getString('placeholder') != "")
							placeholder="$item.getString('placeholder')"
						#end

						#if ($hs_value && $hs_value != "")
							value="$hs_value"
						#elseif ($item.getString('defaultValue') != "")
							value="$item.getString('defaultValue')"
						#end
					/>
				#end

				#if ($label_text != "" && ($item.getString('fieldType') == "booleancheckbox"))
					<label for="$item.getString('name')">$label_text</label>
				#end
			</div>
		#end

		<a class="btn" href="javascript:;" onclick="submitHSForm()">$btn_text</a>
	</form>
</div>

<script>
	Liferay.provide(
		window,
		'submitHSForm',
		function() {
			var A = AUI();
			var form = A.one('#hsForm');

			A.io.request(
				form.get('action'),
				{
					dataType: 'json',
					form: {
						id: document.hsForm
					},
					on: {
						success: function(event, id, obj) {
							var response = this.get('responseData');
							console.log('hey1',event,id,obj, response);
						}
					}
				}
			);
		},
		['aui-io-request','aui-dialog','aui-dialog-iframe']
	);
</script>