Javascript in HTMLViewer

I am loading a web form in an HTMLViewer (Desktop Xojo 2018r3) that I have to consistently use many times throughout the day.

The web form has 3 text boxes (firstname, lastname, tag) and 2 checkboxes (labeled email and text). When the email checkbox is clicked, an email field appears. When the text checkbox is clicked, an phone number field appears.

In the document complete event, I am able to fill in all the fields - even the hidden fields. However, when I programmatically check the checkboxes, the hidden fields do not appear. In this case, I cannot submit the form until I physically check the checkboxes and show the hidden fields. (not the worst thing - but it would be nice to not have to click these checkboxes manually every time)

I have tried different code such as:

me.ExecuteJavaScript (“document.getElementById(‘email’).click()”)

and

me.ExecuteJavaScript ("document.getElementById(‘email’).checked = true ")

which will check the checkboxes but not cause the hidden input boxes to appear.

I am not a javascript expert by any means, so I am not sure why the code will run when I physically check the checkbox but not when I programmatically check the boxes. Do javascript functions have to reload during every event?

If I try to programmatically make the text boxes visible, nothing happens.

me.ExecuteJavaScript ("document.getElementById(“email_text”).visible = ‘block’ ") //doesn’t work

Is there a trick to making these events happen?

We need the source of the page you’re trying to automate to help.

I only know

document.getElementById("email_text").style.display = 'block'

and

document.getElementById("email_text").style.visibility = 'visible'

CSS would make following input boxes visible if correct CSS rule is given.
Should work without refresh.

I can’t post the page url because there is a token used.

I do see that there is an event (click) on the checkboxes with the following code:

function() { var e = $(this).closest("form"), t = e.find("#" + $(this).attr("for")); $('[id="' + $(this).attr("for") + '"]').length > 1 ? (t.trigger("click"), emailPhoneToggle(t, e)) : emailPhoneToggle(t, e, !0) }

Shouldn’t this event run when the following javascript is executed:

me.ExecuteJavaScript (“document.getElementById(‘email’).click()”)

Maybe this helps:
https://developer.mozilla.org/en-US/docs/Web/Guide/Events/Creating_and_triggering_events

and from Your source:

t.trigger("click")

gets

document.getElementById('email').trigger("click")

or

$('email').trigger("click")

Is all jQuery…

Click no longer works in some platforms.

You better want to set email with

me.ExecuteJavaScript ("document.getElementById('email').checked = true ")

In modern browsers, there is a difference between setting a value in code, and when the value is the result of a user interaction.

I believe you are bumping into that. Don’t expect an event that happens only when the user actually clicks the control. If you need things done, when you set the checkbox in code, you want to call the method yourself.

I don’t need the URL if you provide the full HTML and Javascript. Maybe I can help point you close though. From the snippet you’ve provided, there’s a function called emailPhoneToggle. You will want to check if that changes any flags before submitting the form. It’s possible the field doesn’t need to be visible for the value to be passed. Otherwise, you’ll have to call emailPhoneToggle to set things up as if a user performed the action.

Thanks. It looks like this is exactly what is happening. We were planning on switching providers, however this solution might not be optimal for us right now.