How to change select option in HubSpot forms via a click event


#1

I'm trying to change a form field in Hubspot form on a click event. Following is the JS for the same:

$("#BUTTON ID").on("click", function() {
$("#HUBSPOT FORM SELECT ID").val(1).change();
$('html, body').animate({
scrollTop: eval($("#SECTION ID").offset().top - 75)
}, 1000);
});

The scroll part is working fine, but the value is not being changed. Can anyone help me to solve this?


#2

Hi @swapnilmr,

Is the form field a radio select or a dropdown select? Are you sure your selector is targeting the input element? Can you give me a link to the page you're referring to?


#3

It's a dropdown select. It's on https://www.aujas.com/careers/experienced


#4

Hi @swapnilmr,

Dropdown selects are a bit tricky, since you technically want to select the option in question and change its selected property. Try something like this:

$('select[name="test_dropdown_select"] > option[value="Desired Value"]').prop("selected", "selected").change();

#5

Thank you so much! It's working!


#6

How would you change this code to apply to a multi-select checkbox instead of a dropdown?