Javascript to display text if a radio button is checked

Community Beginner ,
Jul 05, 2022 Jul 05, 2022

Copy link to clipboard

Copied

I have a form that has 4 groups of radio buttons with the values Yes and No. This is how I have it set up:

 

The first radio button group is titled AS. Each option has the title AS under the General Tab and under the Option tab the "Radio Button Choice" is either Yes or No.

 

What I want to do is display a simple message formated with red text to the user if they select Yes in this group

 

My thought was to have a text field with the tool tip containing has my message and then to use the following code:

 

var ASValue = this.getField("AS").valueAsString;

if (ASValue == "Yes"){

    event.value = Message.userName; //Message is the name of the text field that I want to put the default message in, userName is the tooltip in that same field.

} else {

   event.value = "";

}

The way I look at it, this code should display the tooltip as the default value of the message text field if they select the Yes radio button. If they select No, the message would disappear. It doesn't work at all. I have tried to add this to the Validate and the Calculate tabs for the Message text field and nothing happens.

Once I get that to work I will add OR statements for the other fields in a more complicated code like this:

var ASValue = this.getField("AS").valueAsString;
var GorBValue = this.getField("GorB").valueAsString;
var OSDValue = this.getField("OSD").valueAsString;
var DMValue = this.getField("DM").valueAsString;

if (ASValue == "Yes" || GorBValue == "No" || OSDValue == "Yes" || DMValue == "No"){

    event.value = Message.userName;

} else {

   event.value = "";

}

The above code would display the tooltip of the Message field if any of the radio buttons are selected Yes or No depending on the question.

 

Any tips on what I am doing wrong would help. If there is a better way to display a message instead of in a text field let me know. I couldn't find a way to conditionally display a message from just a text box.

 

 

TOPICS
How to , JavaScript

Views

82

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Adobe Community Professional , Jul 05, 2022 Jul 05, 2022

Hi,

 

If I understood your requirement correctly, you don't need to employ a tooltip with JavaScript to display a message on a textfield. That is, unless your end is to have a field that will display a tooltip only when the user hovers the mouse pointer over it.

 

Also, in this particular case, you don't need to declare in your script variables that will get the "valueAsString" for each one of the radio buttons in order to establish an IF/ELSE condition.

 

You may be trying to cram up too many t

...

Likes

Translate

Translate
Adobe Community Professional ,
Jul 05, 2022 Jul 05, 2022

Copy link to clipboard

Copied

Hi,

 

If I understood your requirement correctly, you don't need to employ a tooltip with JavaScript to display a message on a textfield. That is, unless your end is to have a field that will display a tooltip only when the user hovers the mouse pointer over it.

 

Also, in this particular case, you don't need to declare in your script variables that will get the "valueAsString" for each one of the radio buttons in order to establish an IF/ELSE condition.

 

You may be trying to cram up too many things based on the choices that the users will make when checking or unchecking the four pairs of radio buttons.

 

I admit that I am not very good with JavaScript scripting and the script that I am sharing below as an example may have errors. 

 

But in my humble opinion, you may need to consider to understand first how radio buttons work versus the intended result(s) in your PDF,  specially when they're grouped in pairs of mutually exclusive radio buttons (same name but different export values). 

 

In any case, I tested a few things using the  Adobe Acrobat SDK JavaScript API JavaScript™ for Acrobat® API Reference and this is what I came up with:

 

 

var ASValue = this.getField("AS").value;

var GorBValue = this.getField("GorB").value;

var OSDValue = this.getField("OSD").value;

var DMValue = this.getField("DM").value;

event.value = (ASValue=="Yes" || OSDValue=="Yes" && GorBValue=="No" || DMValue =="No") ? "My message appears here" : "";

 

 

Note that I am employing this script as a custom calculation script in the "Message" text field. And the conditions are declared based on the example that you posted.

 

In addition,  if you don't necessarily need an actual tooltip (which will only display such tooltip as a small yellow banner when the mouse pointer enters that text field), I formatted the font color to red and made this field readonly. The users will not feel the need to mess around with it, for example.

 

You may copy and use this script in your form and Give it a try.

 

See if this is a step in the right direction.

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jul 06, 2022 Jul 06, 2022

Copy link to clipboard

Copied

Thanks ls_rbls that worked perfect! I did change the && code because it is always Or in this case. I didn't need to use the tooltip, I had just done it this way for another part of the form and thought it would work right for this part too.  

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Jul 06, 2022 Jul 06, 2022

Copy link to clipboard

Copied

LATEST

You're very welcome.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Community Professional ,
Jul 06, 2022 Jul 06, 2022

Copy link to clipboard

Copied

For your first script posted, to show tooltip as value of that field change:

this:

Message.userName;

with this:

event.target.userName;

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines