FORM in custom modules

SOLVE
MichalC
Participant

Hello, is there any possibility that HS developers have changed something in the way of loading hs forms in custom modules? I have an issue while adding two same custom modules to one landing/website page. What I've noticed is that now hs form is loaded in container with ID "hs_form_target_{{ module name }}".  So in case you are adding two same custom modules, you've got two same IDs on one page. And if I get it right, the form from the second module is loading in the first container and overrides the correct one while the second module is empty.   Is there any way to avoid it?


M.

0 Upvotes
1 Accepted solution

Accepted Solutions
piersg
Solution
Key Advisor

I think you just need to remove form_key="{{ blockname }}" . When I use the above code, Hubspot gives the wrapping div a unique id in each iteration of the module e.g. "hs_form_target_form_34625612" and "hs_form_target_form_127648987", whereas yours is repeating "hs_form_target_ctaDefault06".

View solution in original post

4 Replies 4
piersg
Key Advisor

Hi @MichalC, how are you adding the form to your custom module? 

 

My recommendation would be to add a form selector field in the custom module, then use this HubL where you want the form

{% form
  form_to_use="{{ module.form.form_id }}"
  response_response_type="{{ module.form.response_type }}"
  response_message="{{ module.form.message }}"
  response_redirect_id="{{ module.form.redirect_id }}"
  response_redirect_url="{{ module.form.redirect_url }}"
%}

 

This will allow you to have the same module multiple times on one page and have different forms in each iteration/version of said module

MichalC
Participant

Hello @piersg , thank you for quick reply. The problem is that it used to work all fine, and I am already using it that way : 

 

MichalC_0-1637843191036.png

The problem is that if you will add two sam modules on one page, form from the second module is loading in the first one,


As I mentioned, I have added two modules and each of them has same conteiner ID (which is added automaticly) and I think that can cause the problem.  

 

I have created simple page, try to hit refresh button while you visit this page, it will load different forms at each time
here is a sample : page 

 

0 Upvotes
piersg
Solution
Key Advisor

I think you just need to remove form_key="{{ blockname }}" . When I use the above code, Hubspot gives the wrapping div a unique id in each iteration of the module e.g. "hs_form_target_form_34625612" and "hs_form_target_form_127648987", whereas yours is repeating "hs_form_target_ctaDefault06".

View solution in original post

MichalC
Participant

@piersg thank you!  that was the issue.