Form Checkboxes and Radio inputs wont unset in Hubspot forms

Regular Contributor | Platinum Partner

Hello,

I am trying to create an Unselect All function for a hubspot form.

You can see the preview of the page here:

https://preview.hs-sites.com/_hcms/preview/template/multi?is_buffered_template_layout=true&portalId=...

 

I have added a second form above the first form it is titled Arbitrary Radio Buttons and has 2 radio inputs. The form below also has radio inputs. The non hubspot form radio inputs work as expected but the form inputs wont release/reset the radio inputs.

 

This is the code that unsets the regular radio inputs.

 

$('.hs_unsubscribe_from_all input[type="checkbox"]').click( function() {
          if ($(this).prop("checked")) {
              $(':radio').each(function () {
                $(this).removeAttr('checked');
                $(this).prop('checked', false);
              });
              $('.hs-fieldtype-radio label, .hs-fieldtype-checkbox label').removeClass('active');
              $('.hs-fieldtype-radio, .hs-fieldtype-checkbox label').find('ul.inputs-list').slideUp();  
          }
      });

 

I have been unable to tell what the difference between these two forms are other than one was created in hubspot and the other is just html.

Any help would be appreciated.

Noah Armstrong | TSL Marketing
Senior Developer
6085 Marshalee Dr| Suite 100 | Elkridge, MD 21075
Contact Us

TSL Marketing
Reply
0 Upvotes
1 Reply 1
Esteemed Contributor | Diamond Partner

@narmstrong 

 

It might be related to this from the Advanced Form Options documentation: https://developers.hubspot.com/docs/methods/forms/advanced_form_options

 

Screen Shot 2019-05-02 at 4.18.31 PM.png

I have come across issues like this in the past - though I can't remember off hand what the solution was (it was a while ago). Probably has something to do with how the HubSpot form(s) are rendered and mounted via React and how it keeps track of the state of the forms input values if I had to guess.