HubSpot Ideas

VincePerfetto

Make it possible for Hubspot Forms to separate First/Last Name from one Field

10 Replies
Arne
Contributeur de premier rang

Hi @VincePerfetto 

Makes sense.  In the meantime, you may use one field for name in your forms that populates a custom property „full name“ which you create if not available already.

 

I would then export the forms info into excel and perform a transform to table using a space as the delimiter to split the full name into separate cells.

 

Name the first „First name“ and the second (or 3rd depending on the name) „Last name“.

 

I would then import the contacts to update the existing ones which came in with full name.

 

When exporting contact information, the contact ID is available. Make sure you don’t delete or modify this information to update the contact.

 

I haven’t tested it yet (just saw your note, replied on iPhone:-) but you can give it a try with some test contacts. Please let me know if all worked the way it should since I‘d adapt it here, too, if it works.

apolaszewski
Member

How do you pass "Full Name" data into separate "first name" and "last name" fields so you can personalize outreach?

bowie
Member

I'm not sure if this has already been resolved elsewhere... but i've written a little bit of scripting that achieves just this... It's also accounting for various prefixes for last names (Mc, Mac, Von, etc.).

 

Basically, what i've done is created a first, middle and last name field and hidden them within the forms, then added an onsubmit callback that processes the full name and splits it up into the first / middle / last properties. So far it seems to be working rather well... 

 

 

The code for splitting the name...

function capitalizeFirstLetter(str) {
    return str.charAt(0).toUpperCase() + str.slice(1);
}

function checkPrefixes(str, arr){
    for(var i = 0; i < arr.length; i++)
        if (str.toLowerCase() === arr[i].toLowerCase()){
            return true;
        }
    return false;
}

function separateNames($form){
  var namePrefixes, fullName, splitName, user;

    namePrefixes = ["Ab","Af","Ap","Abu","Aït","Al","Ālam","Aust","Austre","Bar","Bath","bat","Ben","bin","ibn","Bet","Bint","Da","Das","De","Degli","Dele","Del","Della","Der","Di","Dos","Du","El","Fetch","Vetch","Fitz","Kil","Gil","La","Le","Lille","Lu","Mac","Mc","Mck","Mhic","Mic","Mala","Mellom","Myljom","Na","Ned","Nedre","Neder","Nic","Ni","Nin","Nord","Norr","Ny","Ua","Ui","Opp","Upp","Öfver","Ost","Öst","Öster","Øst","Øst","Østre","Över","Øvste","Øvre","Øver","Öz","Pour","Stor","Söder","Ter","Ter","Tre","Van","Väst","Väster","Verch","Erch","Vest","Vesle","Vetle","von","zu"];

    user = {
      firstName: '',
      middleName: '',
      lastName: ''
    }
	console.log('maybe.....' + user);
    fullName = $form.find('input[name="full_name"]').val();
    fullName = fullName.replace(/\s+/g, ' ').trim();
    splitName = fullName.split(" ");
	console.log('we found the field value!!');

if(splitName.length === 1){
    user.firstName = splitName[0];
}

if (splitName.length === 2) {
    user.firstName = splitName[0];
    user.lastName = splitName[1];
}

if (splitName.length === 3) {
    user.firstName = splitName[0];
    user.middleName = splitName[1];
    user.lastName = splitName[2];
}

if (splitName.length >= 4){
    user.firstName = splitName[0];
    
    for (var i = 1; i < splitName.length; i++){

        if (checkPrefixes(splitName[i], namePrefixes) === false && i !== (splitName.length - 1) && user.lastName === ""){
            user.middleName += splitName[i] + " ";
        }

        else {
            user.lastName += splitName[i] +  " ";
        }
    }
}

if (user.middleName.length < 3 && user.middleName.indexOf('.') !== -1) {
    user.lastName = user.middleName + user.lastName;
    user.middleName = '';
}

user.firstName = capitalizeFirstLetter(user.firstName);
user.middleName = capitalizeFirstLetter(user.middleName);
user.lastName = capitalizeFirstLetter(user.lastName);

console.log("the full name is ... \n First: " + user.firstName + "\n Middle: " + user.middleName+ "\n Last: " + user.lastName);

return user;

}
function injectFieldData(el, data){
  var inputField = document.querySelector(el) || null; 
  if(inputField !== null){
    if(data !== undefined){
      inputField.value = data;
    }
  }
}

