Form - Dependent fields repeating for 100 inputs. What's the best approach?
resolver
Hi, I'm working on a complex project with multiple forms and dependent inputs, and I'm wondering what would be the best approach. Basically, the user is reviewing products he likes (in a list of 100 products, separated by categories). The users sees a checkbox + image of product + name of product (for each product). When a box is checked, 2 new fields have to appear right below it for rating and commenting on that checked product.
I was thinking of separating each category on a separate form (about 6 categories) so the page isn't too long to load.
1st question: Is there a way to reuse the rating and comment fields, or do I really have to create 100 rating, and 100 comment fields?
2nd question: Is there a way to work on my form in a text editor (Sublime) and once everything is to my liking, importing it to Hubspot?
3rd question: can I add content (let's say the product image for example) in jQuery on document load if it's not possible to add an image next to a checkbox? Or will that create problems? Or adding it with the css content value?
If someone has another idea on how to approach this, please let me know! Thanks!
Conditionals in HubSpot forms are always tricky, but I'm going to do my best to help you out 🙂
1. The way the forms integrate with the Contacts DB won't allow you to reuse forms, because when you create a custom field/property, it updates that field on your contact record. So for example, if I checked favorite product 1, and I fill out the 2 conditionals that pop up, that data would be stored on my contact. But as soon as I feel out favorite product 2, that data is then overwritten, since there is only 1 "property" to write to that matches the paramaters.
2. The forms are auto generated by us on the server side, so you wouldn't be able to re upload. HOWEVER, there is a somewhat 'hacky' solution to this, that I'll explain below. *
3. I've never actually tried this, but from messing with inspect element, it seems plausible. But after looking at the code, you may be hard-pressed to be able to target down to a specific check box ( you would probably be utilizing a lot of nth-child).
** Long before I was working at HubSpot, I worked for a software company. My job title said "developer" but really it was more about pushing the capabilities of HubSpot's tools and COS. What I have found out is that, you can wite a form in complete HTML, and using the class/reactid on your embedded form, you can create a form that will successful update to your contacts DB. This solution actually doesn't use any custom JS to POST either.
Although I can't recommend this for a very serious implementation, My Fundraising Grader may be on the right track for what you are looking to to accomplish.
Conditionals in HubSpot forms are always tricky, but I'm going to do my best to help you out 🙂
1. The way the forms integrate with the Contacts DB won't allow you to reuse forms, because when you create a custom field/property, it updates that field on your contact record. So for example, if I checked favorite product 1, and I fill out the 2 conditionals that pop up, that data would be stored on my contact. But as soon as I feel out favorite product 2, that data is then overwritten, since there is only 1 "property" to write to that matches the paramaters.
2. The forms are auto generated by us on the server side, so you wouldn't be able to re upload. HOWEVER, there is a somewhat 'hacky' solution to this, that I'll explain below. *
3. I've never actually tried this, but from messing with inspect element, it seems plausible. But after looking at the code, you may be hard-pressed to be able to target down to a specific check box ( you would probably be utilizing a lot of nth-child).
** Long before I was working at HubSpot, I worked for a software company. My job title said "developer" but really it was more about pushing the capabilities of HubSpot's tools and COS. What I have found out is that, you can wite a form in complete HTML, and using the class/reactid on your embedded form, you can create a form that will successful update to your contacts DB. This solution actually doesn't use any custom JS to POST either.
Although I can't recommend this for a very serious implementation, My Fundraising Grader may be on the right track for what you are looking to to accomplish.
Form - Dependent fields repeating for 100 inputs. What's the best approach?
resolver
Thanks for the quick reply!
Regarding #3: I found a way without using nth-child. It also englobes it in the label for, so clicking it also selects the checkbox. Then again, the only downside is I'll have to create a line for each of my 100 products. 😕
Form - Dependent fields repeating for 100 inputs. What's the best approach?
resolver
From experience, Hubspot is not the best tool for complex, multipage forms with conditionals. I would suggest using Surveymonkey and the integration with Hubpsot for this. You can use rating and matrix fields that are better for your intended purpose.