GOGETMUSCLE Community Phone number not recording all the time on Hubspot Forms

Phone number not recording all the time on Hubspot Forms

Hi there i have problem i wanted to implement select country flag from phone number and when i am testing sometimes phone number gets deleted before submited here is my full code 


for selecting phone country flag i am using this library intlTelInput

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/intl-tel-input@19/build/css/intlTelInput.min.css” />




(function() {
var hubspotFormId = ‘4cf2cc85-1a88-44e0-9b65-aa3966e3ec67’;
var amplitudeFormName = ‘only6-female’;

function fireAmplitude(formId) {
if (!window[‘__hubspotFormSubmitted_’ + hubspotFormId]) {
window.amplitude && window.amplitude.track &&
window.amplitude.track(‘Form Submitted’, {
formId: formId,
formName: amplitudeFormName
});
window[‘__hubspotFormSubmitted_’ + hubspotFormId] = true;
}
}

hbspt.forms.create({
portalId: “XXX65354”,
formId: hubspotFormId,
region: “na1”,
onFormReady: function($form) {
setTimeout(function() {
var amplitudeDeviceId = $form.find(‘input[name=”amplitude_device_id”]’);
if (amplitudeDeviceId.length && window.amplitude && typeof window.amplitude.getDeviceId === ‘function’) {
amplitudeDeviceId.val(window.amplitude.getDeviceId()).change();
}
}, 2000);

if (!$form.find(‘input[name=”phone_full”]’).length) {
var hiddenInput = document.createElement(‘input’);
hiddenInput.type = ‘hidden’;
hiddenInput.name = ‘phone_full’;
$form[0].appendChild(hiddenInput);
}

var phoneInputField = $form.find(‘input[name=”phone”]’).get(0);
if (phoneInputField && window.intlTelInput) {
window.iti = window.intlTelInput(phoneInputField, {
separateDialCode: true,
initialCountry: “auto”,


geoIpLookup: function(callback) {
fetch(‘https://ipapi.co/json‘)
.then(res => res.json())
.then(data => callback(data.country_code))
.catch(() => callback(‘us’));
},
useFullscreenPopup: false,
utilsScript: “https://cdn.jsdelivr.net/npm/intl-tel-input@19/build/js/utils.js
});
}
},
onFormSubmit: function($form) {
if (window.iti && window.intlTelInputUtils) {
var fullNumber = window.iti.getNumber(window.intlTelInputUtils.numberFormat.E164);
var hiddenPhoneInput = $form.find(‘input[name=”phone_full”]’);
var phoneInputField = $form.find(‘input[name=”phone”]’);

if (hiddenPhoneInput.length) {
hiddenPhoneInput.val(fullNumber).change();
}
if (phoneInputField.length) {
phoneInputField.val(fullNumber).change();
}
console.log(“phoneInputField”,phoneInputField.val());
// Force refresh validation (prevents HubSpot from wiping values)
phoneInputField.trigger(‘focus’).trigger(‘blur’);
}

fireAmplitude(hubspotFormId);

// DO NOT return false here to allow HubSpot native submission to proceed
}
});

window.addEventListener(“message”, function(event) {
if (
event.data &&
event.data.type === ‘hsFormCallback’ &&
event.data.eventName === ‘onFormSubmitted’ &&
event.data.id === hubspotFormId
) {
fireAmplitude(hubspotFormId);
}
}, false);
})();




<script src="https://cdn.jsdelivr.net/npm/intl-tel-input@19/build/js/intlTelInput.min.js“>

i have also enable rechaptcha for my form, i had disabled any validation for phone field and sometimes phone is recorded sometimes not also phone field is optional.

If somebody can help

Thanks in Advance

Toni

Leave a Reply

Your email address will not be published.

Related Post