function postFormSubmission($form){
  var user = separateNames($form);
  console.log(user);
    $form.find('input[name="firstname"]').val(user.firstName).change();
    $form.find('input[name="middlename"]').val(user.middleName).change();
    $form.find('input[name="lastname"]').val(user.lastName).change();
}

and then when you are creating a form, via the api, pass in the onFormSubmit... 

 

 

hbspt.forms.create({
            portalId: hsForm.portalId || "your portal ID",
            formId: hsForm.formId,
            target: hsForm.target || this,
            cssClass: hsForm.style || "hsForm",
          	onFormReady: hsForm.onFormReady || '',
	        onFormSubmit: function($form){
      			console.log($form);
			    postFormSubmission($form);
            },
        });

 

I hope that this helps you out...
saurabh_goyal
Member

Hi, 

I just wanna know that how we can apply this script in hubspot.

What is hsform.target and do we have to replace $form with some vale?

JoeMayall
HubSpot Alumni

Hi HubSpot Community,

 

My name is Joe, I'm the Ideas Forum Manager. I've been in contact with the HubSpot product team about this Idea, and I wanted to provide a quick update.

 

We appreciate all the feedback you’ve shared here to help our team evaluate this feature request. However, at this time, this functionality is not something our team is planning to build into HubSpot. This is certainly subject to change in the future, so feel free to leave feedback if you'd like. We'll update this thread if our plans change.


Best,
Joe
Ideas Forum Manager

saurabh_goyal1
Participant

We already done this using javascript.

Hannah3
Participant

It would be good to also have the ability to split a "full name field" into first and surname properties via API

pkuona19
Member

Here is a fix that does not require knowledge of code! [You will need to use Zapier]

1. I created a contact property "Name" in Hubspot Contacts. So the user will enter First & Last Name in one "Name" field in all my forms. 

pkuona19_0-1640771758162.png

 

2. When a New Contact is created in Hubspot, Zapier will be triggered to retrieve the new contact's properties, including the "Name" property I created in [1].

pkuona19_0-1640770517208.png

 

3. I then run a Filter step which looks for new contacts for which the "First Name" and "Last Name" properties DO NOT EXIST, but the "Name" property exists. In the image below, the first two properties are the "First Name and Last Name" properties. The last property is the "Name" property I created in the first step.

pkuona19_1-1640770684875.png

 

4. Next, I then use the Formatter by Zappier app to split the "Name" property entry into two separate fields which are both returned after splitting. These will be used later to update the "First Name" and "Last Name" properties of the same contact.

pkuona19_2-1640771019866.png

 

5. Now to update our contact! Add the action "Create or Update Contact in Hubspot". 

pkuona19_4-1640771122231.png

 

To update a contact, make sure to update the "contact information: email address" and "contact information: Name" properties with the data you retrieved in Step 1. This will prevent creating a second contact but will just update the existing contact instead. Just showing the email example only below.

pkuona19_5-1640771366588.png

 

6. Use the fields returned from Step 4 by the Formatter to populate the First Name and Last Name properties of your contact!

pkuona19_3-1640771091961.png

 

7. Turn on the Zap! You are done. Automation!

 

pkuona19
Member

@Hannah3 Check out my guide above on how you can split the full name field to first and last name properties. 

Jonno_Price
Contributeur de premier rang | Partenaire solutions Platinum

Just to add something quite interesting - in the Chatflow module you can use the full name property called "Contact Name" and HubSpot will automatically split into first and last name for you. I've tested and it works perfectly. So this is already in place for chatflow properties - seems a fairly small step to extend this to the forms module.

 Screenshot 2022-03-17 at 14.54.41.png