Question regarding dependent fields within a form

Hi all,

I have come across a problem when creating a submission form. I have searched the forums for a definite answer, but I did not come across a similar situation, or at least not for my understanding.

Situation:

For example, I am trying to create a form that will provide me with information for one of three scenarios:

  1. Dropdown menu: where you can choose to provide the name of one, two or three contacts, with each choice showing a different follow-up.
  2. Dependent field choice for 1 contact: shows you the field to provide details on 1 contact via property [contact_name_1].
  3. Dependent field choice for 2 contacts: shows you the fields to provide details on 2 contacts via properties [contact_name_1] and [contact_name_2].
  4. Dependent field choice for 3 contacts: shows you the fields to provide details on 3 contacts via properties [contact_name_1], [contact_name_2] and [contact_name_3].

So if you were to select ‘1 contact’, you would get 1 property field. When you select ‘2 contacts’, you will get 2 property fields, etc.

Problem:

The problem is when I try to apply this logic, it gives me a warning saying ‘the form has a duplicate field’, which confuses me. We established that if you make a choice, you will see the properties that match that choice, hence there will be no duplicate fields.

If my theory is correct, it suggests i need to do the following:

  • I need to create the following property for the option ‘1 contact’ [contact_name_1].
  • I need to create the following properties for the option ‘2 contacts’ [contact_name_1.2] and [contact_name_2].
  • I need to create the following properties for the option ‘3 contacts’ [contact_name_1.3], [contact_name_2.2], and [contact_name_3].

If this is the case, it would overcomplicate the process and flood the system with unnecessary data that needs to be combined afterwards.

Hopefully, someone is able to clear this up for me and steer me in the right direction. All help is welcome!

Hello @Wijtmans thank you for posting in our Community!

You can only add dependent form fields to a regular form field. You cannot add a level or layer to a dependent form field. For example, you cannot add a dependent form field to an existing dependent form field, more information here,

I want to invite our top experts @Josh @franksteiner79 @Mike_Eastwood any recommendations to @Wijtmans matter?

Thank you,

Pam

Hi @Wijtmans

The dependent fields are useful for simple logic, as soon as things get a little complicated the only way to handle it is with custom code.

The way I would handle it is to create a Custom Module, that holds the HubSpot Form (which must be set to Raw HTML). You can then customise the Embed Code in the Module to manipulate the Form with JavaScript. In your form you will need to show all the hidden fields and hide them with JavaScript if you hide the fields the JavaScript cant targte the fields.

If your eyes glazed over and you think I’m speaking a foreign language - that’s understandable - I’m a geek. And, it’s a reasonably geeky job to do.

Have fun

Mike

Here to learn more about HubSpot and share my HubSpot Knowledge. I’m the founder of Webalite a Gold HubSpot Partner Agency based in Wellington, New Zealand and the founder of Portal-iQ the world’s first automated HubSpot Portal Audit that helps you work smarter with HubSpot.

Thank you for your answers @Mike_Eastwood and @PamCotton.

So it is linked to a layer. I thought (hoped) my case was different, but it probably makes sense in the backend.

As for generating custom code, I need most of the forms to be uniformly applicable to decrease operating costs. Not to mention that I have only performed a couple of Codecademy courses, so in no way am I qualified to take on this challenge!

Seems that I have to make do with single layer structures, which will do the trick in some way. It just doesn’t look as good as an unfolding structure. I think i will create ‘buttons’ to unfold the creation of a second and third contact.

Thanks again for the insights!