Can't get hidden marketo field to show when changing <select> option via javascript

[Bruno_Gomes]

Hello,

I'm attempting to change a <select> option based on the page URL. I have different hidden fields set to display based on the option chosen.

So for example... if url is /yyy/ it will change the select field option to the "yyy" one.

<select id="form-select">
<option value="yyy">yyy option </option>
<option value="zzz">zzz option </option>
</select>

My issue is that while the select option properly changes using (document).ready + MktoForms2.whenReady, the hidden field associated with that select option does not display. It only works properly when I manually select it using my mouse. 

@SanfordWhiteman sorry to tag you, do you have a proper solution to this approach?

I'm using a combo of jquery and the 2.0 api to try and accomplish this.

With targeting form ID:

$(document).ready(() => {
    MktoForms2.whenReady((mktoForm) => {
      var formId = form.getId();
      if (formid == xxxx) {
        $('#form-select').val('yyy');
      }
    });
  });

No form ID targeting:

$(document).ready(() => {
  MktoForms2.whenReady((mktoForm) => {    
      $('#form-select').val('yyy');
  });
});

Any info/help is very much appreciated. Kind regards,

Bruno

[SanfordWhiteman · Accepted solution]

Use form.setValues to stay within the Forms 2.0 event model. When you make direct changes to the document, you can't rely on custom events.

[Bruno_Gomes]

Perfect that worked wonders thank you!

One quick question:

The hidden <select> field is missing the default "Select..." from the options. All the non hidden ones have it properly, but for the hidden field for some reason it's missing so it's just blank. I compared the hidden with the non-hidden ones and the ONLY difference is Visibility Rules: Enable.

I'm curious why that is just missing when something is set to hidden. Any ideas?

Some pics for reference..

Form loaded (my existing product is the hidden field)

This picture shows 2 select in the marketo settings and they have no differences other than the visibility settings.

This is the hidden field setting it shows that "Select..." is there but on the form itself it dosn't show in the HTML.

Kind regards,

Bruno

Edit: nvm i figured it out was in the visibility settings i had to add the fields again but didn't have the "Select...|"