• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

How to combine show / hide and If-else conditions in a Text Field based on Checkbox Selections

Community Beginner ,
Apr 29, 2020 Apr 29, 2020

Copy link to clipboard

Copied

I am working on a pavilion rental form and having trouble with code in one specific section.

 

There is a "total" text field that will reflect a dollar value. The value is determined by which checkbox "pavilion" a user wants to rent. The if-else conditions I created for this work as I intend.

 

event.value = 0;
if (this.getField("Roller Hockey").value!="Off") event.value=53;
else if (this.getField("Tot Lot").value!="Off") event.value=53;
else if (this.getField("VP Large").value!="Off") event.value=80;
else if (this.getField("Submarine").value!="Off") event.value=53;
else if (this.getField("Mermaid").value!="Off") event.value=53;
else if (this.getField("TSC Large").value!="Off") event.value=80;
else event.value = "0";

 

However, there are separate checkboxes for the time period a person wishes to rent, since they are booked in half-day periods. I want the "total" text field and value from the if-else conditions to show or hide based on which time period is selected. 

 

if (this.getField("8 AM – 12 PM").value != "Off") {
this.getField("Total1").hidden = false;
} else {
this.getField("Total1").hidden = true;
}

 

I can get both codes to work individually, but I don't know how to combine them so they can run together. I am fairly new to JavaScript and learning as I go along. Any help would be greatly appreciated.

TOPICS
Acrobat SDK and JavaScript

Views

469

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 Expert ,
Apr 29, 2020 Apr 29, 2020

Copy link to clipboard

Copied

Just put them all in the same script... However, you can change the reference from his.getField("Total1") to event.target in that case. Also, you should not use the hidden property, as it was deprecated a while ago. Use the display property, instead.

Votes

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 ,
May 04, 2020 May 04, 2020

Copy link to clipboard

Copied

When I put them all in the same script it doesn't work. In the case of the script below - the "Total1" field remains hidden regardless of whether the checkbox is selected or not. But as I said - I am a complete newbie to this. Most of what I've taught myself is just from trying to rework examples and explanations from other posts/pages I've found. I'm assuming when I'm putting it together I'm doing something entirely wrong in the script. Did I even come close to what you were trying to explain? See below:

 

if (this.getField("8 AM – 12 PM").value != "Off") {
event.target.display = false;
} else {
event.target.display= true;
}

 

event.value = 0;
if (this.getField("Roller Hockey").value!="Off") event.value=53;
else if (this.getField("Tot Lot").value!="Off") event.value=53;
else if (this.getField("VP Large").value!="Off") event.value=80;
else if (this.getField("Submarine").value!="Off") event.value=53;
else if (this.getField("Mermaid").value!="Off") event.value=53;
else if (this.getField("TSC Large").value!="Off") event.value=80;
else event.value = "0";

 

Votes

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 Expert ,
May 04, 2020 May 04, 2020

Copy link to clipboard

Copied

The "display" property is not a boolean. Change the first part to:

 

if (this.getField("8 AM – 12 PM").value != "Off") {
event.target.display = display.hidden;
} else {
event.target.display= display.visible;
}

Votes

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 Expert ,
May 04, 2020 May 04, 2020

Copy link to clipboard

Copied

Also, make sure there are no error messages in the JS Console after you enter the code and then change the value of ones of the fields in the file.

Votes

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 ,
May 04, 2020 May 04, 2020

Copy link to clipboard

Copied

I made that change and it still didn't work. I tested both scripts individually and found the top one for hidden/visible still would not work. I ran the JS debugger and saw quite a few listings of "TypeError: this.getField(...) is null 2:Field:Calculate" - I'm not familiar with the debugger or how to address errors listed - but I took a guess and changed the name of the checkbox to "HalfDayMorning" and adjusted it in the code as well. I also swapped "hidden" and "visible" in the code since it was hiding it when checked, and showing it when unchecked.

 

It is now working exactly as I wanted it to with this as the final code:

 

if (this.getField("HalfDayMorning").value != "Off") {
event.target.display = display.visible;
} else {
event.target.display= display.hidden;
}

event.value = 0;
if (this.getField("Roller Hockey").value!="Off") event.value=53;
else if (this.getField("Tot Lot").value!="Off") event.value=53;
else if (this.getField("VP Large").value!="Off") event.value=80;
else if (this.getField("Submarine").value!="Off") event.value=53;
else if (this.getField("Mermaid").value!="Off") event.value=53;
else if (this.getField("TSC Large").value!="Off") event.value=80;
else event.value = "0";

 

However, this is what now shows in the debugger. I'm not sure if I need to, or how to address this. The "Total1" field is the only one in the document with custom JS.


TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate
TypeError: this.getField(...) is null
1:Field:Calculate

Votes

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 Expert ,
May 04, 2020 May 04, 2020

Copy link to clipboard

Copied

LATEST

This error message means the field name you used in the first line of the code is incorrect.

Votes

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